Коды цветов в HTML и CSS
Цвета, выводимые на экране монитора, меняются в зависимости от интенсивности свечения рабочих точек поверхности дисплея, каждая из которых, делает возможным отображение трёх основных каналов: red-красный, green-зеленый и blue-синий.
Какой либо оттенок, требуемый для создания цветовой модели, задаётся разной величиной свечения каждого из трёх цветов, а при условии полного отсутствия свечения ячеек, поверхность монитора приобретает свой естественный чёрный цвет.
Такой метод передачи цвета называется RGB-способ.
Один канал позволяет передать от 0 до 256 оттенков.
Цвета задаются в шестнадцатеричном коде следующими цифрами:
| 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | A | B | C | D | E | F |
Цифры с 10 до 15 заменены на латинские буквы.
Цвета, используемые для разработки интернет ресурса, рекомендовано подбирать по специальной цветовой схеме.
| white #ffffff; | белый |
| black #000000; | чёрный |
| grey #bebebe; | серый |
| red #ff0000; | красный |
| orange #ffa500; | оранжевый |
| yellow #ffff00; | жёлтый |
| green #00ff00; | зелёный |
| cyan #00ffff; | голубой |
| blue #0000ff; | синий |
| purple #a020f0; | пурпурный |
| cream #fffbf0; | кремовый |
| gold #ffd700; | золотой |
| chocolate #d2691e; | шоколадный |
| brown #a52a2a; | коричневый |
| cornflower blue #6495ed; | васильковый |
| pink #ffc0cb; | розовый |
| lime | лайм |
HTML
<div class="box white">
white
</div>
<div class="box blue">
blue
</div>
<div class="box red">
red
</div>
CSS
.box{
width: 250px;
font-size: 24px;
font-weight: bold;
line-height: 50px;
margin: 0px auto;
padding: 3px 20px;
text-align: center;
}
.red{
color: #fff;
background-color: #d52b1e;
}
.blue{
color: #fff;
background-color: #0039a6;
}
.white{
color: #818181;
background-color: #fff;
}
