Названия цветов

Цвета делают страницу приятной на вид и удобной для чтения. В этом уроке мы раскрасим нашу страницу о кошке и попробуем все способы записи цвета в CSS:

• названия цветов, например green или white,
• цвета RGB, смешанные из красного, зелёного и синего света,
• шестнадцатеричные цвета — это просто более короткая запись цветов RGB,
• цвета HSL, которые описываются оттенком, насыщенностью и светлотой.

Для этого урока мы снова подготовили страницу о кошке, на этот раз с короткой таблицей стилей. Откройте в редакторе файл style.css: в нём два правила, и в каждом используется своё свойство цвета:

• color задаёт цвет текста, его ещё называют цветом переднего плана. Благодаря правилу для #title главный заголовок белый.
• background-color задаёт цвет фона элемента — области за его содержимым. Благодаря правилу для .title-background область вокруг главного заголовка чёрная.

Оба свойства принимают цвет в любом из перечисленных форматов.

Проще всего записать цвет его названием. В CSS есть 148 названий цветов. Кроме основных, таких как red, blue или gray, есть ещё tomato, gold, skyblue или orchid. Регистр букв не важен, но названия цветов принято писать строчными:

p {
	color: tomato;
}

Названия легко читать и запоминать, но их всего 148. Остальные форматы описывают больше 16 миллионов цветов, так что можно выбрать именно тот оттенок, который нужен.