It’s pretty much impossible to design a site without CSS these days. It controls everything. CSS has a hand in so many visual aspects of a site that it can get daunting to keep track of it all or figure out how to tweak it just a certain way. I came up with a list of various web-based CSS tools that can assist any designer in their front-end development quest. If there’s something I missed, please add it to the comments!
Rocket Helps you create animations for items that move from point A to point B on a page. Just include rocket.css and rocket.js on your page.
Use Font Library to tag and organize Google fonts. If you’re looking for a font that fits a certain feel, this could come in handy.
Have StyleStats check out your CSS and give you an overview of its qualities including size, unique font sizes, all colors listed, etc.
Unless your regular shrink who charges $300 an hour, this guy does his work for free, slimming down your CSS and removing un-necessary code.
Take your ugly, unformatted CSS and turn it into a masterpiece.
I could stare at them all day, and nothing’s ever going to load. Spin Kit is your source for CSS loading icons.
PX to EM conversion
Math is hard. PX to EM will take care of the number crunching for you. Enter your original size and required size and it’ll math it up and give you an EM equivalent.
How big is that font? It’s big. How big is the next size up? Bigger.
The SVG Font Machine
Turn your SVG icons into a usable font.
Take icon sets from the known joints like Font Awesome and turn them into a font.