TECHNISCHE DIENST

  COMPUTERSCHERM ALS SCHILDERSDOEK      
         
  Schilderen, dat is kleuren
Kleuren zijn belangrijk voor schilders en voor de mensen die in schilderijen geïnteresseerd zijn. Maar door een vrijwel onbegaanbaar woud van termen, die op tegenstrijdige manier of ongedefinieerd gebruikt worden, is het moeilijk om hier goed begrip te verwerven. Geesje Mesdags schoonzuster, Sientje, klaagt er al over dat ze pas een dag na de uitleg door Willem Roelofs een beetje begint te begrijpen wat er met "toon" bedoeld werd. Figuur 1.
De eerste vraag die zich opdringt is: hoeveel kleuren bestaan er eigenlijk? De meeste mensen kennen wel zo'n tien tot twintig kleurnamen, en ze hebben het gevoel dat er nog wel allerlei nuances van bestaan, die bij dat twintigtal ondergebracht kunnen worden. In een schildersdoos zitten niet zo veel meer dan tien à twintig tubes, maar door mengen op het palet kun je daar natuurlijk heel veel variaties mee maken. Volgens de literatuur kan het menselijk oog tien miljoen kleuren onderscheiden. Ik denk dat die gevoeligheid zich uit lijfsbehoud heeft ontwikkeld: je ziet een voorwerp niet door een zwart randje zoals in een tekening, maar door een sprongetje in aangrenzende kleuren. Dat onderscheidend vermogen geldt niet voor van elkaar verwijderde kleurvlakken, hoop ik, anders schiet ik een flinke factor te kort. En met het onthouden van kleuren is het helemaal mis. Als ik een paar sokken koop bij de kleur van een overhemd dat thuis in de kast hangt, kan je lachen.

 


Figuur 1. Fragment van Willem Roelofs, De Regenboog
Wat bedoelde Roelofs met "toon"?
   
 

