CSS· LESSON 02

Colors

Learn a few ways to give text and page backgrounds color with CSS.

Set a text color

CSS accepts named colors such as tomato, as well as color values like hex codes. Pick colors that keep the text easy to read against its background.

This plain code fence is shown as a normal code sample:

.notice {
  color: #193322;
  background-color: #e4f3e9;
}

Add a background

A live CSS fence includes a small preview. Edit the rules and watch the page update:

CSS
PREVIEW Live result
Edit the code, then run it.

Try changing the page background or the heading color.

Try it yourself

Pick a background and text color that are easy to read together. Try changing the button color too.