Формат rgb що. Колірна модель RGB у CSS. Для чого потрібний файловий формат.

30.10.2019 Поради

У вас є проблема з відкриттям.RGB-файлів? Ми збираємо інформацію про файлових форматахі можемо розповісти навіщо потрібні файли RGB. Додатково ми рекомендуємо програми, які найбільше підходять для відкриття чи конвертування таких файлів.

Навіщо потрібен файловий формат.RGB?

Похідне від стандартного позначення адитивної колірної моделі RGB (червоний, зелений, синій), розширення .rgbпов'язане з типом файлів "Кольорове растрове зображення RGB SGI" - частиною ширшого формату файлів зображень SGI (SGI Image File Format). Компанія SGI (спочатку Silicon Graphics), яка нині припинила свою діяльність, була піонером у галузі високопродуктивних графічних станцій на базі Unix і розробила власний загальний растровий формат. Було опубліковано повну специфікацію растрового формату SGI.

Файл .rgbє кольоровим растровим зображенням RGB (24-бітовий колір) у форматі SGI. Крім стисненого режиму формат SGI також передбачає можливість RLE-стиснення (Run Length Encoding - Групове кодування). В одному файлі .rgbможе бути одне растрове зображення.



RGB-файли SGI розпізнаються та підтримуються більшістю основних графічних редакторівта програм для перегляду в більшій частині середовищ користувача. Крім .rgbрастрові зображення SGI можуть мати інші розширення, а саме .rgb a (32-бітові RGBA-зображення) та .sgi(Загальне розширення).

В аналогічній якості розширення .rgbможе іноді зустрічатися стосовно рідкісного типового формату кольорових растрових зображень Q0 (RGB, 24-бітовий колір). Цей формат також розпізнається та підтримується більшістю основних графічних переглядачів/редакторів.

Програми для відкриття або конвертації RGB файлів

Ви можете відкрити файли RGB за допомогою таких програм: 

RGB модель описує випромінювані кольори. Вона заснована на трьох основних (базових) кольорах: червоний (Red), зелений (Green) та синій (Blue). RGB-модель можна назвати "рідною" для дисплея. Інші кольори виходять поєднанням базових. Кольори такого типу називаються адитивними.

З малюнка видно, що поєднання зеленого та червоного дають жовтий колір, поєднання зеленого та синього – блакитний, а поєднання всіх трьох кольорів – білий. З цього можна зробити висновок про те, що кольори RGB складаються субтрактивно.

Основні кольори взяті із біології людини. Тобто ці кольори засновані на фізіологічній реакції людського ока на світ. Людське око має фоторецептор клітин, що реагують на найбільш зелений (М), жовто-зелений (L) та синьо-фіолетовий (S) світла ( максимальна довжинахвиль від 534 нм, 564 нм та 420 нм відповідно). Людський мозок може легко відрізнити широкий спектр різних кольорів на основі відмінностей сигналів, отриманих від трьох хвиль.

Найбільш широко RGB колірна модель використовується у РК або плазмових дисплеях, таких як телевізор або монітор комп'ютера. Кожен піксель на дисплеї може бути представлений в інтерфейсі апаратних засобів (наприклад, графічні карти) як значення червоного, зеленого та синього. Значення RGB змінюються в інтенсивності, які використовуються для наочності. Камери та сканери також працюють у тому ж порядку, вони захоплюють колір із датчиками, які реєструють різну інтенсивність RGB на кожен піксель.

У режимі 16 біт на піксель, також відомий як Highcolor, є 5 біт на колір (часто згадується як 555 режим) або з додатковим бітом для зеленого кольору (відомий як 565 режим). Доповнено зелений колір через те, що людське око має здатність виявляти більше відтінків зеленого, ніж будь-якого іншого кольору.

RGB значення, представлені в режимі 24 біт піксель (bpp), відомому також під ім'ям Truecolor, зазвичай виділяється три цілих значення між 0 і 255. Кожне з цих трьох чисел являє собою інтенсивність червоного, зеленого і синього відповідно.

У RGB - три канали: червоний, синій та зелений, тобто. RGB – триканальна колірна модель. Кожен канал може приймати значення від 0 до 255 у десятковій або, що ближче до реальності, від 0 до FF у шістнадцятковій системі числення. Це тим, що байт, яким кодується канал, та й взагалі будь-який байт складається з восьми бітів, а біт може приймати 2 значення 0 чи 1, разом 28=256. У RGB, наприклад, червоний колір може набувати 256 градацій: від чисто червоного (FF) до чорного (00). Таким чином нескладно підрахувати, що в моделі RGB міститься всього 2563 або 16777216 кольорів.

