Код HEX упакоўвае тры 8-бітныя лікі ў шэсць шаснаццатковых знакаў. Пераўтварэнне HEX у RGB азначае разрэзаць гэтыя знакі на пары і прачытаць кожную пару як дзесятковае лік ад 0 да 255 — менавіта тыя значэнні, якіх чакаюць CSS, Figma і рэдактары малюнкаў.
Як працуе пераўтварэнне з HEX у RGB
- Прывядзі лік без вядучага # і, калі код складаецца толькі з трох знакаў, падвоі кожны: #f53 становіцца #ff5533.
- Падзялі шэсць знакаў на тры пары — RR, GG і BB.
- Прачытай кожную пару як лік у базе 16 і перавядзі ў базу 10: FF становіцца 255, 57 — 87, 33 — 51.
- Запішы тры вынікі як rgb(R, G, B).
Прыклад
Гэта пераўтварэнне дакладнае. HEX і RGB апісваюць тыя ж sRGB‑значэнні ў рознай натацыі, таму нічога не акругляецца і не губляецца ў абодвух кірунках.
HEX і RGB тлумачэнне
Што такое HEX?
Код HEX — гэта шасцізначны шаснаццатковы лік, які захоўвае чырвоную, зялёную і сінюю каналы колеру пасля вядучага #. Кожная пара знакаў адпавядае адной канале, ад 00 (няма) да FF (поўна), што дае тыя ж 16.7 мільёна колераў, што і RGB, але ў больш кароткай натацыі. HEX — стандарт у CSS, дызайнерскіх інструментах і брэндавых кіраўніцтвах.
- Сінтаксіс:
- #RRGGBB
- Дыяпазон:
- 00–FF на канал
- Найлепш падыходзіць для:
- CSS, перадача дызайну, брэндавыя кіраўніцтвы
Што такое RGB?
RGB апісвае колер як тры каналы святла — чырвоны, зялёны і сіні — кожны ад 0 да 255. Гэта адлюстроўвае тое, як на самай справе працуюць экраны: усе тры на 255 даюць белы, усе на 0 даюць чорны. RGB — правільны выбар, калі трэба лічыць з колерам, а rgba() дадае празрыстасць.
- Сінтаксіс:
- rgb(R, G, B)
- Дыяпазон:
- 0–255 на канал
- Найлепш падыходзіць для:
- код, canvas, празрыстасць з rgba()
Табліца спасылак HEX → RGB
Найбольш распаўсюджаныя CSS‑колеры, пераўтвораныя з HEX у RGB.
| Колер | HEX | RGB |
|---|---|---|
| black | #000000 | rgb(0, 0, 0) |
| white | #FFFFFF | rgb(255, 255, 255) |
| red | #FF0000 | rgb(255, 0, 0) |
| lime | #00FF00 | rgb(0, 255, 0) |
| blue | #0000FF | rgb(0, 0, 255) |
| yellow | #FFFF00 | rgb(255, 255, 0) |
| orange | #FFA500 | rgb(255, 165, 0) |
| teal | #008080 | rgb(0, 128, 128) |
| purple | #800080 | rgb(128, 0, 128) |
| gray | #808080 | rgb(128, 128, 128) |