12 really useful CSS tools
Working on a website’s CSS is quite an enjoyable job. However some of the tasks aren’t always fun. This is why tons of cool CSS tools were created, to make your life easier and keep web designers’ work barable.
1. Primer CSS
Just paste some HTML in the box and Primer will pull all classes and IDs to get you started with your stylesheet.

2. Automatic CSS inliner
You can use this tool to design your next email campaign and automatically turn all your local styles into inline CSS:

3. CSS sprites generator
The easy way to generate CSS sprites online.
![]()
4. Moo color finder
Retrieve any website color from CSS files. The cool part? It now even produces Photoshop color palette files.

5. MinifyMe
This nice Adobe Air application combines and minimizes CSS files.

6. Variable Grid System
Quickly generate a CSS grid for your web designs, based on the 960 grid system.

7. CSS Typeset
For CSS newbies, this website lets you enter text and configure it visually, then gives you the CSS.

8. Modernizr
Modernizr uses feature detection to test the current browser against upcoming features like rgba(), border-radius, CSS Transitions and many more.

9. List-o-matic
List-based CSS navigation creation made easier.

10. CSS layout generator
The website doesn’t look very good, but it’s a really useful tool to create multi-columns CSS layouts.

11. CSS text wrapper
Make your HTML text wrap in other shapes than just boxes.

12. Dust-me selectors
Cool Firefox add-on to check if some selectors are unused, the good thing is that it goes further than just checking one page.





I noticed you didn’t mention Firebug, I find that a really useful plugin.
CSS Typeset looks like it could be quite handy I think I may have to explore that.
@Mike: I do use Firebug and it’s awesome indeed, it was so obvious to me that I didn’t include it. I couldn’t imagine any web designers wouldn’t know about it.
Very useful list. Just forwarded it to our development team. I am sure they will enjoy it and start using some of these to enhance functionality and usability immediately.
Nice collection, thanks. Primer CSS is new to me and looks quite handy. Bookmarked the article for future testing.
Nice list – thanks – though I think it lacks this nice optimiser / sanitator :
http://www.devtrench.com/css-formatter/css-optimiser.php
I was curious about the MinifyMe Air app. I check the blog page but the graphic/link is broken or missing. However, I was able to get at the app via http://projects.base42.nl/base42/MinifyMe/
Hi everybody,
I am the developer, a new version of MinifyMe is available from http://code.google.com/p/minifyme/
Best,
Jankees
Good List. Thank you.
I think this list is missing http://cufon.shoqolate.com
By the way, I might try to implement something similar to primer within a tool (for designer) I’m building for Drupal.
w00t… sorry, I was thinking about the @font-face tools from http://www.fontsquirrel.com/ (but still.. http://code.google.com/p/jquery-fontavailable/ + cufont + @font-face) is a good solution to use “non-standard” fonts in a web design with kind of graceful degradation.
@Jankees: Thanks, I changed the link in the article.
@zeropaper: Will be looking for your Drupal tool
Yet another CSS Layout Generator – http://csslayoutgenerator.com/
http://styleneat.com/ for me: tidy up you css
Thanks, really useful stuff for a novice user of CSS like myself.
Thanks for the article, it makes CSS development that much easier.
It’s really interesting article. Thanks for good information.
Thanks for this list, pretty helpful. Just linked to it in a recent blog post – http://bit.ly/7ShejY
I like this article. Now time to study all links
some great tools there, have always been intrested in just what you can do with css, will try a few of these. thank you
CSS Type Set might be nice if it used the font property correctly to reduce the number of lines it spits out.
Great links! Will be useful to me in helping me decipher some of the code at dubli.com! Thanks…