Last updated

CSS Colors & Backgrounds

Definition: color sets the text colour and background-color sets the background. You can name colours, or use hex codes like #2965f1.

Ways to write a colour

  • Name: red, blue, tomato
  • Hex: #e34c26 (a mix of red, green, blue)
  • RGB: rgb(233, 76, 38)

Example

body { background-color: #f0f4ff; }
h1   { color: #e34c26; }
.box { background: #2965f1; color: white; }

Apply a background to the whole page with the body selector, or to a single element with a class.

💡 Tip: light background + dark text (or the reverse) keeps your page easy to read. Try swapping the colours below.

Try it Yourself
Output

          
Ad · responsive