Inspect, get assets and specs

Inspect designs, export Retina-ready images, generate code from layers, get measurements and pick colors.

Matous Roskovec avatar Bolek avatar Maks avatar
23 articles in this collection
Written by Matous Roskovec, Bolek, and Maks
Get code and styles from layers

Copy styles from the Design overview in Avocode

Instantly recognize and inspect same layer styles across PSD, AI, Sketch, XD, and Figma designs.
Matous Roskovec avatar
Written by Matous Roskovec
Updated over a week ago

Export CSS, Swift, Android & React Native code from design layers in Avocode

You can generate CSS, Sass, Stylus, Less, SCSS, CSS in JS, Styled Components, Swift, Android, React Native code directly from layers.
Bolek avatar
Written by Bolek
Updated over a week ago

Quickly copy HTML and export image assets via context menu in Avocode

Quickly export design layers as image assets, copy code, or copy text wrapped in html tags using the context menu.
Bolek avatar
Written by Bolek
Updated over a week ago

Supported code export languages in Avocode

Export pure standards-based CSS, Sass, Stylus, Less, SCSS, CSS in JS, Styled Components, Swift, Android, and React Native.
Bolek avatar
Written by Bolek
Updated over a week ago

Supported blending modes in Avocode

Avocode can display blending modes from Photoshop or Sketch in the Styles and Code panels.
Bolek avatar
Written by Bolek
Updated over a week ago

Create or import variables and replacements rules in Avocode

Create variables from colors, measurements and other properties. Customize the code output by using replacement rules.
Matous Roskovec avatar
Written by Matous Roskovec
Updated over a week ago

Import missing fonts to designs in Avocode

If some of the fonts in a design are missing, please import them from your Typekit, system Font Book or directly.
Matous Roskovec avatar
Written by Matous Roskovec
Updated over a week ago