Waarom onze ogen complementaire kleurenpaletschema's nodig hebben ... en waar u ze kunt maken

Complementaire kleurenpaletschema's

Wist je dat er eigenlijk biologische wetenschap schuilt achter hoe twee of meer kleuren elkaar aanvullen? Ik ben geen oogarts of optometrist, maar ik zal proberen de wetenschap hier te vertalen voor eenvoudige mensen zoals ik. Laten we beginnen met kleur in het algemeen.

Kleuren zijn frequenties

Een appel is rood ... toch? Nou niet echt. De frequentie waarmee licht van het oppervlak van een appel wordt gereflecteerd en gebroken, maakt het detecteerbaar, door onze ogen omgezet als signalen en naar onze hersenen gestuurd, waar we het als "rood" identificeren. Ugh ... dat doet pijn aan mijn hoofd als ik er gewoon aan denk. Het is wel waar… kleur is gewoon een frequentie van licht. Hier is een overzicht van het elektromagnetische spectrum en de frequenties van elke kleur:

Kleur en het elektromagnetische spectrum

Dit is precies waarom wit licht dat op een prisma gericht is, een regenboog produceert. Wat er echt gebeurt, is dat het kristal de frequentie van de golflengte verandert terwijl het licht wordt gebroken:

Prisma
Het kristallen prisma verspreidt wit licht in vele kleuren.

Je ogen zijn frequentiedetectoren

Je oog is eigenlijk gewoon een frequentiedetector voor het bereik van kleurfrequenties in het elektromagnetische spectrum. Uw vermogen om kleuren te detecteren gebeurt via verschillende soorten kegeltjes in de wand van uw oog die vervolgens zijn verbonden met uw oogzenuwen. Elk frequentiebereik wordt gedetecteerd door een aantal van deze kegeltjes en vervolgens vertaald in een signaal naar uw oogzenuw, naar uw hersenen gestuurd, waar het wordt geïdentificeerd.

Is het je ooit opgevallen dat je lang naar iets met een heel hoog contrast kunt staren, weg kunt kijken en een nabeeld kunt blijven zien dat niet overeenkomt met de originele kleuren waarnaar je keek? Laten we zeggen dat het een blauw vierkant op een witte muur is:

Na een tijdje zullen de cellen in je oog die blauw licht verwerken, vermoeid raken, waardoor het signaal dat ze naar je hersenen sturen iets zwakker wordt. Omdat dat deel van het visuele spectrum enigszins wordt onderdrukt, zie je een vaag oranje nabeeld als je naar een witte muur kijkt nadat je naar het blauwe vierkant hebt gestaard. Wat je ziet is het witte spectrum van licht van de muur, minus een klein beetje blauw, dat je hersenen verwerken als oranje.

Kleurentheorie 101: complementaire kleuren voor u laten werken

Als die vermoeidheid niet is opgetreden, hoeven onze ogen en hersenen niet zo hard te werken om de verschillende golflengten (bijv. Kleuren) die ze zien, te interpreteren.

Visuele ruis versus harmonie

Laten we een analogie maken van geluid versus kleur. Als je naar verschillende frequenties en volumes luisterde die niet complementair waren aan elkaar, zou je het zo zien lawaai​ Dit is niet anders dan kleur, waar de gedetecteerde helderheid, contrast en kleur beide kunnen zijn visueel luidruchtig of complementair. Binnen elk visueel medium willen we toewerken naar harmonie.

Daarom zie je op de achtergrond van een film geen figurant in een felrood shirt. En daarom werken binnenhuisarchitecten hard om complementaire kleuren te vinden op de muren, meubels, kunst en andere kenmerken van de kamer die ze ontwerpen. Kleur is van cruciaal belang bij het creëren van de sfeer die de bezoeker krijgt als hij erin loopt, op basis van hoe gemakkelijk het voor hun hersenen is om de kleuren te interpreteren.

Jouw kleurenpalet is het equivalent van het samenstellen van een band in prachtige harmonie. En net zoals de stemmen en instrumenten die qua volume en frequentie nauw bij elkaar passen, zo ook de complementaire kleuren van je kleurenpalet. Kleurenpaletontwerp is echt een kunstvorm voor de professionals die hun kleurdetectie nauwkeurig hebben afgesteld, maar het is ook absoluut een computationele wetenschap omdat de complementaire frequenties kunnen worden berekend.

