Ontwerpen op je pc: wat is de ideale kleurcombinatie?

Door: dirk-schoofs | 20 september 2019 10:52

Algemeen

Artiesten en ontwerpers hebben zich eeuwenlang verdiept in de kleurentheorie en van die kennis kan vandaag de dag iedereen gebruikmaken. Met een beetje inzicht en een aantal eenvoudige tools creëer ook jij de perfecte kleurcombinatie. Ontwerpen, het interieur en zelfs een outfit komen hierdoor beter tot hun recht. Dankzij de kleurentheorie weet je waarom het samenspel van bepaalde tinten werkt en waarom sommige combinaties bijna pijn doen aan de ogen.

De Franse kunstenaar Claude Monet sprak ooit de gevleugelde woorden: “Kleur is mijn dagelijkse obsessie, vreugde én kwelling.” Maar zelfs voor de gewone sterveling kan de zoektocht naar de juiste kleur een lastige opdracht zijn, want de invloed van kleur mag je niet onderschatten. Kleur trekt de aandacht naar een bepaald detail, het brengt ons in een bepaalde stemming en het werkt zelfs als communicatiemiddel zonder dat we woorden moeten gebruiken, denk maar aan de verkeerslichten. In deze basiscursus gaan we het hebben over wat er gebeurt als je bepaalde tinten naast elkaar gebruikt. De kennis die hierover is opgebouwd, noemen we de kleurentheorie. Hoewel Isaac Newton in 1666 het kleurenwiel uitvond door het kleurenspectrum op een cirkel in kaart te brengen, is de kleurentheorie geen zuivere wetenschap. Het is een organisch gegroeid geheel van artistieke ervaring en wetenschap waardoor we weten welke kleuren er samen goed uitzien. Hierbij speelt zelfs de cultuur en de periode waarin we leven een rol. Zo zeiden onze grootouders: ‘Blauw met groen is boerenfatsoen.’ Oftewel: door die twee kleuren naast elkaar te gebruiken, verraadde je destijds slechte smaak. Maar tegenwoordig leidt de combinatie van blauw en groen juist tot hele frisse combinaties. Of de kleuren van stoffen in Afrika, die zijn totaal anders dan het typische textiel van Noord-Europa. En dan zijn ook nog persoonlijke smaak én lef twee heel belangrijke factoren.

01 Kleurencirkel

Op school heb je geleerd over de primaire kleuren rood, geel, blauw. Als je rood en geel samenvoegt, krijg je oranje. Blauw met geel geeft groen en blauw en rood resulteert in paars. Door twee primaire kleuren samen te voegen, krijg je de secundaire kleuren. Als je een secundaire kleur vervolgens met een van de naastliggende primaire kleuren mixt, ontstaan er nog meer tussenliggende kleuren, zoals roodoranje en geelgroen. Op die manier kom je uit bij de fameuze kleurencirkel. Deze cirkel is een manier om zichtbaar te maken hoe primaire en secundaire kleuren in elkaar overlopen.

01 In de kleurencirkel zie je hoe de verschillende kleuren in elkaar overlopen.

02 Tinten

Neem je een kleur van het kleurenwiel en wijzig je daar de verzadiging of helderheid van, dan kom je uit bij de tinten van een bepaalde kleur die je aantreft in de honderden kleurenstalen van de verfhandel. Iedere tint bestaat uit drie eigenschappen: kleurtoon, verzadiging en waarde. Kleurtoon (Engels: hue) is gewoon een ander woord voor kleur. Verzadiging of saturatie verwijst naar de intensiteit of zuiverheid van de kleur. De waarde (value of helderheid) geeft aan hoe donker of hoe licht de kleur wordt weergegeven. Als je de waarde maximaal ophoogt, kom je uit bij wit. Zet je de waarde op 0, dan krijg je zwart.

02 We hebben de verzadiging en helderheid van de bovenste kleurtoon in ieder stapje met 20% verminderd.

