<p>I just finished a medium sized web site and one thing I noticed about my css organization was that I have a lot of hard coded colour values throughout.  This obviously isn't great for maintainability.  Generally, when I design a site I pick 3-5 main colours for a theme.  I end up setting some default values for paragraphs, links, etc... at the beginning of my main css, but some components will change the colour (like the legend tag for example) and require me to restyle with the colour I wanted.  How do you avoid this?  I was thinking of creating separate rules for each colour and just use those when I need to restyle.</p>

<p>i.e.</p>

<pre><code>.color1 {
    color: #3d444d;
}
</code></pre>

You could have a colours.css file with just the colours/images for each tag in.
Then you can change the colours just by replacing the file, or having a dynamically generated CSS file, or having different CSS files available and selecting based upon website URL/subfolder/property/etc.
Or you can have colour tags as you write, but then your HTML turns into:
<p style="body grey">Blah</p>
CSS should have a feature where you can define values for things like colours that you wish to be consistent through a style but are defined in one place only. Still, there's search and replace.