Binnenkort meer over harmonieën ... laten we teruggaan naar de kleurentheorie.

RGB-kleuren

Pixels binnen het digitale spectrum zijn combinaties van rood, groen en blauw. Rood = 0, groen = 0 en blauw = 0 wordt weergegeven als wit en rood = 255, groen = 255, en blauw = 255 wordt gezien als zwart​ Alles daartussenin is een andere kleur samengesteld uit de drie. De basisprincipes van het berekenen van een complementaire kleur zijn vrij eenvoudig ... trek gewoon de RGB-waarden af ​​van 255 voor de nieuwe RGB-waarde. Hier is een voorbeeld:

Het verschil in deze lichtfrequentie tussen oranje en blauw is ver genoeg uit elkaar dat het contrasterend is, maar niet zo ver dat het voor onze ogen moeilijk te interpreteren is. De kleurfrequenties zijn complementair en aangenaam voor onze receptoren!

Het berekenen van één kleur is eenvoudig… voor het berekenen van drie of meer complementaire kleuren moet u equivalente hoeveelheden berekenen tussen elk van de opties. Daarom generatoren voor kleurenpalet komen zo goed van pas! Met zeer weinig berekeningen die nodig zijn, kunnen deze tools u verschillende kleuren bieden die elkaar aanvullen.

Het kleurenwiel

Het begrijpen van de relatie tussen kleuren kan het beste worden gevisualiseerd met behulp van een kleurenwiel. De kleuren zijn gerangschikt in een cirkel, niet op basis van hun relatieve frequentie. De radiale afstand is de verzadiging van de kleur en de azimutale positie op de cirkel als de tint van de kleur.

Het kleurenwiel

Leuk weetje: Sir Isaac Newton ontwikkelde het kleurenwiel voor het eerst in 1665, een basis voor zijn experimenten met prisma's. Zijn experimenten leidden tot de theorie dat rood, geel en blauw de primaire kleuren waren waarvan alle andere kleuren zijn afgeleid. Kanttekening… hij paste zelfs muzikale "noten" toe op elke kleur.

Bewapen me met Harmony ...

Newton kleurencirkel

Soorten kleurharmonieën

De relaties tussen en hoe elke set complementaire kleuren wordt berekend, worden genoemd harmonieën​ Hier is een geweldige overzichtsvideo:

Aan elk type zijn verschillende kenmerken verbonden:

  • Analoog - groepen kleuren die naast elkaar op het kleurenwiel staan. 
  • Monochromatisch - groepen afgeleid van een enkele basistint en uitgebreid met de nuances, tonen en tinten.
  • Triade - groepen kleuren die gelijkmatig verdeeld zijn rond de kleur wiel
  • Complementair - groepen kleuren die tegenover elkaar staan ​​op het kleurenwiel.
  • Splitsen complementair - een variatie van complementair waarbij twee kleuren worden gebruikt die grenzen aan het complement.
  • Rechthoek (Tetradic) - maakt gebruik van vier kleuren gerangschikt in twee complementaire paren
  • Square - vergelijkbaar met de rechthoek, maar met alle vier de kleuren gelijkmatig verdeeld over de kleurencirkel
  • Samenstelling - kleur en de twee kleuren naast de complementaire kleur
  • Shades - aanpassing van de tint (toename in lichtheid), of schaduw (duisternis) voor de primaire kleur.

Dit zijn geen subjectieve thema's, het zijn echte wiskundige berekeningen met mooie namen die ons helpen de berekeningen beter te begrijpen.

Kleurenpaletschema-generatoren

Met behulp van een kleurenpaletgenerator kunt u prachtige, complementaire kleurencombinaties krijgen, zoals deze:

Ik gebruik vaak generatoren voor kleurpaletschema's wanneer ik op sites van klanten werk. Omdat ik geen expert ben op het gebied van kleuren, helpen deze tools me dingen zoals achtergronden, randen, voettekstachtergronden, primaire en secundaire knopkleuren beter te selecteren. Het resultaat is een website die veel aangenamer is voor het oog! Het is een subtiele, ongelooflijk krachtige strategie die u kunt toepassen op uw ontwerp van alles, van een advertentie tot een hele website.

