CSS3 + PS

[beniston]

This is a free photoshop plugin that converts your layers to CSS3.

http://css3ps.com/

Please comment on its usefulness designers. They claim that this plugin has something which Photoshop doesn't have.

[finoy]

Yes Beniston, it's very useful. previously we did this things support of 2, 3 websites. like:
http://www.colorzilla.com/gradient-editor/
http://border-radius.com/
http://css3gen.com/box-shadow/
http://css3generator.com/

[RaJesh Balakrishnan]

Thank you for sharing, I tried and working fine with CS5

CSS3Ps can interpret Photoshop layer styles really well. But be careful, it doesn’t understand all layer styles available in Photoshop. CSS3Ps only understand layer styles which widely used in web design. Supported layers styles are: Stroke, Inner Shadow, Drop Shadow, Color Overlay, Gradient Overlay and Inner Glow. However, after testing we found out that CSS3Ps do not understand stroke type outer, inner or center. It always set the stroke setting to outer. Which means if you use inner shadow 2px to make 1 pixel inset style on a button, in CSS3 codes you will ended up in 2 pixels inset shadow.

More about CSS3Ps & Supported Features
o Multiple Layers – You can select several layers and groups of layers and convert them in one click
o Prefixes – support prefixes for all popular browsers: “-webkit-” for Safari and Chrome, “-moz-” for Firefox, “-ms-” for IE 10 and “-o-” for Opera.
o Blending – for now only normal modes supported but will add other blending modes soon
o Size – convert size of layer (shape or bitmap) to CSS width and height properties
o Border Radius – calculate border radius for shape if it is possible to represent the shape as a rectangle with rounded corners; you can convert really a lot of shape types
o Bevel and Emboss – do not support it yet
o Stroke – is converted into CSS border property
o Inner Shadow – is converted into CSS box-shadow property
o Inner Glow – is converted into CSS box-shadow property
o Satin – we do not support it
o Color Overlay – do not support it for now but will add it soon
o Gradients Overlay – for now support only linear gradients but they will add radial and reflected gradients soon
o Pattern – do not support it for now but they are working on it
o Outer Glow – is converted into CSS box-shadow property
o Drop Shadow – is converted into CSS box-shadow property
o Text Layers – working on adding styles for text layers