In this post i’ve compiled small list of useful CSS tools to help you speed up, simplify and optimise development of your projects.

CSS Minification Benchmark

A comparison of CSS minification engines.

StyleStats

StyleStats is a Node.js library to collect CSS statistics!

Clippy

Clippy is a tool for generating values for shape functions for the new and cool CSS clip-path property.

CSS Ruler

Great CSS tool to measure stuff.

CSS Shorthand Generator

Shrthnd is a handy tool that converts CSS properties into shorthand, making shorter and more readable stylesheets.

Parker

Parker is a stylesheet analysis tool. It runs metrics on your stylesheets and will report on their complexity.

SpinKit

A collection of loading indicators animated with CSS.

Critical Path CSS Generator

The critical path is the path to render a web page – what’s needed before that can happen. CSS Stylesheets block rendering. Until the browser has requested, received, downloaded and parsed your stylesheets, the page will remain blank. By reducing the amount of CSS the browser has to go through, and by inlining it on the page (removing the HTTP request), we can get the page to render much, much faster.

CSS Stats

Webapp to visualize various stats about your css3

css2scss

This converter takes (valid) CSS and generates compass (scss) code, SASS or cleaned css for it.