Build Your Own Business Website header image

Set the Site Colors with the Thesis 2.3 Color Scheme Generator

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Whoops, you've found some protected content!

Watch the opening clip of this video to preview it,
the full video is available to free and paid members.

The next thing we are going to do as we continue to customize this Thesis 2.3 website is to set the website colors. That takes us back over to Skin Design.

Using the Color Scheme Generator

Thesis Classic comes with this color scheme generator that is the Thesis Color Scale. It seems to have fallen a little out of fashion but it does allow you to go through this range of colors and pick a set of colors that you might want to use.

You can always enter your own colors here but you can choose this color scale system to generate a pleasing monochromatic set of colors.

And you could always, once you are hovering over a color, click on this thing up here and that will show you complementary colors. If you wanted a dark complementary color here you could click on that, copy it, come back over here and then go back to your color scheme. There paste the color and now you’ve got 2 dark complementary colors here.

Another option there was to use the lighter color to choose the complementary color if you wanted it to be lighter. You have that ability.

Setting Website Colors

Now what I find more typical is that you set your colors. You already know what your color scheme is going to be. Rather than using a color scheme generator like this, you’re going to set your own colors.

Our primary color is going to stay the same as this but we’re going to use 673300 as the text color. Then our links color is going to be AB691F. Then my borders and highlights are going to be 679DA5. And then my interior backgrounds are going to be CCCC5E. And then we’ve got our site background color which is going to stay that color.

Next we save design options. Then come back over to the site, flush the cache and now we’ve got the colors applied. We don’t currently have this set up to access with a button in it so we won’t worry about it but you would see some colors applied there too.

The next part of this is going to be taking control over the headings and those colors.

0 Comments… add one
0 comments… add one

Leave a Comment