Bobby Grace, on the Dropbox Paper team:
On the engineering side, we use inline SVGs. These have many advantages. One advantage is that SVG is a well-structured format that we can manipulate with code. Paper is also using React and has a component for inserting icons.
- Use a single Sketch file, checked into the repo, as the place to design and house all the icons.
- Use gulp-sketch to extract them all individually.
- The build script continues by optimizing them all and building a source of data with all the icons and their properties.
- That data fuels the their
React component. (Also see our article).
They call it Papercons.
Now, whenever someone asks for an icon, we can just share a link to all the latest production icons. No more hunting, context switching, and long conversation threads.
CSS Tricks Go to Source
Author: Chris Coyier
Powered by WPeMatico