У RGB три канали, і кожен кодується 8-ма бітами. Максимальне значення FF (або 255) дає чистий колір. Білий колір виходить шляхом поєднання всіх кольорів, точніше їх граничних градацій. Код білого кольору = FF (червоний) + FF (зелений) + FF (синій). Відповідно код чорного = 000000. Код жовтого = FFFF00, пурпурового = FF00FF, блакитного = 00FFFF.

Також є ще 32 та 48 бітні режими відображення кольорів.

RGB не використовується для друку на папері, замість неї існує CMYK-колірний простір.

CMYK - це колірна модель, яка використовується в кольоровому друку. Колірна модель є математичною моделлю для опису кольорів цілими числами. CMYK модель побудована на блакитному, пурпуровому, жовтому та чорному кольорах.

Найзручніший, найпоширеніший, універсальний спосібвказівки кольору – RGB. RGB це абревіатура (Red Green Blue), що означає: червоний, зелений, синій – основні кольори, шляхом комбінування яких утворюються всі інші кольори.

Колір за допомогою RGB можна встановлювати декількома способами, далі докладно про кожен.

Функціональний формат запису кольорів у CSS

Загальний вигляд функціонального формату: rgb(колір) , де «колір», це комбінація з трьох цілих чисел (від 0 до 255) або трьох відсоткових значень (від 0% до 100%), перерахованих через кому. Далі кілька прикладів.

Rgb(255, 255, 255) /* білий колір */
rgb(0, 0, 0) /* чорний колір */
rgb(255, 0, 0) /* червоний колір */

Rgb(100%, 100%, 100%) /* білий колір */
rgb(0%, 0%, 0%) /* чорний колір */
rgb(100%, 0%, 0%) /* червоний колір */

