CSSPrism: Slick New Site For Editing Your Site’s Theme

Developers working with template site designs often have several CSS files to wrangle — one for the basic layout elements and others with site-specific rules. Sometimes all you need to do to create a new site is change the color scheme, but how do you find all the different color declarations in a large CSS file?

Well, now you don’t have to because developer Ryan Berg created a fantastic little tool named CSSPrism. CSSPrism takes a stylesheet URL and then scans through and displays all the hex colors from the file.

CSSPrism uses the very slick jQuery color picker to make editing your color scheme a snap. You can even export the results as a new stylesheet and drop it into your site. There’s also a handy bookmarklet that will insert links to any site’s linked CSS files just inside the body tag.

As some have already pointed out, the Firefox Web Developer add-on offers similar features in its Information menu (try the View Color Information option), but Berg’s tool has the added color picker and export features that make it well worth a visit.

Head on over to CSSPrism and give it a try. One thing to keep in mind — currently CSSPrism doesn’t do well with compressed stylesheets, so if you have a single line, compressed CSS file you’ll have to feed the source copy through CSSPrism to see the results.