03 Altijd veilig

De meest eenvoudige manier om kleurenharmonie te verkrijgen, is via een monochroom kleurenschema. Je vertrekt van een basiskleur die goed aanvoelt; die het ontwerp mag domineren. Daarna gebruik je lichtere en donkere variaties van deze kleur voor accenten of voor de andere elementen. Met een monochrome keuze speel je op safe. Je weet dat je hiermee nooit vloekende combinaties zult maken en je hebt onmiddellijk rust en eenvoud. Al moet je er wel op letten dat de tinten voldoende van elkaar verschillen, want als de tinten in een monochroom kleurenschema te dichtbij elkaar liggen, ontstaat er een verwarrend gevoel.

03 Een monochroom schema is altijd veilig, maar oogt wel saai.

04 Meer gedurfd

In het analoge kleurenschema gebruik je kleuren die naast elkaar liggen in het kleurenwiel, zoals rood en oranje of blauw en paars. Durf je verder te gaan, dan kun je twee tegenover elkaar liggende kleuren van deze kleurencirkel met elkaar combineren. Dan werk je met complementaire kleuren als blauw en oranje of de klassieker rood en groen. De complementaire combinatie levert een krachtig contrast op en soms kan de confrontatie van de twee kleuren te simplistisch en zelfs te hard overkomen. Je lost dit op door bij een van de twee complementaire kleuren de verzadiging of de helderheid te verminderen, zodat je bij een meer gedempte tint van de complementaire kleur uitkomt. Drie kleuren die gelijkmatig verdeeld zijn over het kleurenwiel leveren ook een hoog contrastkleurenschema op, maar zo’n (triadic) schema is minder hard en veelzijdiger dan de complementaire combinatie.

04 Een analoog, complementair of driehoekig kleurenschema is meer dynamisch.

Kleurmodus

Uiteraard moet je met elkaar en met de programma’s op je computer nauwkeurig kunnen communiceren over de tinten. Computerschermen werken met de hoofdkleuren rood, groen en blauw (rgb). Als je die op volle kracht met elkaar mengt, krijg je wit. Dat lukt alleen wanneer je lichtkleuren mengt. Als je rode, groene en blauwe verf zou mengen, krijg je modderbruin. Daarom werken printerkleuren volgens een ander systeem, namelijk cmyk, dat bestaat uit cyaan, magenta, geel en zwart. De k van ‘key’ slaat op zwart. Cmyk-tinten komen niet tot stand door licht, maar door inkten te mengen die licht absorberen.

Kleuren op het web worden aangegeven in de zogenaamde hex-codes. Een hex-code bestaat uit een combinatie van zes letters en cijfers en begint altijd met een #.

En dan is er nog een laatste systeem, het Pantone Matching System (pms). Met dit systeem werken drukkers, het telt meer dan 1.500 kleuren. Dit nummersysteem garandeert dat een kleur overal ter wereld exact gelijk is.

Wanneer je kleuren omzet naar een andere modus wijzigt de tint altijd een beetje.

05 Adobe Color

Een interessante tool om geslaagde combinaties te vinden is Adobe Color. Dit hulpprogramma zit geïntegreerd in de huidige ontwerpapplicaties van Adobe, zoals Illustrator en Photoshop, maar je kunt er ook gratis gebruik van maken via color.adobe.com. In het tabblad Maken geef je eerst aan welk schema je wilt zien: analoog, monochromatisch, ... Vervolgens sleep je de selectiepunten op de kleurencirkel. Adobe Color zorgt ervoor dat je steeds bij een harmonieus tintenpalet uitkomt. Door zo’n punt naar het centrum van de cirkel te slepen, wordt de kleur helderder en minder gesatureerd, sleep je ze naar de buitenkant dan worden de kleuren rijker en dieper.

05 Aan de hand van het soort schema dat je kiest, produceert Adobe Color een geslaagde combinatie.

