Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

tool to sort out colors used in CSS

9:04 pm on Dec 31, 2009 (gmt 0)

Preferred Member

10+ Year Member

joined:Apr 29, 2003
votes: 0

I always run into the problem of not knowing all the CSS colors I use. So today I wrote up a little tool to help me. It's written in PHP and pulls all the hex#s from your CSS and displays them in a browser window.
to run just save the file on a php enabled server and in the window enter in you CSS file's url(can be localhost)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
function cmp($a, $b) {
//if equal
if ($a == $b) {
return 0;
//remove the '#' and convert the hex number to another number to a decimal
return (hexdec(rtrim($a,'#')) < hexdec(rtrim($b,'#'))) ? -1 : 1;
<form action="<?php echo $_SERVER['PHP_SELF']; ?>" method="post">
<label>Enter URL of stylesheet:
<input name="css" type="text" size="50" />
<br />
<input name="submit" type="submit" value="submit" /></form>
<div style="clear:both;">
$cssFile= file_get_contents($stylesheetURL);
//match and store all the hex numbers in Array $matches
$cssbool= preg_match_all('/(#[0-9abcdefABCDEF]{3,})/',$cssFile,$matches);
//par it down from a multi-demntial array
//get rid of duplicates
//sort array
uasort($smallColorArray, 'cmp');
foreach($smallColorArray as $thisColor)
echo "<div style=\"margin:20px;float:left;border:#000 solid 1px;\" ><div style=\"background-color:$thisColor; width:100px; height:100px; margin:5px;></div><div style=\"clear:both;\"></div><h3 style=\"text-align:center;\">$thisColor</h3></div> ";
7:44 am on Jan 4, 2010 (gmt 0)

Preferred Member

10+ Year Member

joined:May 29, 2007
posts: 578
votes: 0

Very, very useful!

Thanks Sarah!