Wat zijn Color Models?

Van Color Models naar Color Spaces en Profiles - Deel 1

Wat zijn color models? Hoe belangrijk is het om in de juiste color space te werken? En color profiles dan? Of gamma-correctie? Wat betekenen deze termen nu precies en hoe kun je ze in je voordeel gebruiken om het beste resultaat met je werk af te leveren? In dit eerste deel start ik met color models. Het tweede en laatste deel zal gaan over color spaces, color profiles en gamma-correctie, met een uitstapje naar bit-depth.

Geen zorgen, ik begin simpel... bij je eigen ogen! En ik zorg voor veel kleurtjes en natuurlijk interactives!

Hoe zien we eigenlijk kleuren?

In ons netvlies zitten kegeltjes en staafjes. Met zo'n 5 miljoen kegeltjes kunnen we kleuren waarnemen en met zo'n 120 miljoen staafjes helderheid. We hebben aparte kegeltjes voor licht met lage frequenties (rode tinten), middel frequenties (groene tinten) en hoge frequenties (blauwe tinten). Je kunt dus zeggen dat het menselijk oog dus al met RGB werkt.

Maar om die kleuren te kunnen waarnemen moet er wel voldoende licht zijn. Als er te weinig licht is nemen we geen kleuren waar. We kunnen in het donker echter nog wel vormen waarnemen. Want doordat we 24 keer zoveel staafjes als kegeltjes hebben kunnen we 's nachts dan wel geen kleuren meer waarnemen, maar helderheid in de vorm van grijstinten zien we nog wel.

Color models

Een color model (kleurmodel) is een manier om de kleuren in een kleurensysteem te omschrijven. De meeste kleurmodellen hebben 3 dimensies, zoals de bekendste: RGB. Van Rood, Groen en Blauw. En door de drie dimensies kan een kleurensysteem dus worden weergegeven met 3 assen, dus in 3D.

Je zou kunnen stellen dat alle modellen uiteindelijk allemaal uitkomen op RGB. Maar meestal onderscheiden we niet één, maar twee hoofd color models, die ook gelijk het bekendst zijn; RGB en CMY. Deze kleurmodellen kunnen weer verder worden opgesplitst in sub-kleurmodellen. Zo vallen onder RGB ook o.a. de submodellen HSL en HSV. Daarover later meer.

Voor nu even een opsomming van enkele bekende color models:

• RGB
  • HSV/HSB
  • HLS/HSL
• CMY(K)
• LAB
• NCS

Additieve kleurmenging en licht

Licht wordt dus door de R-, G- en B-kegeltjes en helderheids-staafjes in onze ogen waargenomen. Uiteindelijk is alles wat wij kleur noemen dus in feite gewoon licht. Verschillende gekleurde lichtstralen kunnen worden gemengd door deze elkaar te laten overlappen, denk maar aan twee spots waarvan de stralen elkaar kruisen. Deze manier van kleurmenging heet additief, omdat gekleurd licht dat wordt gemengd bij elkaar wordt opgeteld en wij het resultaat van die optelling dan waarnemen.

De basiskleuren voor additieve kleurmenging zijn normaal gesproken rood, groen en blauw. Net zoals de kegeltjes in onze ogen dus. Rood, groen en blauw zijn dus de primaire kleuren voor additieve kleurmenging, oftewel licht-menging. En als je ze alledrie bij elkaar optelt (elkaar laat overlappen) krijg je....? Tja, probeer dat zelf maar eens in de volgende interactive door de kleurencirkels over elkaar te schuiven.

Subtractieve kleurmenging en verf

Maar niet iedere lichtstraal bereikt direct ons oog. Het meeste licht komt terecht op voorwerpen om ons heen. Sommige delen van dat licht kunnen door die voorwerpen worden geabsorbeerd, zodat wij het overgebleven licht als kleur waarnemen.

