8 CSS tools for better web design
It’s a bit odd to execute by hand some repetitive CSS tasks, and also really not productive. I have collected for you a set of eight tools that will help you to build better websites faster.
Sort your CSS properties automatically with this tool. It can be used with many of the most popular text editors, such as Coda or Notepad++, but also has an online version.
A HTML5-ready alternative to CSS resets. It preserves some useful browser default settings, normalizes styles for a wide range of HTML elements, corrects some common browser inconsistencies, and is well commented for easier use.
SpritePad gives you an online drag-and-drop interface to easily create CSS sprites. Drag-and-drop your images into the grid, then get it immediately as PNG + CSS code.
4. CSS Hat
Turn Photoshop layer styles into CSS3 with a single click. Dramatically increase your productivity for only $19.99.
5. CSS-Only Pinterest Style Columns Layout
A technique that is interesting, but may not be used for production as it relies on CSS3 columns (not supported be Internet Explorer). I thought it was still worth sharing as it’s probably the way we’ll create this type of layouts in the future.
Formerly a hosted online service, WebPutty is now open-source and can be run on Google App Engine. It is a service that let’s you edit CSS online while previewing what you are doing, with the possibility to publish in one-click.
Much more than a simple CSS tool, Bootstrap is a feature-rich front-end framework published by Twitter. This tool is not new, but Twitter released the latest version very recently.
8. Responsive grid system
Building responsive designs is very frequent nowadays, just as working with the grid is. This responsive grid system helps you do both and let’s do it easily, without doing complicated math to calculate your grid.