250+ Resources to Help You Become a CSS Expert

Galleries and Showcases

CSS Stars - A gallery offering up a few dozen CSS-based designs for your perusal.

Didloo Showcase - Another gallery featuring more than sixty CSS-based designs.

CSS Based - An enormous CSS gallery with thousands of designs.

CSS Drive - A categorized CSS gallery.

CSS Gallery 2.0 - Another CSS gallery categorized by site type with a couple thousand designs included.

CSS Remix - A huge collection of CSS designs.

CSS Mania - A CSS gallery that’s been around for five years.

CSSelite.com - A categorized gallery of CSS designs.

CSS Creme - A huge gallery of sites sortable by color, category or designer that also includes tutorials and news.

csswebsite - A gallery that lets you filter by category, date, or color.

CSS Tea - A CSS design gallery sorted by industry.

26+ CSS Galleries to Follow on Twitter - A great guide to CSS galleries worth following on Twitter.

40 Beautiful Dark CSS Website Designs - A gallery post offering up some great dark designs built with CSS.

Best of CSS Design 2008 - Another gallery post showcasing the best CSS designs of 2008.

Best CSS Gallery - A huge CSS gallery with more than 1,500 design examples.

CSS Vault Gallery - The CSS design gallery from CSS Vault. It includes designs dating back as far as 2003.

CSS Beauty Gallery - A CSS gallery with entries listed chronologically. The include designs from 2004 to the present.

StyleCrunch - A gallery of standards-compliant sites.

The CSS Gallery List - A listing of most of the major CSS design galleries out there.

CSSLeak - A CSS gallery with more than 1,400 entries.

Tools

Firebug - A Firefox plugin that lets you view and edit CSS and other code right within Firefox.

Aardvark - A Firefox extension that lets you see each HTML element and class or id.

CSS Validator - A Firefox plugin that validates your CSS based on the W3C CSS Validator.

CSSViewer 1.0.3 - A Firefox extension that lets you view CSS properties on any web page.

GridFox - A Firefox extension for assisting in grid layout design by overlaying a grid on any website.

CodeBurner - A plugin for Firefox or Firebug that makes HTML and CSS reference material available in your browser.

Em Calculator - Converts pixel sizes to em sizes.

IzzyMenu - A free CSS menu creator that supports the creation of DHTML drop down sub-menus.

CSS Buttons - A downloadable button creator.

Spanky Corners - A rounded corner box generator.

Spiffy Box - Another generator for creating boxes with rounded corners.

CleanCSS - A CSS formatter and optimizer.

CSS Browser Selector - A useful tool for empowering CSS selectors based on the visitor’s browser.

CSS Compressor - A CSS file compressor.

CSS Layout Generator - A simple, online CSS generator that creates a basic layout framework.

CSSTidy - An open-source, downloadable CSS parser and optimizer.

The CSS Color Extractor - This tool will extract all the colors from a chunk of CSS code and display those colors for you.

CSS Rounded Box Generator - An online tool to create rounded corners with CSS.

CSS Source Ordered Variable Border 1-3 Columned Page Maker - A page layout generator that creates an Ordered Variable Border template.

CSS SuperScrub - A tool that decreases the complexity and size of your CSS files.

Sky CSS Tool - A really powerful online tool for styling CSS selectors.

CSS Tab Designer - A downloadable tool for styling CSS tabs visually.

Simple CSS - A downloadable, free CSS authoring tool.

Stylesheet Generator - A multi-step stylesheet creator.

CSS Validation Service - The CSS validation tool from W3C.

Styleneat - A free online CSS organizer that works with direct CSS input, file uploads or stylesheet URLs.

CSS Menu Generator - A online generator that creates custom, cross-browser compatible CSS menus.

Webmaster Toolkit’s CSS Menu Generator - An online tool that creates the CSS and HTML files for your menus.

CSS Drive CSS Compressor - A CSS compression tool that has a basic and an advanced mode, depending on your needs.

Tabifier - Adds indents to your code files.

CSSFly - A browser-based CSS and XHTML editor that works in real-time.

CleverCSS - A markup language that’s based on Python for building cleaner and better-structured CSS.

List-O-Matic - A tool for creating list-based navigation menus with CSS.

Markup Maker - Creates a valid XHTML/HTML framework document with the page IDs you enter.

CSSMate - An online CSS editor.

CSS Type Set - A CSS typography generator.

QrONE CSS Designer - An online CSS editor/generator.

Typetester - A tool that lets you compare CSS-styled type side by side (up to three styles at a time).

Typechart - A browsable collection of CSS-styled type that you can view as it would appear on a Mac or PC, with downloadable CSS code included.

Blueprint CSS Grid Generator - A tool for creating layouts based on the Blueprint framework.

Construct 0.5 - A visual tool for creating layouts based on the Blueprint framework.

PXtoEM.com - A pixel to EM size converter tool.

CSS Editors Reviewed - A collection of reviews of some of the more popular CSS editors.

YAML Builder - A visual tool for creating YAML layouts.

Gridinator - A CSS grid layout builder.

Grid System Generator - A grid layout builder that works with 960.gs, Golden Grid, 1Kb Grid, and a simple grid system.

List of CSS Tools - A huge list of CSS tools for everything from fonts to optimizers.

psd2css Online - A free tool that converts Photoshop designs to CSS files automatically.

50 Extremely Useful and Powerful CSS Tools - A list of some great CSS tools, along with a bit about each.

CSS Analyser - Checks your CSS against the W3C validation service while also checking the color contrast.

CSS-Specific Blogs and News Sites

CSS Tinderbox - CSS Tinderbox offers up tons of great CSS tips, resources, and free stuff (see the free frameworks they offer above).

CSS-Tricks - A blog devoted to CSS from Chris Coyier.

CSS3.Info - A blog covering updates and developments related to the CSS3 standard.

CSS Globe - A blog bringing daily posts about CSS, including tutorials, resources, and downloads.

Ultimate CSS - While it hasn’t been updated in a few months, this blog still offers some great archived posts.

CSS Help Pile - A growing collection of CSS tutorials and resources.

Don’t Meet Your Heroes - This site compiles the best CSS and web standards news from around the web in one place.

CSS How To - A blog devoted to teaching CSS, filled with useful tutorials and hints.

CSS Mania Blog - This blog focuses heavily on the finer points of CSS design.

CSS Vault - The CSS Vault blog covers tons of useful tips and tutorials.

Miscellaneous Downloadable Elements

CSS Candy Menu - A CSS drop-down menu available in a number of candy colors.

25 Code Snippets for Web Designers Part 1 - Part 2 - Part 3 - Three collections of great code snippets, many of which are CSS-based.

More Free CSS Navigation Menu Designs - Two collections of menus you can download.

CSS Mini Tabs (the Un-tab, tab) - Two different versions of a mini-tab navigation bar.

ADxMenu - A horizontal menu with dropdowns.

CSS Dock Menu - A downloadable CSS menu based on the Mac dock.

14 Free Vertical CSS Menus - A collection of free vertical menus.

Dynamic Drive CSS Library - A huge collection of CSS code you can download.

CSSPlay - A collection of CSS elements and layouts you can download, some of which are available for free commercial use.

CSS Tricks Downloads - A big collection of site elements you can download for free, with demos.

Related posts:

-->