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 но во пократка нотaција. 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) |