Quantcast
Channel: Envato Tuts+ Design & Illustration
Viewing all articles
Browse latest Browse all 6352

Magically Turn Photoshop Layers Into CSS3 With CSS Hat

$
0
0

Today I’m going to show you a Photoshop plugin which aims to greatly improve your workflow. It’s called CSS Hat and it turns your Photoshop layers directly into valid CSS3.


The Screencast


Alternatively, Download the video, or subscribe to Webdesigntuts+ screencasts via YouTube

Further Information

  • Download: You can grab CSS Hat from its homepage.
  • Compatibility: CSS Hat is compatible with Photoshop CS4 and upwards, on Mac OS X and Windows.
  • LESS Hat: A bunch of smart LESS mixins.
  • Prefixes: Forget having to cater for multiple browser vendors, CSS Hat will prefix all your styles for you.
  • CSS Preprocessors: CSS Hat also supports output for SASS, LESS and Stylus.

What Can CSS Hat do?

CSS Hat supports the following layer properties:

  • Gradient/Solid color fill layer
  • Drop Shadow
  • Inner Shadow
  • Inner Glow
  • Outer Glow
  • Opacity
  • Gradient Overlay
  • Text Layers
  • Color Overlay
  • Stroke
  • Border Radius
csshat-panel
The panel..
csshat-screenshot-1
The hat..
csshat-screenshot-2
The process..

Viewing all articles
Browse latest Browse all 6352

Trending Articles