Hier zijn enkele geweldige generatoren voor kleurpaletschema's online:

  • adobe - een fantastische tool met maximaal 5 kleuren waarmee u verschillende typen kunt testen, aanpassingen kunt maken en zelfs uw thema kunt opslaan in elk Adobe-product.
  • MerkKleuren - de grootste verzameling officiële merkkleurcodes die er is.
  • canva - upload een foto en ze gebruiken hem als basis voor je palet!
  • Colllor - genereer een consistent webkleurenpalet met slechts een paar klikken. 
  • Kleur Designer - Kies gewoon een kleur of gebruik de voorgeselecteerde kleuren en de app doet de rest. 
  • Kleurjacht - gratis en open platform voor kleurinspiratie met duizenden trendy, zorgvuldig geselecteerde kleurenpaletten
  • Colorkuler - genereer een kleurenpalet voor Instagram om het esthetischer te maken.
  • Colormind - een kleurenschema-generator die deep learning gebruikt. Het kan kleurstijlen leren van foto's, films en populaire kunst.
  • Kleur ruimte - voer gewoon een tot drie kleuren in en genereer enkele schema's!
  • Kleurcode - een echt coole schermbrede ervaring voor het creëren van je kleurenpalet met een aantal harmoniestijlen aan de linkerkant.
  • COLOURlovers - een creatieve gemeenschap waar mensen van over de hele wereld kleuren, paletten en patronen creëren en delen, de nieuwste trends bespreken en kleurrijke artikelen ontdekken.
  • Koelers - creëer het perfecte palet of laat je inspireren door duizenden prachtige kleurenschema's.
  • Gegevenskleurkiezer - Gebruik de paletkiezer om een ​​reeks kleuren te maken visueel op gelijke afstand
  • Khroma - gebruikt AI om te leren welke kleuren u mooi vindt en maakt paletten die u kunt ontdekken, zoeken en opslaan.
  • materiaal ontwerp - maak, deel en pas kleurenschema's toe voor uw gebruikersinterface. Het komt zelfs met een export voor uw app!
  • Muzli kleuren - voeg een kleurnaam of code toe en maak een mooi palet.
  • Paletton - kies een basiskleur en laat je inspireren.
  • Veranda - laat je inspireren door tonnen geweldige kleurenpaletten. 

Kleur en toegankelijkheid

Houd er bij het ontwerpen van uw volgende paletschema rekening mee dat er een aanzienlijk aantal mensen met visuele beperkingen en kleurstoornissen moet omgaan met uw ervaringen.

  • Contrast - Elke onafhankelijke kleur heeft een luminantie​ Kleuren van overlays en aangrenzende objecten moeten een relatieve luminantieverhouding van 4.5: 1 hebben, zodat mensen met een visuele beperking ze kunnen onderscheiden. Ik zou niet de moeite nemen om de verhoudingen zelf te berekenen, je kunt je verhoudingen van twee kleuren testen met Aannemelijk, Contrast Ratio, of Kleurveilig.
  • Iconografie - Het rood markeren van een veld helpt niet iemand met een kleurgebrek. Zorg ervoor dat u een soort bericht of pictogram toepast om hen te laten weten dat er ook een probleem is.
  • Focus - Veel mensen navigeren met toetsenborden of schermlezers. Zorg ervoor dat uw gebruikersinterface correct is ontworpen met alle toegankelijkheidstagging zodat ze kunnen profiteren van uw site. Voor mensen met een visuele beperking is het gebruik van witruimte en de mogelijkheid om lettergroottes te vergroten of te verkleinen waar de lay-out niet kapot gaat, van cruciaal belang.

Ben jij een oogexpert? Kleurexpert? Toegankelijkheidsexpert? Voel je vrij om mij advies te geven om dit artikel te verbeteren!

Openbaarmaking: ik gebruik affiliate links in dit artikel.

Wat denk je?

Deze site gebruikt Akismet om spam te verminderen. Ontdek hoe uw reactiegegevens worden verwerkt.