Going from Photoshop comp to code just got easier.
New Creative Cloud Extract reinvents the comp-to-code workflow for web designers and developers. Now you can share and extract vital design information from a PSD comp — including colors, fonts, CSS, and assets — to use when coding mobile and desktop designs.
Extract in action.
Extract Assets in Photoshop CC lets web designers define optimized assets in record time. And when designers share PSDs via Creative Cloud, developers can unlock key design information and download assets within their browsers. In Dreamweaver CC, Extract offers contextual code hinting and asset extraction within the coding environment.
Extract Assets in Photoshop CC
Designers who create Photoshop comps can quickly define and package image assets from individual layers, using a simple, visual interface built on top of Adobe Generator. This speeds up production time so designers can spend more time designing.
Extract in Dreamweaver CC
Web designers and developers can now view PSDs in Dreamweaver and use contextual code hinting to easily define fonts, colors, and gradients in their CSS. They can also drag and drop optimized images into the Live View surface, copy text, and more.
Extract in Creative Cloud Assets
Web designers can share PSDs directly from Creative Cloud Assets so developers can quickly extract design information in the browser — colors, gradients, fonts, text, CSS, and more — that helps them turn the comp into code. Plus, they can export optimized PNG, SVG, and JPG images for the web.
Extract in Brackets (preview)
Web developers can now work with PSDs directly within Brackets, a lightweight code editor. They can use the Extract extension to obtain design information and assets from a PSD as they code, powered by Creative Cloud Assets.
Connected to Creative Cloud.
Because Extract is a service of Creative Cloud, it lets you seamlessly share comps from Photoshop CC to Creative Cloud Assets in your browser — simplifying the comp-to-code workflow and making PSDs instantly accessible for use in Dreamweaver CC.
Creative Cloud brings together the world’s best creative apps for desktop and mobile, plus more connected ways of creating and sharing. Learn more ›
Related apps and services