RGB
в HEX
Подберите цвет ползунками каналов или вставьте готовые числа — и получите компактный шестнадцатеричный код, который можно сразу вставить в CSS. Заодно увидите остальные семь форматов.
- HEX#4F8EF7
- RGBrgb(79, 142, 247)
- RGBArgba(79, 142, 247, 1)
- HSLhsl(218, 91%, 64%)
- HSBhsv(218, 68%, 97%)
- CMYKcmyk(68%, 43%, 0%, 3%)
- LABlab(59.64 13.2 -58.51)
- DEC5213943
Тон и насыщенность сохранены, меняется только светлота. Нажмите на образец, чтобы сделать его основным.
| На белом фоне | 3.21 : 1 | только крупный |
| На чёрном фоне | 6.54 : 1 | ✓ AA |
Для обычного текста стандарт требует контраст не ниже 4,5 : 1, для крупного — от 3 : 1.
Шкала серого — коды и значения каналов
29 градаций от белого до чёрного: у серого все три канала равны
- Серый 0 % значение канала 255 rgb(255, 255, 255)
- Серый 2 % значение канала 250 rgb(250, 250, 250)
- Серый 4 % значение канала 245 rgb(245, 245, 245)
- Серый 6 % значение канала 240 rgb(240, 240, 240)
- Серый 8 % значение канала 235 rgb(235, 235, 235)
- Серый 10 % значение канала 230 rgb(230, 230, 230)
- Серый 12 % значение канала 224 rgb(224, 224, 224)
- Серый 15 % значение канала 217 rgb(217, 217, 217)
- Серый 20 % значение канала 204 rgb(204, 204, 204)
- Серый 25 % значение канала 191 rgb(191, 191, 191)
- Серый 30 % значение канала 179 rgb(179, 179, 179)
- Серый 35 % значение канала 166 rgb(166, 166, 166)
- Серый 40 % значение канала 153 rgb(153, 153, 153)
- Серый 45 % значение канала 140 rgb(140, 140, 140)
- Серый 50 % значение канала 128 rgb(128, 128, 128)
- Серый 55 % значение канала 115 rgb(115, 115, 115)
- Серый 60 % значение канала 102 rgb(102, 102, 102)
- Серый 65 % значение канала 89 rgb(89, 89, 89)
- Серый 70 % значение канала 77 rgb(77, 77, 77)
- Серый 75 % значение канала 64 rgb(64, 64, 64)
- Серый 80 % значение канала 51 rgb(51, 51, 51)
- Серый 85 % значение канала 38 rgb(38, 38, 38)
- Серый 88 % значение канала 31 rgb(31, 31, 31)
- Серый 90 % значение канала 25 rgb(25, 25, 25)
- Серый 92 % значение канала 20 rgb(20, 20, 20)
- Серый 94 % значение канала 15 rgb(15, 15, 15)
- Серый 96 % значение канала 10 rgb(10, 10, 10)
- Серый 98 % значение канала 5 rgb(5, 5, 5)
- Серый 100 % значение канала 0 rgb(0, 0, 0)
Как собрать код из трёх чисел
Каждое число от 0 до 255 переводится в две шестнадцатеричные цифры. Разделите число на 16: целая часть даст первый знак, остаток — второй, а значения от 10 до 15 записываются буквами от A до F. Число 142 даёт 8 и 14, то есть 8E.
Три пары складываются подряд в порядке красный, зелёный, синий — получается шестизначный код. Смысл именно в компактности: запись #4F8EF7 занимает семь знаков вместо семнадцати у rgb(79, 142, 247). В большом файле стилей экономия заметна, поэтому в CSS исторически прижился HEX.
- 0 — 00
- 128 — 80, ровно половина
- 142 — 8E
- 247 — F7
- 255 — FF, максимум канала