06 Tropisch, maanlicht, genot

Een andere interessante mogelijkheid van Adobe Color is dat je eenvoudig bepaalde combinaties kunt vinden op basis van trefwoorden. Als je bijvoorbeeld een set pittige tinten wilt hebben voor de uitnodiging van een tropisch tuinfeest, dan levert de zoekterm ‘tropical’ je een hoop inspiratie en kleurstalen op. Door op zo’n voorbeeld te klikken, krijg je een vergroting van de kleurstaal en zie je de verschillende notaties van de kleuren in rgb, hsv, cmyk, png en lab. Deze leuke manier van zoeken naar kleurenschema’s werkt ook met abstracte zoektermen als ‘grieve’, ‘moonlight’ en ‘enjoy’. De beste resultaten behaal je inderdaad met Engelse zoektermen.

06 Op basis van zoekwoorden vindt Adobe Color passende kleurschema’s.

07 Extraheren uit afbeeldingen

Vind je het moeilijk om geschikte kleuren te kiezen voor jouw huisstijl, dan is er niets mis mee om je inspiratie uit een digitale foto of online advertentie halen. Met de functie Extraheren in Adobe Color kun je uit een afbeelding het gebruikte kleurenschema achterhalen. Upload daarvoor de afbeelding en sleep daarna de kleurenpunten op de zones waarvan je de kleuren wilt ‘opzuigen’. Onderaan verschijnt het gebruikte kleurenschema. Bovendien maak je aan de linkerkant gebruik van de functie Kleurenstemming. Hiermee wijzig je de verzadiging en helderheid van het geharmoniseerde kleurenpallet. Eigenlijk creëer je op die manier een persoonlijk kleurenpalet op basis van andermans inspiratie. Beter goed gejat, dan slecht bedacht.

07 Sleep de punten naar de juiste plaatsen om die kleuren voor je eigen huisstijl te kunnen gebruiken.

08 Coolors

Ook met Coolors pluk je de kleuren uit een afbeelding door drag ‘n drop. Deze kleurenschemagenerator is ook beschikbaar als iOS-app en als add-on voor Adobe Illustrator en Photoshop. Op dit moment zijn er meer dan 1.300.000 kant-en-klare kleurenschema’s te vinden. In de desktopversie druk je op de spatiebalk om een nieuwe combinatie te genereren. Op die manier flits je door schema’s waar stuk voor stuk niets mis is met de kleurencombinaties. Wanneer er een kleur bijzit die je wilt behouden, klik je op die tint zodat Coolors hem vergrendelt. Daarna ga je via de spatiebalk verder tot je een tweede kleur vindt die je ook vergrendelt en zo ga je verder. Door verschillende tinten te vergrendelen, zoek je steeds gerichter.

08 De Coolors-gemeenschap deelt graag haar schema’s.

09 Exporteren

Door in Coolers op een kleur op het icoontje met de schuifjes te klikken, kun je zelf de rgb-, cmyk-, pantone- en hsb-waarden nog verder aanpassen. Bovendien kun je iedere kleur in verschillende schakeringen zien. Het resultaat exporteer je naar onder meer png, pdf of scss, zodat je het ook naar anderen kunt sturen waarmee je de huisstijl wilt delen. Heb je je bij Coolers aangemeld, dan kun je je kleurenschema’s opslaan in je profiel zodat je overal gemakkelijk toegang hebt tot je selectie.

09 Het gekozen kleurenschema kun je gemakkelijk naar je harde schijf exporteren.

Don’ts

Er zijn een aantal wetmatigheden rondom kleuren waar je niet aan moet tornen.

Zo kun je soms het gevoel hebben dat een bepaalde kleurencombinatie lijkt te trillen. Ontwerpers noemen dit fenomeen vibrerende kleuren. Dit is merkbaar wanneer je twee sterke contrasterende kleuren in volle kracht bij elkaar brengt, zoals groen en oranje of rood en paars. Houd dit niet in stand, maar los het op door één kleur te dempen door de helderheid of verzadiging van een van de twee kleuren te verminderen.