Als we een theoretische lamp hebben die perfect wit licht uitstraalt betekent dit dat deze lamp alle mogelijke kleuren uitstraalt die samen opgeteld wit licht maken. Schijnen we met deze lamp op een wit vel papier, dan zal dat papier alle kleuren van het witte licht één op één weerkaatsen en zien we dus een wit vel papier.

Houden we nu dezelfde witte lamp boven een rood vel papier, dan zullen de groene en blauwe tinten worden geabsorbeerd door het papier en zien we alleen nog het rode deel van het licht zodat wij dus een rood vel papier zien. Een gekleurd object filtert dus inkomend licht en weerkaatst alleen het licht dat nog overblijft, waardoor wij het object gekleurd waarnemen. En een zwart voorwerp weerkaatst helemaal geen licht, waardoor we een zwart voorwerp waarnemen.

Zo werkt het ook met verf. En verf kun je mengen. Een kind begrijpt al snel dat als je gele verf mengt met cyaan verf (een kind zou dat lichtblauw kunnen noemen) je groen krijgt. Gele verf absorbeert van het invallende witte licht namelijk al het blauwe licht en de cyaan verf absorbeert al de rode stralen uit het licht, waardoor wij dus groen waarnemen.

Voor alles wat niet zelf licht is, maar licht filtert en weerkaatst, dus bijvoorbeeld inkt en verf, zijn de primaire kleuren Cyaan, Magenta en Geel (Yellow) (CMY). Bij menging van verf of inkt wordt bij menging dus niet opgeteld zoals bij licht, maar van elkaar afgetrokken. We noemen dat daarom subtractieve menging. Er gebeurt dus met subtractieve kleurmenging precies het tegenovergestelde als met additieve kleurmening. De kleuren cyaan, magenta en geel over elkaar vormen dan ook niet wit, maar...?

Primaire, secundaire en tertiaire kleuren

Om een kleurensysteem op te bouwen en te beschrijven worden meestal drie primaire kleuren steeds verder gemengd tot er een kleurenpalet ontstaat. Door twee primaire kleuren te mengen ontstaan de secundaire kleuren. Door drie primaire kleuren te mengen ontstaan de tertiaire kleuren, en zo verder. Dus:

• Primaire kleuren
  De basiskleuren waarmee je (in theorie) alle kleuren kunt mengen. Bij RGB zijn dit rood, groen en blauw. Bij CMY zijn dit cyaan, magenta en geel.
• Secundaire kleuren
  De kleuren die je krijgt als je twee primaire kleuren mengt.
• Tertiaire kleuren
  De kleuren die je krijgt als je drie primaire kleuren mengt.

Door te spelen met de volgende interactive krijg je per kleurmodel meer inzicht in de primaire, secundaire en tertiaire kleuren en hoe die worden samengesteld. Je kunt het wiel ook draaien voor een ander perspectief.

In het wiel kun je goed zien dat de primaire, secundaire en tertiaire kleuren van het CMY model steeds het tegenovergestelde zijn van die van het RGB model. En dat is natuurlijk begrijpelijk, gezien het ene model kleuren optelt en het andere ze van elkaar aftrekt.

Het RGB kleurmodel

In veel grafische software, zoals Photoshop, Illustrator, Affinity Designer of Affinity Photo, kun je in het RGB-model kleuren mengen met sliders voor Rood, Groen en Blauw. Maar om je meer inzicht te geven hieronder een interactieve weergave in 3D van het RGB kleurmodel, zoals deze vaak wordt weergegeven.

De kubus heeft drie assen; Rood, Groen en Blauw. En ieder punt binnen de kubus is een unieke kleur. Je vindt hierin alle mogelijke mengkleuren. Draai de kubus rond om meer inzicht te krijgen in het model.

Cilindrische kleursystemen

In de 70er jaren, toen de computer opkwam, bleek al snel dat RGB voor computers een prima systeem is om kleuren in bestanden op te kunnen slaan, maar voor het mengen van kleuren door mensen aan rode, groene en blauwe schuifjes te laten schuiven niet erg intuïtief is om de juiste kleur te krijgen. Probeer hieronder met RGB-schuifjes maar eens tot de kleur licht kaki te komen...