Kleurkubus
Een objectieve codering van kleuren met een overzicht over alle bestaanbare nuances zou heel welkom zijn. Er zijn minstens zes kleurnormalisaties ontworpen, compleet met staalkaarten, kleurenatlassen en kleurcodes. Figuur 2 laat de befaamde kleurendriehoek van de CIE (Commission Internationale d'Eclairage) zien, die gebaseerd is op simulatie van de kleurgevoeligheid van het oog met fotoelectrische cellen. Ook de computer biedt een elegante ordening, hoewel we niet mogen verzwijgen dat er spraakverwarring heerst en dat betrouwbare kleuroverbrenging een probleem is. Er zijn verschillen tussen computerplatforms (Macintosh, Windows ...), non-standaard terminologie bij ontwerpprogramma's (Photoshop, Painter, Fireworks ...) en afstellingsmoeilijkheden tussen monitors, printers, scanners, en browsers.
Het oog is niet, zoals het oor voor geluid, gevoelig voor aparte golflengten van het zichtbare licht. Het gevolg is dat een bepaalde kleur, zoals geel, niet alleen opgewekt kan worden door één vaste golflengte, maar ook door bepaalde mengsels van verschillende golflengten. Bijvoorbeeld door wit licht (dat is een mengsel van rood, geel, groen, cyaan, blauw en violet)
op een kleurstof te schijnen die vooral het blauwe deel van het spectrum absorbeert. Daardoor wordt vooral rood, geel en groen gereflecteerd, wat er geel uitziet. Alle kleuren worden waargenomen, volgens een gangbare theorie, door de verhouding en de sterkte waarmee slechts drie onderscheiden soorten receptoren worden geprikkeld (al doet dit niet helemaal recht aan de verwerking in de oogzenuw en de hersenen tot de contrasten rood/groen, geel/blauw, en licht/donker). Daarvan wordt gebruik gemaakt voor computer-monitors door per beeldpunt, pixel, drie getallen op te geven voor de helderheid van drie kleurkorrels respectievelijk een rode, groene en blauwe die samen de pixel vormen. De term helderheid betekent de hoeveelheid lichtstraling die in zo'n korrel opgewekt wordt, en die tot het maximum kan variëren in stapjes van 0 tot 255. Dat aantal van 256 is gekozen omdat het correspondeert met 2 tot de achtste, een byte, de maat voor geheugengebruik in de computer. Alle kleuren tezamen kunnen nu worden aangegeven in een driedimensionale tabel of spreadsheet van telkens 256 rijen, kolommen en etages, voor de drie getallen, op doorzichtige wijze aangeduid als R, G en B. De kleurkubus van figuur 3. Een driedimensionale tabel wordt gemaakt door in drie loodrechte richtingen een kolom met oplopende waarden uit te zetten. Die kolommen zijn hier zo smal dat we ze als de 3 ribben van een kubus tekenen (vaak assen genoemd) met als eindpunten gemakshalve weer de letters R, G en B. De drie waarden R,G en B in een tabelcel (hier zo klein dat we hem als een punt voorstellen) worden gevonden zoals in een gewone tabel of grafiek door ze loodrecht op de bijbehorende waardenkolom af te lezen.

 


Figuur 2. Kleurendriehoek van de CIE

 

 

 

 

 


Figuur 3. De rood-groen-blauw kleurkubus

   
 

Rood-groen-blauw of cyaan-magenta-geel
Met een loep met vergroting van 20X kun je de kleurkorrels op een monitorscherm onderscheiden. Op een electronenstraalbuis liggen ze bijvoorbeeld in een honingraatpatroon, op een LCD-monitor als telkens drie vertikale streepjes binnen vierkantjes. Is het geen wonder dat ondanks die verschillen in technische uitvoering kleuren toch nog redelijk overeenstemmen op verschillende apparaten? Het probleem is dat er geen kleurstofkorrels bestaan met precies de theoretisch gewenste eigenschappen. Een goed merk heeft ingebouwde correctiefilters. Hier zit een hele tak van techniek achter, voor het "synchroniseren" van kleuren, zoals ColorSync van Apple.
Op een printer wordt net als bij een krantenfoto (en in zekere zin bij een schilderij) ook met drie basiskleuren gewerkt: magenta, geel en cyaan. Het grote verschil is dat een print met wit licht verlicht moet worden. Het licht dat door het papier weerkaatst wordt gaat twee keer door de inktlaag en verliest daarbij door absorptie een gedeelte van zijn kleuren die aanvankelijk het hele spectrum van de regenboog omvatten. Dat principe is zo hemelsbreed verschillend van licht dat ongehinderd van monitorscherm naar oog gaat, dat ook heel andere mengregels gelden. Figuur 4 en 5. Bij inkt en verf levert een mengsel van geel met bauw (of geel met cyaan) een groene kleur op, maar bij een monitor wordt geel juist gemaakt uit rood en groen - zoals u met een loep kunt verifiëren.
Mensen die aan olieverf gewend zijn, vinden het maar raar wanneer in een monitor geel uit rood en groen gemaakt wordt. En ook de basiskleuren van drukinkt voelen ze als onwennig, want de echte basiskleuren zijn volgens hen rood, geel en blauw. Bovendien, verf lijkt zo dekkend en ondoorzichtig dat men zich nauwelijks kan voorstellen dat het vrijwel net zo werkt als bij inkt. Verf bestaat uit heel kleine korreltjes kleurstof ingebed in een doorzichtige stijve vloeistof die langzamerhand hard wordt, bijvoorbeeld lijnolie. Wit licht kan over een kleine afstand in een verflaag binnendringen, zoals de blik van een wandelaar een eindje kan binnendringen in een woud van dicht opeengeplante bomen. Stel dat de verf blauwe en gele pigmentkorrels bevat, dan wordt uit het opvallende witte licht door absorptie in de korrels een deel weggevangen, zodat het licht wat uiteindelijk teruggekaatst wordt een groene indruk geeft. De cyaanblauwe korrels absorberen vooral het complementaire rood met het aangrenzende magenta en geel. De gele korrels absorberen vooral het complementaire blauw met het aangrenzende cyaan en magenta. Zodat tenslotte in de reflectie van het witte licht alleen het groen resteert.

 


Figuur 4. Mengregel voor verf: blauw en geel
geeft groen

 




Figuur 5. Mengregel voor monitors: rood en groen
geeft geel

   
 

Verkenning
Jammer, maar een printer kan niet alles weergeven wat de monitor toont, en die kan op zijn beurt weer niet alle kleuren uit de natuur reproduceren. Maar hij komt een heel eind, en we willen nu verkennen hoe die kubustabel er uit ziet. Daartoe stellen we eerst vast, dat de som van de drie getallen in een cel, R + G + B, in principe de helderheid van de samengestelde kleur is. Als de drie componenten ieder nul zijn is de som ook nul, en een helderheid nul betekent totaal donker oftewel zwart, aangegeven met Z bij de kubus.
Anderzijds, voor R = G = B = 255 is de som maximaal. Dat is de grootste helderheid die bij combinaties in de kubus mogelijk is. Alle drie receptoren worden dan even sterk geprikkeld. Dat blijkt de kleur wit te zijn, aangegeven met W. Iedere andere combinatie met drie gelijke tabelwaarden R, G en B maakt een lichtindruk zonder uitgesproken kleur: dat is grijs. Die grijzen liggen dus langs de kubusdiagonaal, tussen wit en zwart. Figuur 6. Grijs is een menging van wit en zwart, net als op het schilderspalet. In de kubus is dat het voorbeeld van een algemene regel: een kleur op een rechte lijn gedraagt zich als een menging van de kleuren aan de uiteinden van die rechte lijn.
We kennen nu al vijf hoekpunten van de kubus: Z W R G B. Er zijn nog drie hoekpunten van de kubus, waarvan de kleur gevormd wordt door de som van telkens twee basiskleuren in hun meest intense toestand. Dat zijn de drie intense kleuren magenta (M = R + B), geel (Y = G + R) en cyaan (C = G + B). Figuur 6 nogmaals. Hier is de letter Y (van yellow) voor geel gekozen omdat de G al bezet is.
In bijvoorbeeld het kubusvlak ZRMB liggen allerlei purpers: op de diagonaal van Z naar M de toenemend heldere magenta's, en ter weerskanten daarvan de rodere en blauwere varianten daarvan. Dat geldt bij uitstek voor de ribben RM en BM, waarop de som van de twee betrokken componenten groot is en de kleur ver van zwart blijft. Bovendien is derde component daar nul zodat er geen aandeel wit kan ontstaan. Zulke kleuren noemt men "verzadigd": kleuriger en pittiger dan deze zijn niet bestaanbaar. Samen met de analoge ribben tussen de andere twee basiskleuren is er nu een band van sterke, verzadigde kleuren die er uit ziet als de regenboog aangevuld met purpers rond M.

 


Figuur 6. De grijsas in de kleurkubus

 

 


Figuur 7. Het loodvlak midden door de grijsas
snijdt de kubus volgens een zeshoek

   
  Van verzadigd naar onverzadigd
Hoe is het nu in het inwendige van de kubustabel? De meest sprekende kleuren bevinden zich natuurlijk niet in de kubuspunt bij het zwart – daar zijn ze te donker. Noch in de punt bij het wit – daar zijn ze te bleek. We moeten ze zoeken rond het midden in een vlak loodrecht op de lijn van de grijzen bij helderheid 50% midden op die grijsas. Zo'n vlak is in de kubus getekend, en het blijkt een regelmatige zeshoek te zijn (figuur 7). De zes ribben langs de bovengenoemde punten R Y G C B M R lopen zigzag onder en boven het vlak van helderheid 50% (figuur 8). Beurtelings stijgt de ene component van een paar basiskleuren tot maximum en daalt de andere weer tot nul op die lijn. Voor die regenboogzigzag vermeldt de computer bij voortduring een helderheid 50% hoewel het oog daar een helderheidsgolf in ziet, zeker bij geel en cyaan. De buitenlijn van de regelmatige zeshoek vertoont bij benadering ook die regenboogkleuren aangevuld met een pupersegment. Figuur 9 toont de kubus van figuur 7 gezien precies langs de grijsas. De zes ribben met de regenboog vormen de buitenste zeshoek. Het middelvlak snijdt de kubus in de ingeschreven zeshoek.
Beweegt men van de rand van de zeshoek naar het middelpunt dan worden de drie componenten R, G en B steeds meer aan elkaar gelijk en verandert de tabelcel van uitgesproken kleur naar kleurloosheid – naar grijs of wittig. De kleuren in het inwendig van de kubus zijn onverzadigd.

 


Figuur 8. De kleurkubus op zijn punt gezet,
en de voornaamste ribben ingekleurd

 


Figuur 9. De kleurkubus van figuur 7
gezien langs de grijsas

 

   
 

GIF en tegengif: websafe kleuren
Hoe krijgen we ooit een overzicht over 256 X 256 X 256 kleuren? Als het er maar 200 X 200 X 200 waren, zouden er al 8 miljoen kleuren zijn zoals je uit je hoofd kunt uitrekenen. In werkelijkheid zijn het er zelfs twee keer zo veel.
In kleurkiezers van ontwerpprogramma's wordt een overzicht over de kleuren geschematiseerd via drie enigszins andere grootheden dan we hierboven hebben gedaan, namelijk

  • de regenboogkleur (H)
  • de verzadiging (S)
  • de helderheid (V).

De regenboogkleur, H, kan worden gekozen als een willekeurig punt op een cirkelomtrek zoals figuur 10. Dit wordt door sommige schrijvers de kleurtoon genoemd. In het Engels heet het hue, met een woord dat zijn betekenis pas krijgt door de context, zoals zo vaak in het Engels. Want hue betekent ook nuance, kleurzweem, tint, terwijl men juist spreekt van de colours of the rainbow.
De verzadiging, S, de mate van bijmenging van wit is uit te drukken als de afstand tot de grijsas en kan aangeklikt worden op een cirkelschijf zoals figuur 11. Die schijf kan ook opgevat worden als een geïdealiseerde CIE-driehoek: de uitwas aan de groene kant is wat samengetrokken, en tegelijkertijd is de platte kant bij het tegenovergelegen magenta iets uitgebold.
Bij gekozen regenboogkleur en verzadiging moet de helderheid, V, nog ingesteld
worden, op een eendimensionale schuif (kleurkiezer Apple). Maar het is ook mogelijk om de helderheid samen met de verzadiging per kleur in een driehoek op te geven (kleurkiezer Painter). Daar komen we nog op terug bij figuur 14.
Hoewel dit HSV-model van een heel ander principe uitgaat, lijkt het toch wel op de kleurkubus op zijn punt van figuur 8, met de helderheid uitgezet lang de grijsas, en de verzadiging als de afstand tot de grijsas. En de regenboogcirkel is in hoge mate verwant met de gordel van regenboogkleuren die zich bevindt in het hoekige gebied van figuur 9.

Maar, zestien miljoen! Wil je zo' n grote keus wel?
In de begintijd toen men nog zuinig met computergeheugen omging en transportsnelheid over het net een zorgenkindje was, heeft men geoordeeld dat 256 kleuren in totáál al wel genoeg moest zijn. Tussenliggende kleuren kan de computer dan maken met "dithering", een techniek die aan pointillisme doet denken.
Er is nog steeds belangstelling voor een beperkt aantal kleuren: voor tekenfilms en games. Want 1 byte per pixel in plaats van 3 is wel veel sneller. Het format dat zich bezig houdt met egaal gekleurde vlakjes met deze beperking heet GIF, geschreven met bestandsextensie .gif. (Voorbeelden figuren 4 en 5.)

 



Figuur 10. Regenboogcirkel de Painter-kleurkiezer

 

 

   
 

Hexadecimaal
Uit de browserbegintijd dateert ook de afspraak om zich te houden aan een bepaalde groep van 216 kleuren van de 256, die gemeenschappelijk zijn in de systemen van Macintosh en Windows: "websafe kleuren". Dat is een verzameling waarin de drie basiskleuren in 5 stappen ter grootte van 51 vanaf 0 naar 255 gaan. Men had die stappen kunnen aangeven met 0, 1, 2, 3, 4, 5 maar het is gebruikelijk om die drie getallen op te geven in het hexadecimale stelsel, als telkens twee cijfers. Die zes cijfers staan zonder spatie of komma botweg achter elkaar, in de volgorde roodgroenblauw. Hexadecimaal wil zeggen: op de positie van de tientallen staan daar zestientallen. En de eenheden tellen, in plaats van tot 9 zoals normaal is, tot 15. En wel met letters, bij gebrek aan cijfers: 0, 1, ... 8, 9, A, B, C, D, E, F. Waarin F dus de waarde van 15 in het tientallig stelsel heeft. Dan wordt de bovengenoemde 51 in hexadecimale code: 33. Namelijk 3 zestientallen plus 3 eenheden. En de kleurcodes zijn nu de veelvouden van die hexadecimale 33, namelijk 00, 33, 66, CC, FF.
Hoewel tegenwoordig dat systeem van 256 kleuren aan belang heeft ingeboet, biedt een palet met 216 kleuren nog steeds een bruikbaar overzicht over het hele bereik, en krijgt het veel aandacht in HTML-ontwerptoepassingen.
In het Webmuseum wordt dat benut voor de keuze van achtergrondkleuren. Zo is bijvoorbeeld het grijsblauw hiernaast 6699CC. Wit is FFFFFF en zwart 000000. Hoe groter het getal, des te lichter de kleur.
De 216 websafe kleuren vormen dus een hanteerbaar aantal vergeleken met de 16 miljoen van de originele kubustabel, maar toch is het moeilijk om ze in een goede rangschikking te presenteren. De opstelling in 6 etages van 36 stalen met stapsgewijs afnemende waarde van groen (Painter) vestigt de indruk dat er vooral groenen en purpers bestaan. De ordening van BBEdit als een soort cryptogram met zes aandachtscentra toont wel een aantrekkelijke slimme verdeling over de mogelijkheden (figuur 12). Maar er is geen doorzichtig verband met de kleurkubus.

 


Figuur 11. Kleurvlak in de kiezer van Apple
   
 

Zestien staalkaarten
Hieronder tonen we hoe staaltjes eruit zien, als ze bij elkaar gezet worden als snijvlakken loodrecht op de grijsas van de kleurkubus. We hebben hierboven gezien dat een vlak bij precies 50% de kubus snijdt als een regelmatige zeshoek. Onze vlakken liggen zowel onder als boven die 50%. Dat geeft wel een zeshoek, maar geen regelmatige. En nog verder van het 50%-niveau zijn de snijvlakken eerst driehoeken, en tenslotte een punt. De lijnen van toenemende waarde van rood, groen of blauw, de coördinaatassen, liggen in zo'n snijvlak niet meer loodrecht op elkaar maar maken hoeken van 120 graden. Om de kleurcellen toch in een een normale rechthoekige HTML-tabel te vangen, vervormen we de zeshoeken en driehoeken een beetje zodat de coördinaatas van rood naar rechts wijst, en loodrecht daarop die van groen omhoog, en die van blauw onder 45 graden naar linksonder. De zestien staalkaarten (snijvlakken) zijn gerangschikt in vijf rijen, van kubushoekpunt "zwart" tot hoekpunt "wit. In werkelijkheid grenzen de kleurpunten natuurlijk niet aan elkaar. Die rangschikking dient alleen om de stalen zo groot mogelijk te tonen. Iedere staalkaart verder naar rechts heeft iets grotere kleurgetallen en is daardoor iets helderder. Alle hebben ze groen boven, rood rechts, en blauw linksonder, in analogie met de standaard kleurendriehoek, figuur 2, van de Commission Internationale d'Eclairage (CIE).
In het centrum staat steeds grijs of een grijzige kleur.

 



Figuur 12. Websafe kleuren van BBEdit
   
  Keuze uit 216 kleuren      
         
 
Toch miljoenen

Het is opvallend hoe klein in deze tabellen de kleurverschillen zijn tussen naburige kleuren in een zelfde vlak, of tussen buren boven elkaar in opeenvolgende vlakken. Daardoor zou je aan het twijfelen kunnen slaan of 216 kleuren dan nog niet genoeg is en of er echt 16 miljoen nodig zijn. Maar het oog is subtiel. In verloopkleuren, die in de natuur nogal eens voorkomen, bijvoorbeeld in een strakblauwe lucht, of op een egaalkleurig voorwerp dat door een lichtbron afnemend verlicht wordt, zijn die 216 niet toereikend en treedt kleurbandvorming op (figuur 13 rechts).
Dus voor foto's en schilderijen worden toch alle kleuren benut die door 3 byte per pixel (ook wel 24 bits-kleuren genoemd) beschikbaar komen. Het format waar dat in gebeurt (maar waarin wel andere bezuinigingen een rol spelen) heet JPEG, geschreven als filenaamextensie .jpg. In dat format komen vrijwel alle illustraties in het Webmuseum voor. Bijvoorbeeld de linkerhelft van figuur 13 heet RYgradient.jpg.

 

 
Figuur 13. Roodgeelgradient in
JPEG (links) en in GIF (rechts)
   
 

Een toonbeeld
Nu we tot de conclusie zijn gekomen, dat toch de complete kubustabel van belang is, willen we nog een kubusdoorsnijding verkennen die hierboven al was aangekondigd: een vlak door enerzijds de kubusdiagonaal gevormd door de grijzen, de grijsas, en anderzijds een punt van het oppervlak gelegen in de regenboogzigzag-ribben, bijvoorbeeld oranje-geel. Alle zo gedefinieerde doorsnijdingen hebben de vorm van een driehoek, al zijn ze niet helemaal gelijkvormig. De twee rechterzijden van de driehoek zijn afkomstig van de buitenzijde van de kubus. Het vormverschil wordt in een kleurkiezer als die van Painter buiten beschouwing gelaten. Het zijn steeds driehoeken met linksboven het witpunt, linksbeneden het zwartpunt en rechts de gekozen verzadigde regenboogkleur, en daartussen steeds een overeenkomstig patroon van verloopkleuren. Figuur 14.
Naarmate een punt meer in de richting van de grijsas ligt vanaf het rechter hoekpunt, vertoont dit punt een minder verzadigde (grijzer of wittiger) nuance van de uitgangskleur. En hoe hoger men dit punt in vertikale richting in de driehoek kiest, des te lichter (helderder) wordt de gekozen kleur, die helemaal links van uitgesproken zwart in wit verandert. Op bepaalde uitzonderingen na, benoemt men alle individuele kleuren in zo'n driehoek met dezelfde naam, en spreekt men van de "tonen" van die kleur. Sommige schrijvers onderscheiden de nuances aan de bovenkant van de driehoek nog met de term "tint", en die langs de onderkant met de term "schaduw". Het valt te vrezen dat Sientje, die nu net begon te begrijpen wat een toon is, de draad weer gaat verliezen.

 

 


Figuur 14. Voorbeeld in de kleurkiezer van Painter
van een vlak voor helderheid en verzadiging
   
  Afschilderen
We concluderen dat het rood-groen-blauw systeem van de computermonitor kan helpen om inzicht te krijgen in de manier waarop kleuren geordend worden. De terminologie wordt verduidelijkt , en er is een RGB-staalkaart om "zaalkleur" te kiezen. Een monitor heeft voldoende kleuren om schilderijen goed weer te geven, mits hij naar behoren staat afgesteld.
Het Webmuseum kan daardoor het gemis van kleuren in de zwartwit uitgave van "Geesje van Calcar – een echte Mesdag" helemaal goed maken.
   
   
 

 

Figuur 15. Geesje Mesdag-van Calcar, Bonte Zomerbloemen
achtergrondkleur CC3300
   
  Rob Vetter, augustus 2007      

www.mesdagvancalcar.nl, 15 september 2007