Dan bestaat er ook nog het fenomeen dat bepaalde kleuren een bepaalde emotie oproepen. Rood staat voor liefde, passie, opwinding, woede. Geel staat voor jeugdig, optimisme en uitbundigheid. Groen voor welstand, natuur, rust enzovoort… Wanneer je een kleur in de foute context gebruikt, zal dit emotioneel wringen.

En ook met gestructureerde achtergronden moet je oppassen. Grote, drukke texturen zijn vreselijk onprofessioneel en zijn de oorzaak van oogvermoeidheid.

Een voorbeeld van vibrerende kleurcombinaties.

10 Leesbaarheid

De kleuren van de website, brochure of nieuwsbrief mogen dan leuk ogen, maar als de tekst daardoor minder leesbaar wordt, is dat een breekpunt. Op Material Design vind je Color Tool die de leesbaarheid van de gekozen kleuren in combinatie met de lettergrootte meet. In Color Tool lees je tot hoever je mag gaan in de dekking van het lettertype en je wordt gewaarschuwd wanneer het lettertype te klein wordt om comfortabel te kunnen lezen.

10 Color Tool waarschuwt wanneer de leesbaarheid in het gedrang komt.

Kunstmatige intelligentie

Bij Khroma doen ze beroep op artificiële intelligentie om kleurcombinaties samen te stellen die passen bij jouw smaak. Ben je inspiratieloos en AI een kans geven, surf dan naar www.khroma.co. Je begint met het selecteren van vijftig kleurentinten die jou aanspreken, hiermee train je je het algoritme op je persoonlijke smaak. Daarna houdt Khroma je een eindeloze lijst combinaties voor waarvan je ook de kleurnamen, hex-codes, rgb-waarden ziet. Ook is er ook een zoekfunctie om te filteren op tint, waarde en kleur. Ondertussen kun je het resultaat van de kleurencombinatie op verschillende manieren beoordelen: als gekleurde tekst op een achtergrond, als kleurvlakken naast elkaar, als duotone afbeelding, in een kleurenoverloop of in paletvorm.

Khroma toont jouw favoriete combinaties ook in duotone afbeeldingen.

11 Augmented reality

Je interieur een ander kleurtje geven is altijd spannend. Pas wanneer de verf droog is, weet je of de kamer de uitstraling heeft gekregen die je voor ogen had. Omdat zo’n karwei toch een hoop werk is en geld kost, wil je dat het liefst meteen goed doen. Daarom zijn er apps waarmee je een virtuele kleur op de wanden zet zoals Flexa Visualizer en Levis Visualizer. Beide tools zijn van dezelfde verffabrikant, Flexa is alleen beschikbaar in Nederland, Levis in België. Met de visualizer scan je live de kamer, waarna je een muur selecteert zodat je daarop verschillende kleuren kunt uitproberen. Zo krijg je een behoorlijk beeld van wat je te wachten staat. Je kunt de aangepaste foto zelfs doorsturen naar vrienden om naar hun mening te vragen. Vaar niet blindelings op de foto die zo’n app maakt door direct blikken verf van die kleur te kopen. De lichtinval, glans en het moment van de dag zijn namelijk eveneens bepalend voor het resultaat. Gebruik de virtuele inkleuring om in de winkel grote kleurstalen te vragen van kleurvarianten, zodat je echt de juiste kleur voor je muren kunt vinden.

11 Zullen we de wand in oker of groen schilderen?

0 Reactie(s) op: Ontwerpen op je pc: wat is de ideale kleurcombinatie?

  • Om te reageren moet je ingelogd zijn. Nog geen account? Registreer je dan en praat mee!
  • Er zijn nog geen reacties op dit artikel.

Wanneer je een reactie plaatst ga je akoord
met onze voorwaarden voor reacties.