Adobe Video

Photoshop's new 'Copy CSS' feature explained

Discover how Photoshop's latest upgrade enables you to generate CSS from a website mockup.

Yesterday we gave you the highlights of new changes to Photoshop announced by Adobe, now available to online subscribers via Adobe's Creative Cloud service. Web designers have been particularly intrigued by the new "export to CSS" function, and Adobe has since released this video showing how it works in practice.

In the brief clip, Photoshop product manager Stephen Nielson, demonstrate how the new feature enables designers to quickly export CSS markup for text and shape styling. Basically, you can right-click on a layer or group, and choose 'Copy CSS' and Photoshop generates code which you can paste into your code editor.

If you like the idea of the new feature but you're unwilling to take out a subscription to the Creative Cloud, you might want to investigate CSS Hat, a $29.99 plugin that provides similar functionality.

Also read:

Are you tempted by the new feature - or do you think modern web design should be done in the browser? Let us know your views in the comments below.

Log in to Creative Bloq with your preferred social network to comment

OR

Log in with your Creative Bloq account

Social tabs

47K and
growing
Join our Facebook community

Discuss your projects. Win prizes. Get your hands on the best freebies. And much more!

115K across the
network
Follow us on Twitter

Follow us to keep up with the hottest news in 3D, web design, graphic design, and more!

RSS INSTANT
NEWS
Get instant news

Get our posts direct to your news reader of choice. We recommend Google Reader for beginners.

Get our newsletter!

Sign up to receive a summary of the week's hottest design news from around the web! (Coming soon.)

site stat collection