Als je met graphic of webdesign bezig bent, kom je ook in aanraking met fotografie. Soms kan het gebeuren dat je dan een bepaalde kleurcode uit een foto moet halen. Hoe gaat dat eigenlijk? Dit artikel geeft je antwoord op de vraag “hoe kleur uit een foto halen?” Ook ontdek je welke software je hiervoor kunt gebruiken.
Wanneer je een website of een grafisch ontwerp maakt, dan heb je bepaalde kleuren nodig. Als je die kleuren baseert op een logo of een bestaande huisstijl, dan is dat redelijk eenvoudig, omdat je dan al met een beperkt aantal kleuren werkt. In dit artikel lees je hoe je kleur uit een logo of uit een huisstijl haalt. Maar hoe gaat dat eigenlijk in zijn werk met foto’s? Dat lees je hieronder.
Zodra je met beelden in kleur werkt, dan merk je dat je beeld eigenlijk uit tientallen, zo niet honderden verschillende kleurtinten bestaat. Dat is even iets anders als een logo, wat bijvoorbeeld maar uit vier dominante kleuren bestaat. Kleur uit een kleurenfoto halen, hoe begin je hieraan?
Kleurenpalet uit foto halen
Een aantal kleuren die uit een beeld komen, noem je een kleurenpalet. Mocht je meteen een kant-en-klaar kleurenpalet willen hebben dat uit je foto komt, dan raad ik je aan om de online tool Image Colorpicker te gebruiken. Het werkt heel simpel: je surft naar de website, load je foto up en de software geeft jou automatisch een aantal kleuren waar je mee kan werken.
Misschien vind je die kleuren al helemaal geweldig, maar het kan ook zijn dat je niet meteen tevreden bent. In dat geval kun je ook gewoon de cursor over je foto bewegen en een aantal kleuren uit je beeld kiezen. Het onlineprogramma Image Colorpicker laat je meteen de bijbehorende codes zien.
Image Color Picker is één van mijn favoriete tools. Op zoek naar nog meer tips? Ontdek hier mijn favoriete tools voor zowel webdesign als fotografie.
Wat is HEX? Wat is RGB?
Als je deze tool gebruikt, dan zie je bij iedere kleurtint twee verschillende termen staan: je hebt HEX- en RGB-kleurcodes. Iedere kleurtint heeft namelijk een unieke code om ervoor te zorgen dat een computerscherm deze correct weergeeft. De basiskleuren voor een computerscherm zijn rood, geel en blauw. Iedere basiskleur heeft 255 tinten en al deze tinten kun je met elkaar combineren, wat maar liefst 16 581 375 mogelijkheden oplevert.
Hoe werkt dit in de praktijk?
Na deze theoretische uitleg, zal ik je een voorbeeld geven van hoe dit werkt. Toen ik namelijk deze website aan het bouwen was, merkte ik dat in mijn straatfoto’s de kleur turquoise (of appelblauwzeegroen voor de Vlamingen) regelmatig terugkwam. Soms in spiegelende oppervlakken, soms in het water. Ik besloot om een foto uit het Middellandse Zeegebied met zee en olijfbomen up te loaden in Image Picker. Het kleurenpalet wat mij gesuggereerd werd, was niet meteen voldoende voor mij.
Dus ben ik met de cursor net zo lang door het water gegaan tot ik twee goede tinten turquoise (of, jawel, appelblauwzeegroen) te pakken kreeg. Eén voor de knoppen over mijn website, en één om te laten zien dat je met de cursor over een knop schuift. De basiskleurwaarde van mijn knoppen is in HEX #609C9D (let op de hashtag) en in RGB rgb(96,156,157) (let op de kleine letters rgb, haakjes en komma’s). Als je over knoppen schuift met je cursor, dan zie je een andere appelblauwzeegroen- of turquoisetint, namelijk 4D7171 en rgb(77,113,113). De eerste is een HEX-code, de tweede een RGB.
Kleur toevoegen aan website
Indien je dit moet doen voor graphic design, dan kun je deze kleur toevoegen aan je standaarddesignprogramma. Houd je het eenvoudiger, dan kun je deze ook toevoegen in Canva. Wanneer je een website gaat bouwen, dan kun je deze in WordPress in de theme customizer of via je je thema in het dashboard aanpassen.
Zelf werk ik als fotograaf en webdesigner meestal in Divi. Het geweldige hieraan is dat het zowel een thema als een bouwer is, waar kleur erg belangrijk is. Je kan je kleurenpalet zelfs meteen invoeren, nog voor je aan het effectief bouwen van de site begint. Als je Divi geïnstalleerd hebt, kun je bij theme options je kleurenpalet invoeren. Eens het daar staat, dan duikt het steeds op als je iets nieuws gaat construeren.
Meer tools om kleuren uit een foto te halen
Image Colorpicker vind ik een hele fijne tool omdat deze zo snel online werkt. En mocht je bang zijn voor je privacy: deze website bewaart je foto niet! Als fotograaf zou ik ook Photoshop kunnen gebruiken om de kleur uit de foto te halen. Nu is Photoshop echt geweldige software, maar niet altijd de snelste. Zeker niet als ik tegelijkertijd Divi in Chrome heb openstaan. Is Colorpicker niet je ding en heb je geen geduld voor Photoshop, dank kun je ook nog Color Palette Generator van Canva gebruiken. Kan ook heel handig zijn. Een laatste optie is de Chrome-extensie ColorPick Eyedropper, maar die werkt eigenlijk enkel online. Dus als je foto al op het web staat, dan kun je dat prima gebruiken.
Artikel geüpdated op 26 januari 2025.