All colors have a warmth value assigned to them, which can be classified as warm or cool.
Warm colors range between red and yellow, which include various versions of those colors in addition to orange. This also comprises colors such as brown and tan. These are considered to be “warm” colors in that they evoke a sense of warmth. For instance, fire is associated with warmth, and it typically burns between the spectrum of reds and yellows. Warm colors can also promote a feeling of aggression and are considered bold.
In the style.css
file, we’ve created a layout consisting of five blocks. Let’s explore warm colors by creating a spectrum of them within the browser.
Note: We’ll be using HSL color properties to adjust our colors. You can refer to this list of HSL color codes if you want to discover more.
Instructions
In the style.css
file, update the hue of the .first-color
class to a value between 0 and 8.
Next, update the hue of the .second-color
class to a value between 8 and 15.
Change the value of the hue of the .third-color
class to a number between 15 and 30.
Make the .fourth-color
hue a value between 30 and 45.
Finally, change the .fifth-color
hue a value between 45 and 60.