From the course: Building a Responsive Single-Page Design with PostCSS

Unlock the full course today

Join today to access over 22,400 courses taught by industry experts or purchase this course individually.

When to create custom variables for your colors with PostCSS

When to create custom variables for your colors with PostCSS

From the course: Building a Responsive Single-Page Design with PostCSS

Start my 1-month free trial

When to create custom variables for your colors with PostCSS

- The next section that we'll be working with, the guarantee section, is not really going to have anything new to talk about, but it does make full use of our mixin, as well as color functions, so it's going to be good practice. Let's go ahead and get it done before we get to the people section, which is a lot more complex. Just like before, we need to add another file right here in the sections folder, and this one's going to be called guarantee. We need to add it to the style.css file, and in here, I'm going to create a variable to hold the color that I want the background to be, because I'm going to use that several times. I'm going to create a color called color-background-guarantee, and I'm going to set that to be using the color function, and this is going to be green, and we're going to shade that. Let's go ahead and try 25 percent to start with. Let's see how that works. Right, so I've got that variable, let's go ahead and get into the guarantee section itself. So we will…

Contents