Extracting CSS Classes That Use Specific Styles

Question

I am in the process of creating a module for a WordPress theme which allows users to change the primary colour. Rather than doing an overkill and implementing a LESS compiler, I will do it this way:

Here's the original stylesheet:

.header a:hover
{
    color: #fff;
    width: 123px;
    height: 456px;
}
.header
{
    background-color: #000;
    width: 100%;
    height: 200px;
}

Now, I need a way to parse a stylesheet like the above and extract all styles that contain a certain colour. Maybe a tool where I can enter the colors "#fff" and "#000" which then extracts the following:

.header a:hover
{
    color: #fff; // matched (removed the rest)
}
.header
{
    background-color: #000; // matched (removed the rest)
}

This way, I could simply include the above in a PHP file and render the respective primary colours dynamically to override the default stylesheet.

Does anybody know if there's a tool for this? It would make it a lot easier than searching the colours manually and extracting the styles.

Answer 1

I would create a dynamic file in PHP and specify the header as CSS:

header('Content-Type: text/css');

Use echo to add lines to the current CSS file! Make variables for all the colors you want. You can pass the selected colors with GET or POST requests. Notice that if you browser-cache the CSS files you should exclude the dynamic ones!