We web developers and designers use a lot of tools to help us create compatible, well-built websites more easily and quickly. Today I’m sharing with you a few of the tools that I like, specifically those made to assist with CSS.
1. CSS Typeset
This handy tool lets you adjust text properties in CSS and see the changes in real time. Then you can simply copy the generated CSS and add your own selectors. The only downside to me is that it only supports a few fonts and doesn’t let you enter a custom font to try out. With web fonts being so widely supported this seems like a useful feature.
Learn More
2. Code Beautifier
This is a very customizable CSS optimizer. It reduces file size while (optionally) maintaining readability. It can remove extra spacing, invalid properties, and almost everything that wastes space. It only seems to get rid of some comments though, I’m not sure what the determining factor is.
Learn More
3. Modernizr
I’ve talked about Modernizr before. It’s a fantastic little JavaScript utility that makes it easy to create CSS fallbacks for older browsers while fully supporting CSS3 in browsers that can handle it. It also allows conditional resource loading based on browser capabilities.
Learn More
4. W3C CSS Validation Service
The World Wide Web Consortium’s official CSS validation service will notify you of any problems with your CSS, be it syntax errors, invalid selectors, invalid properties, or invalid values. You can choose which CSS profile to test against and validate by URL, upload, or direct input.
Learn More
5. When can I use…
This website provides detailed information on CSS3 and HTML5 support by browser and version. It’s perfect if you want to know whether a feature you’re considering will go unseen by many of your viewers. It also indicates total support percentage based on browser market shares.
Learn More
