Шукаєте інші перетворювачі кольорів?
Як конвертувати RGB в HEX
Перетворити кольори з RGB у шістнадцяткову форму так само просто, як перетворити їх числові значення з десяткової в шістнадцяткову систему числення. Для того, щоб перетворити колір RGB (50, 168, 82), ми перетворюємо кожне число в шістнадцяткове значення:
50 = 32
168 = A8
82 = 52
RGB(50, 168, 82) = #32A852
Що таке RGB
RGB означає червоний, зелений та синій відтінки світла, які можна змішувати, створюючи різні кольори. Це стандартний спосіб створення зображень для телевізійних екранів, моніторів комп’ютерів та дисплеїв смартфонів.
Якщо бути точнішим, RGB - це адитивна кольорова модель, тобто ви повинні додавати відтінки разом, щоб створити інший колір.
Уявіть, що кольори складаються один на інший:
Примітка: різні пристрої виробляють різні значення RGB. Кожен пристрій використовує різну теорію змішування кольорів, тобто кольори RGB неоднакові на всіх пристроях, і їм потрібно керувати кольором, щоб виглядати однаково.
Щоб описати колір у кольоровій моделі RGB, потрібно сказати, скільки потрібно червоного, зеленого та синього кольорів.
Ви вказуєте, скільки потрібно червоного, зеленого та синього, використовуючи триплет RGB (R, G, B) де кожен з елементів може змінюватися від нуля до визначеного максимального значення.
Якщо всі елементи знаходяться в нулі (0, 0, 0) - результат - чорний колір.
Якщо всі елементи мають максимум (255, 255, 255) - результат - білий колір.
Поєднання цих чисел складають різні кольори (255, 255, 0) - результат - жовтий колір
Це відомо як глибина кольору і вимірюється в бітах.
Станом на 2018 рік майже на кожному телевізорі, комп’ютері та смартфоні використовується 24-бітна глибина кольору, відома як справжній колір. Він підтримує вісім бітів для кожного з трьох кольорів, або 24 біти загалом.
Це забезпечує 28 або 256 можливі значення для червоного, зеленого та синього кольорів:
256 x 256 x 256 = 16,777,216 загальна кількість можливих кольорів у справжній кольоровій палітрі
Що таке шістнадцяткове
Шістнадцяткова описує систему числення base-16, що складається з 16 символів. Він використовує цифри від 0 до 9 для представлення чисел від 0 до 9, а літери від A до F для представлення чисел від 10 до 15.
Найчастіше використовується в інформатиці та математиці як засіб представлення двійкового коду в зручній для читання формі.
На відміну від комп’ютерів чи вчених, більшість із нас використовують десяткову систему числення. Він складається з чисел від 0 до 9, і це стандартний спосіб використання чисел. Ми починаємо вчитися цьому в дошкільному закладі і використовуємо кожен день:
машина їде зі швидкістю 10 миль / год
кішка важить 4 кг
місяць складається з 30 днів
Тепер, коли ми знаємо різницю між шістнадцятковою та десятковою, давайте розглянемо, як ми можемо перетворювати з одного в інший.
Як ми вже знаємо, у шістнадцятковій системі числення числа від 0 до 9 представляють від 0 до 9, а букви від A до F представляють від 10 до 15 в десятковій системі.
Ось поглиблена таблиця, яка добре пояснює перетворення з шістнадцяткових в десяткові числа:
Як конвертувати RGB в HEX
Для того, щоб перетворити RGB у шістнадцяткову, потрібно перетворити значення червоного зеленого та синього кольорів із десяткової в шістнадцяткову.
Приклад #1: перетворити червоний колір (255, 0, 0) до ШІСТИНЯ:
Р. = 255 = FF
G = 0 = 00
B = 0 = 00
ШІСТИНЯ = #FF0000
Приклад #2: перетворити зелений колір - - (0, 255, 0) до ШІСТИНЯ:
Р. = 0 = 00
G = 255 = FF
B = 0 = 00
ШІСТИНЯ = #00FF00
Приклад #3: перетворити синій колір - - (0, 0, 255) до ШІСТИНЯ:
Р. = 0 = 00
G = 0 = 00
B = 255 = FF
ШІСТИНЯ = #0000FF
Приклад #4: перетворити чорний колір - - (0, 0, 0) до ШІСТИНЯ:
Р. = 0 = 00
G = 0 = 00
B = 0 = 00
ШІСТИНЯ = #000000
Приклад #5: перетворити білий колір - - (255, 255, 255) до ШІСТИНЯ:
Р. = 255 = FF
G = 255 = FF
B = 255 = FF
ШІСТИНЯ = #FFFFFF
Бонус приклад #6: перетворити колір золота (255, 215, 0) до ШІСТИНЯ:
Р. = 255 = FF
G = 215 = D7
B = 0 = 00
ШІСТИНЯ = #FFD700
Як конвертувати HEX в RGB
Для того, щоб перетворити HEX в RGB, вам потрібно розділити шістнадцяткове значення на пари по два і перетворити його в десяткове число.
Приклад #1: перетворити червоний колір #FF0000 до RGB:
FF = 255
00 = 0
00 = 0
RGB = (255, 0, 0)
Приклад #2: перетворити зелений колір - - #00FF00 до RGB:
00 = 0
FF = 255
00 = 0
RGB = (0, 255, 0)
Приклад #3: перетворити синій колір - - #0000FF до RGB:
00 = 0
00 = 0
FF = 255
RGB = (0, 0, 255)
Приклад #4: перетворити чорний колір - - #000000 до RGB:
00 = 0
00 = 0
00 = 0
RGB = (0, 0, 0)
Приклад #5: перетворити білий колір - - #FFFFFF до RGB:
FF = 255
FF = 255
FF = 255
RGB = (255, 255, 255)
Бонус приклад #6: перетворити колір золота #FFD700 до RGB:
FF = 255
D7 = 215
00 = 0
RGB = (255, 215, 0)
Різниця між RGB та Hex
Як ми бачимо з прикладів вище, основна відмінність RGB від HEX полягає в тому, що він використовує різні системи числення. RGB використовує десяткову, а HEX - шістнадцяткову.
Перетворити кольори з RGB у шістнадцяткову форму так само просто, як перетворити їх числові значення з десяткової в шістнадцяткову систему числення.
RGB проти HEX - який краще
З нашого досвіду та того, що спостерігала наша команда протягом багатьох років, шістнадцятковий формат використовується частіше, ніж RGB, особливо у веб-розробці та веб-дизайні.
Однак немає різниці, який із них ви використовуєте, оскільки вони обидва представляють однаковий колір. Єдина пропозиція - залишатися послідовним.
Якщо ви починаєте використовувати RGB протягом нашого веб-проекту - дотримуйтесь його. Якщо ви починаєте використовувати HEX протягом нашого веб-проекту, спробуйте використовувати тільки HEX