Після rgb і перед (немає пробілу!

Тепер зробимо колір тексту заголовка якимось рандомним кольором, наприклад, rgb(222, 14, 100) , це якийсь рожевий або фіолетовий колір. Далі приклад застосування.

H1 (
color: rgb(222, 14, 100);
}

А тепер за допомогою відсоткових значень та RGB створимо пару відтінків зеленого. Це приклад 4.

Приклад 4, CSS код

P.one ( color: rgb(0%, 20%, 0%); )
p.two ( color: rgb(0%, 40%, 0%); )
p.three (color: rgb(0%, 60%, 0%); )
p.four (color: rgb(0%, 80%, 0%); )
p.five (color: rgb(0%, 100%, 0%); )

Приклад 4, HTML код

Зелений


Зелений


Зелений


Зелений


Зелений

До речі, відсоткові числа можна писати дробові, наприклад, rgb (40.2%, 22.34%, 12%), так колір буде точнішим.

І що ж станеться, якщо ми вийдемо за рамки діапазону значень? Нічого особливого не буде, просто значення інтерпретують до найближчих кордонів (0% або 100%, 0 або 255). Далі приклад п'ятий.

Rgb(200%, 3100%, 101%) /* буде rgb(100%, 100%, 100%) */
rgb(-200%, 0%, 12%) /* буде rgb(0%, 0%, 12%) */
rgb(257, -130, 212) /* буде rgb(255, 0, 212) */

Припустимо, ми маємо наступний CSS код: rgb(12%, 96%, 43%) і нам потрібно перевести відсоткові значення в цілі. Це робиться дуже просто, потрібно помножити кожен рівень на 255, а потім розділити на 100, в результаті отримаємо rgb (30.6, 244.8, 109.65), після ми округляємо за правилами математики та отримуємо бажане: rgb (31, 245, 110).

Шістнадцятковий формат запису кольору в CSS

Я найчастіше використовую саме шістнадцятковий формат, просто він коротший. Далі приклад.

P ( color: #FFFFFF; ) /* білий колір тексту */
p ( color: #000000; ) /* чорний колір тексту */
p ( color: #FF0000; ) /* червоний колір тексту */

Відмінностей від RGB майже немає. Вказується три кольори RRGGBB в діапазоні від 00 до FF (FF це 255 у десятковій системі). Як бачите, між числами та літерами немає прогалин та інших знаків (друга причина, чому мені цей формат більше подобається), і шістнадцятковий код починається з решітки (#). До речі, шістнадцятковий формат називають HEX форматом. Далі приклад трьох однакових кольорів, написаних трьома способами.

HEX/HTML

Колір у форматі HEX ​​- це ні що інше, як шістнадцяткове уявлення RGB.

Кольори видаються в вигляді трьохгруп шістнадцяткових цифр, де кожна група відповідає за свій колір: #112233, де 11 – червоний, 22 – зелений, 33 – синій. Усі значення мають бути між 00 та FF.

У багатьох додатках допускається скорочена форма запису шістнадцяткових кольорів. Якщо кожна з трьох груп містить однакові символи, наприклад #112233, їх можна записати як #123.

  1. h1 ( color: #ff0000; ) /* червоний */
  2. h2 ( color: #00ff00; ) /* зелений */
  3. h3 ( color: #0000ff; ) /* синій */
  4. h4 ( color: #00f; ) /* той же синій, скорочений запис */

RGB

Колірний простір RGB (Red, Green, Blue) складається з усіх можливих кольорів, які можуть бути отримані шляхом змішування червоного, зеленого та синього. Ця модель популярна у фотографії, телебаченні, та комп'ютерній графіці.

Значення RGB задаються цілим числом від 0 до 255. Наприклад, rgb(0,0,255) відображається як синій, тому що синій параметр встановлений у найвище значення (255), а інші встановлені в 0.

Деякі програми (зокрема, веб-браузери) підтримують відсотковий запис значень RGB (від 0% до 100%).

  1. h1 ( color: rgb(255, 0, 0); ) /* червоний */
  2. h2 ( color: rgb(0, 255, 0); ) /* зелений */
  3. h3 ( color: rgb(0, 0, 255); ) /* синій */
  4. h4 ( color: rgb(0%, 0%, 100%); ) /* той же синій, відсотковий запис */

Значення кольорів RGB підтримуються у всіх основних браузерах.

RGBA

Віднедавна сучасні браузеринавчилися працювати з колірною моделлю RGBA – розширенням RGB за допомогою альфа-каналу, який визначає непрозорість об'єкта.

Значення кольору RGBA визначається як: rgba(red, green, blue, alpha). Параметр alpha – це число в діапазоні від 0.0 (повністю прозорий) до 1.0 (повністю непрозорий).

  1. h1 ( color: rgb(0, 0, 255); ) /* синій у звичайному RGB */
  2. h2 ( color: rgba(0, 0, 255, 1); ) /* той же синій в RGBA, тому що непрозорість: 100% */
  3. h3 ( color: rgba(0, 0, 255, 0.5); ) /* непрозорість: 50% */
  4. h4 ( color: rgba(0, 0, 255, .155); ) /* непрозорість: 15.5% */
  5. h5 ( color: rgba(0, 0, 255, 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%).

  1. h1 (color: hsl(120, 100%, 50%); ) /* зелений */
  2. h2 (color: hsl(120, 100%, 75%); ) /* світло-зелений */
  3. h3 (color: hsl(120, 100%, 25%); ) /* темно-зелений */
  4. h4 (color: hsl(120, 60%, 70%); ) /* пастельний зелений */

HSL підтримується в IE9+, Firefox, Chrome, Safari та Opera 10+.

HSLA

За аналогією з RGB/RGBA, HSL є режим HSLA з підтримкою альфа-каналу для вказівки непрозорості об'єкта.

Значення кольору HSLA визначається як: hsla(hue, saturation, lightness, alpha). Параметр alpha – це число в діапазоні від 0.0 (повністю прозорий) до 1.0 (повністю непрозорий).

  1. h1 ( color: hsl(120, 100%, 50%); ) /* зелений у звичайному HSL */
  2. h2 ( color: hsla(120, 100%, 50%, 1); ) /* той же зелений в HSLA, тому що непрозорість: 100% */
  3. h3 (color: hsla(120, 100%, 50%, 0.5); ) /* непрозорість: 50% */
  4. h4 (color: hsla(120, 100%, 50%, .155); ) /* непрозорість: 15.5% */
  5. h5 ( color: hsla(120, 100%, 50%, 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), тобто для того, щоб однакова зміна значень координат кольору в різних областях колірного простору виробляло однакове відчуття зміни кольору.