Zeplin automatically generates resources, including measurements, assets, and code snippets tailored to the platform's needs.
Here's a list of features that will help you develop Web projects:
Measurements are in pixels.
Assets are available as:
PNGs and optimized PNGs (1x, 2x, 3x)
SVGs and optimized SVGs (with SVGO)
JPGs and optimized JPGs (1x, 2x, 3x) (for Bitmap images only)
WebPs (1x, 2x, 3x).
For responsive designs, you can measure the distances as percentages, or you can enable rem unit to inspect them in em/rem.
Generating CSS, Sass, SCSS, Less, Stylus snippets from layers, colors, and text styles.
Grids from layouts in Sketch, Figma, and Photoshop are accessible: Exporting grid layouts from design tools.
Generating HTML snippets from assets as img tag.
Generating HTML snippets from text layers if the text style name matches an HTML tag (such as h1 , h2 and so on).
You can learn more about CSS and HTML code snippets in Zeplin here: Exporting CSS and HTML.