Dat valt nog niet mee he? Gelukkig had in het eerste decennium van de 20e eeuw professor Albert H. Munsell al het Munsell kleursysteem bedacht. Dat systeem omschrijft kleuren niet met de componenten Rood, Groen en Blauw, maar in de drie dimensies Hue, Chroma en Value/Lightness. Die simpel gezegd staan voor kleurtint, verzadiging en helderheid.

Dit system kwam bij het begin van het computertijdperk dus goed van pas en is in de 70er jaren dan ook als basis gebruikt om tot veel intuïtievere systemen te komen om kleuren te mengen. De bekendste hier van afgeleide gelijkende kleurmodellen die we nu nog steeds gebruiken zijn HSV/HSB en HLS/HSL. Dit noemen we cilindrische kleursystemen, omdat je ze in 3D als cilinders kunnen worden weergeven. Maar je kunt ze ook als kegels weergeven en dat vind ik zelf ook een passender vorm om deze kleursystemen weer te geven in 3D.

Onthoudt dat deze modellen puur handigheidjes voor mensen zijn om gemakkelijk kleuren te kunnen mengen, maar dat 'onderwater' de computer de kleuren uiteindelijk nog altijd omzet naar RGB-waardes om ze op een monitor te kunnen weergeven en in bestanden op te slaan.

Het HSV kleurmodel

HSV staat voor Hue, Saturation, Value. Dit model wordt ook soms HSB genoemd, waarbij de B staat voor Brightness. Maar dat is precies hetzelfde model. Als ik hieronder schrijf over HSV geldt dus hetzelfde voor HSB.

Het HSV model simuleert hoe verschillende kleuren verf samenmengen, waarbij de kleurtint (hue) in een bepaalde verzadiging (saturation) in verschillende gradaties instelbaar is van geen kleur tot pure kleur en de Value-parameter daarbij bepaalt hoeveel zwarte of witte verf er virtueel bij wordt gemengd om de kleur donkerder of lichter te maken.

Probeer nu met sliders in dit model eens tot de kleur licht kaki te komen:

Je ziet, met dit model is het dus veel gemakkelijker om een juiste kleur te mengen. Het HSV-model kan het best worden weergegeven als een kegel, waarbij het punt onderin staat voor zwart (geen kleur en geen helderheid) en het midden van de top de kleur wit vormt met in een cirkel eromheen de kleurtinten (hue). Hieronder zie je deze kegel interactief in 3D. Draai de kegel maar eens rond om te zien hoe de mengkleuren worden opgebouwd in dit kleurmodel. Ook in dit model zijn (in theorie) alle kleurmogelijkheden van het RGB-model mogelijk en zitten deze kleuren dus ook allemaal in deze kegel.

Als je in grafische software het HSV-model gebruikt, zie je vaak drie sliders en een grafische weergave om direct een kleur te kunnen kiezen met bijbehorende helderheid en verzadiging:

• Hue
  Kleurtint. De rotatie op de kegelrand tussen 0 tot 360 graden. 0 graden is rood, 120 graden is groen en 240 graden is blauw.
• Saturation
  Verzadiging. Van 0% voor grayscale (geen kleur) tot 100% voor volledige pure kleur. 0% Is het midden van de kegel en 100% de buitenste omtrek.
• Value
  Helderheid. 0% is volledig donker en 100% is volledig licht. Waarbij 0% de onderkant van de kegel is en 100% de bovenkant.

Het HSL kleurmodel

Een model dat hier erg op lijkt, is het HLS kleurmodel. Meestal wordt dit (eigenlijk verkeerd) HSL genoemd, dus zo noem ik het verder ook. HSL staat voor Hue, Saturation en Lightness en hieronder zie je hoe dit model er in 3D uitziet:

