# Kleurcombinaties voor logo’s die werken, met hexcodes

[Canonical HTML page](https://gradiently.design/nl/guide/color-combinations-for-logos)

Een logo moet een favicon, een grijze fotokopie en een donkere header overleven. Deze duo’s en trio’s zijn daarop gekozen, met codes en contrast die je zelf kunt narekenen.

## The short version

- De meeste sterke logo’s gebruiken één of twee kleuren, omdat elke extra kleur het lastiger maakt het merk klein, in drukwerk en op wisselende achtergronden te reproduceren.
- Een goed logo in twee kleuren combineert een donkere kleur met een lichte of felle, zodat de vormen onderscheidbaar blijven ook als de kleuren moeilijk uit elkaar te houden zijn.
- Twee kleuren van gelijke helderheid, zoals een middenrood en een middenblauw, lijken te trillen waar ze elkaar raken en verliezen hun rand in grijs drukwerk.
- Elk logo moet ook in één kleur werken, in zwart en in wit, voordat er kleur aan wordt toegevoegd.
- De kleuren van een logo hoeven niet het hele merkpalet te zijn: het merkteken kan eenvoudig blijven terwijl de achtergronden eromheen de rijkere kleur dragen.

De **kleurcombinaties voor logo’s** die het best werken, koppelen één donkere kleur aan één lichte of felle kleur, zoals marineblauw en goud, bosgroen en crème, of antraciet en limoen. Het helderheidsverschil houdt de vormen leesbaar op favicongrootte en in grijswaarden, terwijl het tintverschil het merkteken zijn karakter geeft. Hieronder staan tien geteste duo’s en drie trio’s met hexcodes en contrastverhoudingen, en daarna een snelle manier om zelf een combinatie te controleren.

## Waarom logo’s zo weinig kleuren gebruiken

Een logo is het vaakst gereproduceerde bezit van een bedrijf. Het staat als browsericoon van 16 pixels, geborduurd op een shirt, gestempeld op een koffiebeker en in één kleur gedrukt op een kassabon. Elke kleur die je toevoegt is weer iets dat op een van die plekken mis kan gaan. Daarom zijn zoveel bekende merktekens eenkleurig en de meeste andere tweekleurig.

Begin in zwart. Als de vorm werkt in zwart op wit en wit op zwart, kan kleur alleen maar helpen. Zo niet, dan redt geen enkele combinatie hem. [Basis van logo-ontwerp](https://gradiently.design/nl/guide/logo-design-basics) behandelt de vormkant. Dit artikel gaat ervan uit dat de vorm vaststaat.

## Tien logocombinaties in twee kleuren

- Marine en goud: `linear-gradient(90deg, #14213d 0%, #14213d 55%, #fca311 55%, #fca311 100%)`
- Bosgroen en crème: `linear-gradient(90deg, #1b4332 0%, #1b4332 55%, #f1e9da 55%, #f1e9da 100%)`
- Antraciet en limoen: `linear-gradient(90deg, #2d2d2d 0%, #2d2d2d 55%, #c6f432 55%, #c6f432 100%)`
- Pruim en blos: `linear-gradient(90deg, #4a1942 0%, #4a1942 55%, #f7c8d0 55%, #f7c8d0 100%)`
- Bordeaux en zand: `linear-gradient(90deg, #6b0f1a 0%, #6b0f1a 55%, #e9d8a6 55%, #e9d8a6 100%)`
- Inkt en oranje: `linear-gradient(90deg, #1c1917 0%, #1c1917 55%, #f97316 55%, #f97316 100%)`
- Paars en munt: `linear-gradient(90deg, #5b21b6 0%, #5b21b6 55%, #a7f3d0 55%, #a7f3d0 100%)`
- Kobalt en wit: `linear-gradient(90deg, #1d4ed8 0%, #1d4ed8 55%, #ffffff 55%, #ffffff 100%)`
- Zwart en signaalrood: `linear-gradient(90deg, #111111 0%, #111111 55%, #e63946 55%, #e63946 100%)`
- Teal en koraal: `linear-gradient(90deg, #0f766e 0%, #0f766e 55%, #ff7f6e 55%, #ff7f6e 100%)`

Tien duo’s als harde splitsing, zoals ze elkaar in een merkteken raken. Klik op een kleurvlak om de code te kopiëren.

| Duo | Codes | Contrast | Voelt als |
| --- | --- | --- | --- |
| Marine en goud | `#14213d` `#fca311` | 7,9:1 | Gevestigd, zelfverzekerd, een tikje klassiek |
| Bosgroen en crème | `#1b4332` `#f1e9da` | 9,2:1 | Natuurlijk, ambachtelijk, rustig |
| Antraciet en limoen | `#2d2d2d` `#c6f432` | 10,7:1 | Energiek, sportief, technisch |
| Pruim en blos | `#4a1942` `#f7c8d0` | 9,4:1 | Warm, beauty, boetiek |
| Bordeaux en zand | `#6b0f1a` `#e9d8a6` | 8,7:1 | Erfgoed, wijn, horeca |
| Inkt en oranje | `#1c1917` `#f97316` | 6,2:1 | Praktisch, vriendelijk, ambacht en gereedschap |
| Paars en munt | `#5b21b6` `#a7f3d0` | 7,0:1 | Modern, speels, software |
| Kobalt en wit | `#1d4ed8` `#ffffff` | 6,7:1 | Helder, betrouwbaar, digitaal |
| Zwart en signaalrood | `#111111` `#e63946` | 4,5:1 | Gedurfd, urgent, redactioneel |
| Teal en koraal | `#0f766e` `#ff7f6e` | 2,2:1 | Levendig, maar alleen als aangrenzende vormen, nooit tekst op tekst |

WCAG-contrastverhoudingen per duo. Boven 4,5:1 kan de ene kleur als letters op de andere staan. Lagere duo’s horen naast elkaar te staan als vormen.

Let op: teal en koraal is de uitzondering. Beide kleuren liggen op een vergelijkbare helderheid, dus koralen letters op een tealkleurige badge zijn moeilijk te lezen en worden in zwart-wit drukwerk één grijze vlek. Het duo werkt wel als de kleuren losse vormen zijn, zoals een tealkleurig symbool naast een koraalkleurig woordmerk, elk op een witte of donkere ondergrond. De cijfers komen uit de WCAG-formule die wordt uitgelegd in [kleurcontrast en toegankelijkheid](https://gradiently.design/nl/guide/color-contrast-accessibility).

## Logocombinaties in drie kleuren

Drie kleuren passen bij merktekens die uit losse delen bestaan: een symbool van tegels, een woordmerk met een gekleurde stip, een set vormen voor een kindermerk. Verankert het trio met één donkere kleur en kies twee kleuren die duidelijk in tint verschillen. Als je ze rond het kleurenwiel spreidt, zoals bij [triadische kleuren](https://gradiently.design/nl/guide/triadic-colors), concurreren ze niet met elkaar.

- Diepzee: #003049
- Klaproos: #d62828
- Mosterd: #fcbf49

Primair, maar volwassen. Een donkerblauw verankert een rood en een geel die anders zouden schreeuwen. Goed voor scholen, sport en speelgoed gericht op ouders.

- Leisteenteal: #264653
- Saffraan: #e9c46a
- Gebrand koraal: #e76f51

Kustwarmte. Leisteenteal draagt het woordmerk, saffraan en gebrand koraal vullen de vormen van het symbool.

- Nacht: #10002b
- Magenta: #f72585
- Cyaan: #4cc9f0

Digitaal en luid. Magenta en cyaan gloeien tegen een bijna zwart anker, voor merktekens in muziek, gaming en uitgaansleven.

## Logokleurcombinaties om te vermijden

### Vermijd

- Middenrood en middenblauw die elkaar raken: ze lijken te trillen
- Puur rood en puur groen samen: lastig voor veel kleurenblinde kijkers
- Geel of bleke pastels op wit: het merkteken verdwijnt
- Vier of meer kleuren met gelijk gewicht
- Een verloop als enige versie van het logo

### Doe in plaats daarvan

- Maak één van het duo veel donkerder
- Scheid ze op helderheid, niet alleen op tint
- Zet bleke kleuren op een donkere ondergrond, of geef ze een rand
- Eén hoofdkleur, één of twee ondersteunende
- Eerst een vlakke versie, het verloop als variant

Logo’s met een verloop zijn een bijzonder geval. Ze kunnen groot prachtig ogen, maar vertonen banding in druk en vervagen op kleine formaten. Houd een vlakke versie in één of twee kleuren en behandel het verloop als variant. [Logo’s met een verloop](https://gradiently.design/nl/guide/gradient-logo) legt uit hoe je beide bouwt.

## Hoe test je een kleurcombinatie voor een logo

1. **Druk het af in grijswaarden** Zet het logo om naar grijs. Als de twee kleuren hetzelfde grijs worden, is het helderheidsverschil van het duo te klein.
2. **Verklein het tot 16 pixels** Bekijk het als tabbladicoon in de browser. Dunne delen in een bleke kleur verdwijnen als eerste.
3. **Keer het om** Zet het logo op je donkerste merkkleur en op wit. Noteer welke kleur je in elk geval moet verwisselen en schrijf het op.
4. **Controleer op kleurenblindheid** Haal het door een kleurenblindheidssimulator. Rood-groene duo’s smelten vaak samen voor mensen met de meest voorkomende vormen van kleurenblindheid.
5. **Zet het op een echte achtergrond** Een logo staat in het wild zelden op egaal wit. Test het op een foto, een verloop en een drukke feed.

Een vierkant ontwerp met het woord Harbour over een verloop, waarbij delen van de letters erin vervagen

Een woordmerk dat zo over een levendige achtergrond loopt, kan stukken van zijn letters kwijtraken.

Hetzelfde vierkante ontwerp waarbij de achtergrond achter het woord Harbour rustiger is, zodat elke letter leesbaar is

Hetzelfde woordmerk met de achtergrond die erachter kalmeert en dieper wordt.

Bij die laatste test hebben veel logo’s het moeilijk. [Een logo op een verloopachtergrond plaatsen](https://gradiently.design/nl/guide/logo-on-gradient-background) behandelt de technieken. In Gradiently weet een Mark waar de woorden en het logo staan: zijn rustigste gebied verschuift erachter en Auto-inkt kiest per regel licht of donker uit het eigen palet van de Mark, zodat een eenvoudig logo in twee kleuren op een rijke achtergrond kan staan zonder kader eromheen.

## Houd het logo eenvoudig en laat het merk rijk zijn

Het logo hoeft niet alle kleuren van je merk te dragen. Veel merken houden het merkteken in één of twee kleuren en leggen de diepte in hun achtergronden, fotografie en lettertypen. Kies je daarna het bredere palet, dan bieden [merkkleurideeën](https://gradiently.design/nl/guide/brand-color-ideas) er 30 om mee te beginnen, en [bekende verloop-logo’s](https://gradiently.design/nl/guide/famous-gradient-logos) laten zien hoe gevestigde merken een eenvoudig merkteken in balans brengen met expressieve kleur.

## FAQ

### Wat is de beste kleurcombinatie voor een logo?

Er is geen enkel beste duo, maar een donkere kleur met een lichte of felle, zoals marineblauw en goud of bosgroen en crème, werkt bijna overal omdat de vormen onderscheidbaar blijven.

### Hoeveel kleuren moet een logo hebben?

Voor de meeste logo’s één of twee. Drie kan werken bij merktekens uit losse delen, maar elke extra kleur maakt drukken en kleine formaten lastiger.

### Welke kleuren gebruik je niet samen in een logo?

Vermijd kleuren met dezelfde helderheid die elkaar raken, zoals middenrood en middenblauw, en vertrouw niet op rood tegen groen, dat veel kleurenblinde mensen niet kunnen scheiden.

### Moet een logo in zwart-wit werken?

Ja. Een logo moet in één kleur, in zwart en in wit werken voordat er kleur wordt toegevoegd, omdat het in enkele kleuren wordt gedrukt en gestempeld.

### Mag een logo een verloop zijn?

Dat kan, maar houd een vlakke versie voor kleine formaten, borduurwerk en druk in één kleur, en gebruik het verloop waar het ruimte heeft.