Smooth design to code workflow
Open PSD & Sketch designs on Mac, Windows, and Linux with Avocode. Generate CSS, Swift & XML straight from layers and export images, colors, fonts, styles, sizes and measurements.Try Avocode for free
Open .psd & .sketch without Photoshop & Sketch
Avocode renders Photoshop and Sketch designs on its own. Therefore, you can open and inspect all designs you upload to Avocode on any OS system without other design tools.
Supported formats: PhotoshopSketch
Export CSS, Swift, Android & React Native code from a design
Generate concise CSS, Less, Sass, Less, SCSS, Stylus, Swift, Android, & CSS in JS code including layer and font styles, units in px, pt, and dp and colors in HEX, UIcolor or HEX8.
supported platforms: webiOSAndroid
Export images up to @4x or xxxhdpi resolution
Selects a layer, multiple layers or a slice of the design and export it as an image. Add more variants for various resolutions. You can even upscale and export vector shapes to fit any desktop, iOS or Android screen.
Supported formats: svgpngjpegWebP
Handpicked #BADA55 colors
Manually copying colors and converting them... that is so yesterday. Just pick a color and the color code will be immediately added in your clipboard, so you can paste it where you need it.
Supported formats: hexhex8rgbahslauicolor
Export text layers as plain text, images or html code
When you select a text layer, you can export it as an image, copy plain text or copy text with html tags. The STYLES panel will show you everything like font-family, font-weight, and font-size.
Precise measurements, no eye-balling
Instantly grab any size or distance. Add, move, and remove guides that allow you to check precise alignment. You can also use them to measure a distance from any object to any place. #goodbyemarqueetool
Supported units: pxptdp
Define anything as a variable
You can customize the code output by hiding and reordering its parts. Define and replace any value (colors, font, gradient, size, distance) in the code as a variable and it will automatically appear in the exported code.