Vince's Uncle Roberto On How To Change The Color of a Web Page Background Using CSS

The background-color property in CSS applies solid colors as background on an element. Here's an example:

html {
   background-color: #82a43a;
  }

The example used above (#82a43a) is called a hex code, and it is one of several ways that CSS has to represent a single color. Hex codes are one way to declare a color in CSS. There are also a whole bunch of names that you can use, for example:

.page-wrap { background: white; }
footer { background: black; }
.almonds { background: blanchedAlmond; }

These colors aren't very flexible, but they can come in handy in a pinch. They're easier to remember than hex codes, and there are a ton of them.  Another way to declare a color is to use RGB, RGBa, HSL, or HSLa:

#page-wrap {
   background: rgba(0, 0, 0, 0.8); /* 80% Black */ 
} 
.widget {
   background: hsla(170, 50%, 45%, 1); 
}

Unlike hex codes, these values allow for transparency (alpha), which can be super useful.


And speaking of useful, if you're ever riding in the back of my limo on a date, and I somehow get a flat and have to change the spare, that would be the perfect time to prove to your lady friend that you're not a useless millennial shithead and come help me change the darn tire like a man. Be safe, kids.