- Из RGB в HEX
- Что такое RGB?
- Что такое HEX?
- Конвертер цветов
- Справка по цветовым моделям
- HEX / HTML
- RGB
- RGBA
- HSL
- HSLA
- CMYK
- HSB / HSV
- XYZ
- LAB
- Rgb to hex converter
- What is a rgb to hex converter?
- Rgb to hex converter examples
- RGB HEX конвертер цветов online
- Десятичное представление цвета RGB
- Шестнадцатеричное представление цвета HEX
Из RGB в HEX
Данная страничка поможет вам перевести цвет из цветовой модели RGB в цветовую модель HEX.
Что такое RGB?
RGB — это аббревиатура английских слов Red, Green, Blue — цветовая модель. Нужный цвет получается путем смешивания трех изначальных цветов — красного, зеленого, синего.
Формат RGB – это всего лишь один из способов сообщить компьютеру, каким цветом вы хотите работать. Т.е. это набор правил, с помощью которых любой цвет можно представить в виде определенного кода цифр и букв.
Каждый цвет: красный, зеленый или синий, характеризуется его интенсивностью или насыщенностью.
Количество каждого цвета может лежать в диапазоне от 0 до 255.
Абсолютно красный цвет будет иметь форму записи (255,0,0). Это означает, что количество красного цвета 255, зеленого 0 (т.е. зеленой составляющей нет), синий 0 (синей составляющей нет).
Что такое HEX?
HEX — это сокращение от английского слова Hexadecimal — шестнадцатеричный. Таким образом часто обозначается шестнадцатеричная система счисления.
На данной странице HEX — это обозначение представления цвета в шестнадцатеричной системе счисления. Шестнадцатеричный цвет задается следующим образом: #RRGGBB.
RR (красный), GG (зеленый) и BB (синий) являются шестнадцатеричными целыми числами от 00 до FF, задающие интенсивность цвета.
Например, # 0000FF отображается как синий, так как синий компонент установлен в его самое высокое значение (FF), а остальные установлены на 00.
Конвертер цветов
С помощью универсального конвертер цветов вы можете легко перевести цвет из одной цветовой модели в ряд других.
В первую очередь, калькулятор служит для удобной работы с современными форматами CSS3-цветов. Поддерживается конвертация из HEX в RGB/RGBA и HSL/HSLA, RGB в CMYK, XYZ, LAB, и обратно.
А также специальный функционал для замещения альфа-канала при переводе цвета из RGBA в RGB (и HSLA в HSL).
Справка по цветовым моделям
Далее приводится краткое описание цветовых систем с которыми работает конвертер, разъяснение по форматам, а также примеры использования полученных цветов в CSS/HTML.
HEX / HTML
Цвет в формате HEX — это ни что иное, как шестнадцатеричное представление RGB.
Цвета представляются в виде трёх групп шестнадцатеричных цифр, где каждая группа отвечает за свой цвет: #112233, где 11 — красный, 22 — зелёный, 33 — синий. Все значения должны быть между 00 и FF.
Во многих приложениях допускается сокращённая форма записи шестнадцатеричных цветов. Если каждая из трёх групп содержит одинаковые символы, например #112233, то их можно записать как #123.
RGB
Цветовое пространство RGB (Red, Green, Blue) состоит из всех возможных цветов, которые могут быть получены путём смешивания красного, зелёного, и синего. Эта модель популярна в фотографии, телевидении, и компьютерной графике.
Значения RGB задаются целым числом от 0 до 255. Например, rgb(0,0,255) отображается как синий, так как синий параметр установлен в его самое высокое значение (255), а остальные установлены в 0.
Некоторые приложения (в частности веб-браузеры) поддерживают процентную запись значений RGB (от 0% до 100%).
Цветовые значения RGB поддерживаются во всех основных браузерах.
RGBA
С недавних пор современные браузеры научились работать с цветовой моделью RGBA — расширением RGB с поддержкой альфа-канала, который определяет непрозрачность объекта.
Значение цвета RGBA задается в виде: rgba(red, green, blue, alpha). Параметр alpha — это число в диапазоне от 0.0 (полностью прозрачный) до 1.0 (полностью непрозрачный).
RGBA поддерживается в IE9+, Firefox 3+, Chrome, Safari, и в Opera 10+.
HSL
Цветовая модель HSL является представлением модели RGB в цилиндрической системе координат. HSL представляет цвета более интуитивным и понятным для восприятия образом, чем типичное RGB. Модель часто используется в графических приложениях, в палитрах цветов, и для анализа изображений.
HSL расшифровывается как Hue (цвет/оттенок), Saturation (насыщенность), Lightness/Luminance (светлота/светлость/светимость, не путать с яркостью).
Hue задаёт положение цвета на цветовом круге (от 0 до 360). Saturation является процентным значением насыщенности (от 0% до 100%). Lightness является процентным значением светлости (от 0% до 100%).
HSL поддерживается в IE9+, Firefox, Chrome, Safari, и в Opera 10+.
HSLA
По аналогии с RGB/RGBA, для HSL имеется режим HSLA с поддержкой альфа-канала для указания непрозрачности объекта.
Значение цвета HSLA задается в виде: hsla(hue, saturation, lightness, alpha). Параметр alpha — это число в диапазоне от 0.0 (полностью прозрачный) до 1.0 (полностью непрозрачный).
CMYK
Цветовая модель CMYK часто ассоциируется с цветной печатью, с полиграфией. CMYK (в отличие от RGB) является субтрактивной моделью, это означает что более высокие значения связаны с более тёмными цветами.
Цвета определяются соотношением голубого (Cyan), пурпурного (Magenta), жёлтого (Yellow), с добавлением чёрного (Key/blacK).
Каждое из чисел, определяющее цвет в CMYK, представляет собой процент краски данного цвета, составляющей цветовую комбинацию, а точнее, размер точки растра, выводимой на фотонаборном аппарате на плёнке данного цвета (или прямо на печатной форме в случае с CTP).
Например, для получения цвета «PANTONE 7526» следует смешать 9 частей голубой краски, 83 частей пурпурной краски, 100 — жёлтой краски, и 46 — чёрной. Это можно обозначить следующим образом: (9,83,100,46). Иногда пользуются такими обозначениями: C9M83Y100K46, или (9%, 83%, 100%, 46%), или (0,09/0,83/1,0/0,46).
HSB / HSV
HSB (также известна как HSV) похожа на HSL, но это две разные цветовые модели. Они обе основаны на цилиндрической геометрии, но HSB/HSV основана на модели «hexcone», в то время как HSL основана на модели «bi-hexcone». Художники часто предпочитают использовать эту модель, принято считать что устройство HSB/HSV ближе к естественному восприятию цветов. В частности, цветовая модель HSB применяется в Adobe Photoshop.
HSB/HSV расшифровывается как Hue (цвет/оттенок), Saturation (насыщенность), Brightness/Value (яркость/значение).
Hue задаёт положение цвета на цветовом круге (от 0 до 360). Saturation является процентным значением насыщенности (от 0% до 100%). Brightness является процентным значением яркости (от 0% до 100%).
XYZ
Цветовая модель XYZ (CIE 1931 XYZ) является чисто математическим пространством. В отличие от RGB, CMYK, и других моделей, в XYZ основные компоненты являются «мнимыми», то есть вы не можете соотнести X, Y, и Z с каким-либо набором цветов для смешивания. XYZ является мастер-моделью практически всех остальных цветовых моделей, используемых в технических областях.
LAB
Цветовая модель LAB (CIELAB, «CIE 1976 L*a*b*») вычисляется из пространства CIE XYZ. При разработке Lab преследовалась цель создания цветового пространства, изменение цвета в котором будет более линейным с точки зрения человеческого восприятия (по сравнению с XYZ), то есть с тем, чтобы одинаковое изменение значений координат цвета в разных областях цветового пространства производило одинаковое ощущение изменения цвета.
Rgb to hex converter
Free online RGB color to hexadecimal color converter. Just load your RGB color and it will automatically get converted to a hex color. There are no ads, popups or nonsense, just an awesome decimal RGB to hex converter. Load RGB, get hexadecimal. Created for developers by developers from team Browserling.
What is a rgb to hex converter?
This tool converts a decimal RGB colors in rgb(r,g,b) format to hexadecimal colors in #rrggbb format. Hexabulous!
Rgb to hex converter examples
You can pass input to this tool via ?input query argument and it will automatically compute output. Here’s how to type it in your browser’s address bar. Click to try!
https:// onlinehextools.com/convert-rgb-to-hex ?input=rgb%28224%2C%2087%2C%2069%29%0Argb%2885%2C%20129%2C%20181%29
Created with love by
We’re Browserling — a friendly and fun cross-browser testing company powered by alien technology. At Browserling we love to make developers’ lives easier, so we created this collection of online hex tools. Unlike many other tools, we made our tools free, without ads, and with the simplest possible user interface. Our online hex tools are actually powered by our programmer tools that we created over the last couple of years. Check them out!
If you love our tools, then we love you, too! Use coupon code HEXLING to get a discount at Browserling.
All conversions and calculations are done in your browser using JavaScript. We don’t send a single bit about your input data to our servers. There is no server-side processing at all. We use Google Analytics and StatCounter for site usage analytics. Your IP address is saved on our web server, but it’s not associated with any personally identifiable information. We don’t use cookies and don’t store session information in cookies. We use your browser’s local storage to save tools’ input. It stays on your computer.
By using Online Hex Tools you agree to our Terms of Service. TLDR: You don’t need an account to use our tools. All tools are free of charge and you can use them as much as you want. You can’t do illegal or shady things with our tools. We may block your access to tools, if we find out you’re doing something bad. We’re not liable for your actions and we offer no warranty. We may revise our terms at any time.
RGB HEX конвертер цветов online
Конвертер цветов наглядно показывает изменение цвета при изменении количества красного, зелёного или синего. Все данные одновременно показаны в десятичном (rgb) и шестнадцатеричном (hex) форматах.
Десятичное представление цвета RGB
В цветовой модели RGB 16 581 375 цветов, и каждый цвет состоит из значения трёх основных цветов — красного, зелёного и синего. Значение основных цветов располагается в диапазоне от 0 до 255 (учитывая 0 получается 256) и обозначает интенсивность цвета. Так, значение 0 обозначает отсутствие цвета, что по сути является чёрным цветом, а значение 255 обозначает самую высокую интенсивность, при которой основной цвет становится самым ярким.
Записывается цвет следующим образом: rgb(10, 100, 200), где в данной записи 10 — значение красного цвета, 100 — зелёного и 200 — синего.
Красный | |||||
---|---|---|---|---|---|
Интенсивность | 0 | 63 | 127 | 191 | 255 |
Зелёный | |||||
---|---|---|---|---|---|
Интенсивность | 0 | 63 | 127 | 191 | 255 |
Синий | |||||
---|---|---|---|---|---|
Интенсивность | 0 | 63 | 127 | 191 | 255 |
При одинаковых значениях основных цветов образуется серый цвет, и чем выше яркость, тем светлее серый. При максимальной интенсивности основных цветов образуется чистый белый цвет.
красный + зелёный + синий | |||||
---|---|---|---|---|---|
Интенсивность | 0 | 63 | 127 | 191 | 255 |
Остальные 16 миллионов цветов образуются путём смешивания основных трёх цветов в разных пропорциях.
Шестнадцатеричное представление цвета HEX
Шестнадцатеричное представление цвета является самым обыкновенным переводом десятичного значения интенсивности цвета в шестнадцатеричный формат.
Десятичное число | 0 | 9 | 10 | 15 | 16 | 17 | 255 |
---|---|---|---|---|---|---|---|
Шестнадцатеричное число | 0 | 9 | A | F | 10 | 11 | FF |
Запись цвета в шестнадцатеричном формате принято начинать со знака #, за которой следуют два числа (шестнадцатеричных, от 0 до F) красного, два зелёного и два синего цветов.
#5CDEFF состоит из 5C красного (92), DE зелёного (222) и FF синего (255), что соответствует записи rgb(92, 222, 255).
Примеры цветов в шестнадцатеричном формате:
RGB | HEX | Название | Цвет |
---|---|---|---|
rgb(255,0,0) | #FF0000 | красный | |
rgb(189,0,0) | #BD0000 | тёмно-красный | |
rgb(0,255,0) | #00FF00 | зелёный | |
rgb(0,0,255) | #0000FF | синий | |
rgb(92,222,255) | #5CDEFF | голубой | |
rgb(255,247,10) | #FFF70A | жёлтый |