In tegenstelling tot het HSV model, wordt bij HSL niet uitgegaan van lagen verf over elkaar, maar hoe we ook daadwerkelijk kleuren waarnemen. Nog steeds is het onderste punt volledig zwart en het bovenste punt volledig wit, maar nu liggen de verzadigde kleuren al halverwege in de cirkel, waarbij de lightness 50% is. En een lightness van 100% is nu altijd wit, onafhankelijk van de tint (hue) en de verzadiging (saturation) van de kleur. Eigenlijk zou je kunnen zeggen dat de Value in het HSV model staat voor hoeveelheid licht, terwijl de Lightness-waarde in HLS staat voor de hoeveelheid wit. Vandaar dat dit model ook het beste kan worden weergegeven als twee kegels op elkaar, een dubbele kegel.

En CMYK dan?

Alhoewel CMYK buiten het bereik van dit blogartikel valt, omdat dit kleurmodel bedoeld is voor drukwerk en dus op internet niet wordt gebruikt, is het zo'n bekend en veelvoorkomend model dat ik toch even een uitstapje maak en deze kort behandel voor de volledigheid.

Hiervoor zagen we al dat bij subtractieve kleurmenging, dus menging van verf of inkt, de primaire kleuren Cyaan, Magenta en Yellow (Geel) zijn (CMY). Maar in veel softwarepakketten vind je het kleurmodel CMYK, dus hoe zit het met die K dan?

Alhoewel je met Cyaan, Magenta en Geel in theorie tot alle mogelijke kleuren en zwart kunt komen, wordt er toch nog een vierde inkt aan drukpersen en printers toegevoegd: de K... voor zwart. Maar als je een kleuren-inkjetprinter hebt wist je dat vast al lang, want naast de kleuren cartridges heb je altijd een aparte cartridge voor zwart.

Maar waarom nog een extra zwart als je door C, M en Y te mengen zwart krijgt, zoals we eerder zagen? Dat heeft twee redenen. De eerste is dat cyaan, magenta en geel bij elkaar opgeteld nooit perfect zwart vormen en de tweede is dat zwart mengen op die manier wel erg veel inkt gebruikt en dus erg duur is. Bij iedere zwarte pixel wordt namelijk driemaal de hoeveelheid inkt gebruikt en inkt is duur. Daarom is ervoor gekozen een extra zwarte inkt toe te voegen, zodat je cyaan, magenta en geel spaart bij het drukken van zwart.

In professionele grafische software kun je niet alleen werken met RGB color models, maar ook met CMYK. Let dus op dat je wel in het juiste kleurmodel werkt. Maak je iets voor drukwerk of print (dus inkt of verf), dan werk je meestal in CMYK. Maak je iets voor internet of video (dus licht), dan gebruik je RGB.

Als je in een grafisch softwarepakket van RGB naar CMYK converteert is de kans groot dat je kleuren niet meer gelijk zijn. Het kleurbereik van de CMYK color space is namelijk aanzienlijk kleiner dan die van de meest gebruikte RGB color spaces. Wat color spaces precies zijn zal ik uitgebreid uitleggen in het volgende artikel.

Omzetten van CMY naar RGB zal minder problemen geven, maar het beste is om je werk bij het ontwerpen al gelijk in het juiste color model en de juiste color space te maken. Zo weet je zeker dat je kleuren in het resultaat zijn zoals je in je design hebt bedoeld.

Conclusie

Tot zover dit eerste deel van dit tweeluik over color models en color spaces. Ik hoop je hiermee een beter begrip te hebben geven van wat color models zijn. In het komende en laatste deel van dit twee-luik pakken we door met Color Spaces. Wat zijn color spaces nu precies, waarom is dat voor een professional essentieel om goed te begrijpen en welke color spaces en color profiles gebruik je, en wanneer, voor je grafische werk? Ik zal dan ook een uitstapje maken naar gamma-correctie en bit depth. Het tweede deel vind je hier.

Als je de techniek achter kleuren net zo interessant vindt als ik, nodig ik je graag uit het volgende blog artikel gelijk te lezen. Je wordt dan pas echt een pro op dit onderwerp!

Ga gelijk door naar deel 2 >