In this session we demonstrate how to change the color scheme of the Agility Skin for Thesis 2 using its existing variables. We show how to go through the color pallets, take the color values and place them in the variables to get the color that we want to use. We also give some resources to pick different color variations from and use for the color scheme that we want.
Member: Okay good, thanks.
Rick: You’re welcome.
Member: Is there a simple way in Thesis to set up a color palette that you can then refer to or is the… and then all of your different pieces to be referring to that color palette?
Rick: Well, it depends on… I mean, that kind of thing is skin dependent. So if you’re working in Thesis Classic, Thesis Classic does have some variables. Well, I’m going to start off actually in Agility though. In Agility, I’ve created a set of variables for text color and for background colors so that you can easily swap stuff out. So I’ve got this primary menu color you know, where I put the variable of that color in and the hover menu color where I’ve got a different color in. And then you know, background colors… actually, I don’t have a background value in there. But I’ve got places for those things to make it easy to swap colors in and out by just changing the variable.
Now Thesis has the same kind of thing. This color scheme came from… let’s see, this color scheme came from where? Just a moment and I’ll tell you where we got this color scheme. I’m going to try to tell you that anyway. Where on earth did I save that thing? Oh, there we go.
So this color scheme came from Color Lovers and based on this color scheme, vintage nudes. So you know, I went through color palettes you know, looking for something that I thought would look good and that was relatively close to what I wanted to accomplish. And then when I did that, I extended… or I took those color values and I put them into those variables to get you know, text color, background color, link color, accent text color, that kind of stuff. And I put that inside of text color and link color and accent color and that kind of stuff.
Now Thesis does something very… or Thesis Classic has something similar to that. And so if you go into the Thesis Classic Skin Editor over to CSS, you’ll see he’s got a bunch of variables. And these are colors. His C stands for color 1, color 2, color 3, color 4, color 5, color 6. And then he’s got border colors and actually, he doesn’t have background colors but you could use… oh no, he does have a couple of background colors. He’s got 3 background colors. And you know, you can use those to switch out color schemes. Actually, I think he’s got 4 background colors. So he does have a bunch of different you know, colored variables in here that you can enter and switch things around so you can test different color schemes.
And that… as long as you haven’t gone into… for example you know, the body and taken the variable out… so if you didn’t… if you left the variable in here, then by changing the variable’s value, you’ll change the text color. And by putting a variable in here then you can change the background color.
Now somebody else has… Anthony just points out that there is also this… the ColorZilla… oh that’s a gradient editor actually. There’s another one, I’ve forgotten the other one that I liked. Yeah, this is pretty close where you can sort of pick a color that you want to use and then choose the color relationship to come up with different color schemes. And they all start by sort of finding your base color, whatever that base happens to be. You know, pick your favorite color and then once you’ve got your favorite color you know, choose the different color… potential color variations you might want to use with it. This is also a you know, a reasonable way to approach coming up with a color scheme.
But I don’t… I’m not a good person to give you advice beyond resources like that because I don’t take my own advice.
Member: I thought the architects are supposed to be good with this stuff.
Rick: The architect has always hired out colors. I’ve never chosen colors or commented on color choices. Any other time the client asks me for color, I’d say, “You need to talk to my color designer.” And then I would send him to her and they could figure the colors out themselves. So you got to know your limitations.