RGB ти дава три децимални канали помеѓу 0 и 255. Конвертирањето во HEX го претвора секој канал во двоцифрен хексадецимален број, така што целата боја се вклопува во еден компактен токен кој секој прелистувач, алатка за дизајн и водич за стилови го разбира.
Како работи претворањето од RGB во HEX
- Земи го црвениот канал и подели го со 16: количникот е првиот знак, остатокот е вториот.
- Запиши ги цифрите 10 до 15 како букви A до F — 255 станува FF.
- Повтори за зелениот и синиот канал, со водење сметка да пополниш едноцифрени резултати со водечка нула: 5 станува 05.
- Спои ги трите пара и стави # пред нив.
Пример
Точно е, додека каналите се цели броеви од 0 до 255. Дробни вредности како rgb(79.5, 70, 229) прво се заокружуваат на најблизок цел број, бидејќи HEX не може да чува вредности помеѓу.
RGB и HEX објаснети
Што е RGB?
RGB ја опишува бојата како три канали светлина — црвена, зелена и сина — секоја од 0 до 255. Тоа ја одразува реалната работа на екранот: сите три на 255 даваат бела, сите на 0 даваат црна. RGB е правилен избор секогаш кога треба да пресметуваш со боја, а rgba() додава транспарентност.
- Синтакса:
- rgb(R, G, B)
- Опсег:
- 0–255 по канал
- Најдобро за:
- код, canvas, транспарентност со rgba()
Што е HEX?
HEX код е шест-цифрен хексадецимален број што ги чува црвената, зелената и сината компонента на бојата зад водечки #. Секое парче од цифри претставува една компонента, од 00 (без) до FF (целосно), што дава истите 16,7 милиони бои како RGB но во пократка нотaција. HEX е подразбрано во CSS, алатки за дизајн и водичи за бренд.
- Синтакса:
- #RRGGBB
- Опсег:
- 00–FF по канал
- Најдобро за:
- CSS, предавање дизајн, водичи за бренд
RGB во HEX табела за референца
Најчестите CSS бои, конвертирани од RGB во HEX.
| Бои | RGB | HEX |
|---|---|---|
| black | rgb(0, 0, 0) | #000000 |
| white | rgb(255, 255, 255) | #FFFFFF |
| red | rgb(255, 0, 0) | #FF0000 |
| lime | rgb(0, 255, 0) | #00FF00 |
| blue | rgb(0, 0, 255) | #0000FF |
| yellow | rgb(255, 255, 0) | #FFFF00 |
| orange | rgb(255, 165, 0) | #FFA500 |
| teal | rgb(0, 128, 128) | #008080 |
| purple | rgb(128, 0, 128) | #800080 |
| gray | rgb(128, 128, 128) | #808080 |