CSS Hat
Today we are going to look at a tool that takes a design from Photoshop to the web in a click: CSS Hat.
Topic : Photoshop / css
What It Is ?
CSS Hat is not fully aimed to build an entire site without writing code, rather it’s a way to grab CSS3 styles on a single element.
CSS Hat is not fully aimed to build an entire site without writing code, rather it’s a way to grab CSS3 styles on a single element.
CSS Hat is not a standalone application, it’s a Photoshop plugin. It's not like a heavy photoshop plugin but its just a small plugin to provide a text-based output. CSS Hat has the ability to look and analyze a layer in Photoshop and then duplicate that layer with pure CSS.
Handling Features:
1. Layer Styles: It translates all the layer styles to perfect CSS. The supported
styles include shadows, glows, and gradient overlays.
styles include shadows, glows, and gradient overlays.
2. Rounded Corners: If you draw a vector shape with a rounded corner radius, the
resulting CSS will be an equivalent border-radius value.
3. Background Color and Opacity: Fill a shape with a color and it will be applied in
your CSS as well.
SCREENSHOTS :
Below are some screenshots of the plugin.