Kleurenmixer

Wat is een kleurenmixer?

De kleurenmixer is een hulpmiddel om kleuren online te mengen en direct het eindresultaat als HEX en RGB te zien. U kunt twee tot vijf kleuren combineren, per kleur het aandeel aanpassen en meteen beoordelen hoe de uiteindelijke tint uitpakt in interfaces, CSS-verlopen, designsystemen, presentaties of andere digitale visuals.

De berekening gebruikt het RGB-model en is daardoor vooral geschikt voor schermen en digitale producten. Naast de eindkleur ziet u ook een verloopvoorbeeld, tussenkleuren en voorgestelde harmonieën, zodat u sneller een bruikbaar en samenhangend palet opbouwt.

Wanneer is dit handig?

• UI- en productdesign – Om varianten van knoppen, achtergronden, labels en statussen te vergelijken vóór implementatie.
• Digitale branding – Om ondersteunende en contrasterende tinten af te leiden van een hoofdkleur van het merk.
• CSS-verlopen – Om vooraf te controleren of meerdere kleuren samen een goed verloop vormen.
• Design systems – Om tussenstappen tussen basiskleuren te maken en kleurenschalen beter vast te leggen.
• Visuele content – Om paletten voor banners, presentaties, thumbnails en social creatives sneller te verfijnen.
• Kleurentheorie in de praktijk – Om complementaire, analoge en triadische relaties rond één gemengde kleur beter te begrijpen.

Belangrijkste functies

• 2 tot 5 kleuren mengen – Geschikt voor eenvoudige duo’s én complexere mengingen met meerdere tinten.
• Verhouding instellen – Elke kleur krijgt een eigen gewicht in het eindresultaat.
• Directe HEX- en RGB-uitvoer – Neem de eindkleur meteen over in ontwerp of code.
• Verloopvoorbeeld – Laat zien of de overgang tussen kleuren visueel goed werkt.
• Tussenkleuren – Genereert extra stappen voor paletten, UI-states en kleurschalen.
• Automatische harmonieën – Breidt het resultaat uit met complementaire, analoge, triadische en gesplitste varianten.
• Lokale geschiedenis – Bewaart eerdere mengingen in de browser zodat u ze later kunt vergelijken.

Zo gebruikt u de kleurenmixer

1. Bepaal hoeveel kleuren u mengt – Gebruik de knop ‘Kleur toevoegen’ om van 2 naar maximaal 5 kleuren te gaan en verwijder daarna weer kleuren om verschillende combinaties te vergelijken.
2. Stel de verhoudingen in – Bepaal met de schuifregelaars hoeveel invloed elke kleur krijgt.
3. Controleer het resultaat – Bekijk de eindkleur in HEX en RGB terwijl die live wordt bijgewerkt.
4. Bekijk verloop en tussenstappen – Controleer of de overgang past bij uw interface of visuele compositie.
5. Gebruik de harmonieën – Vind ondersteunende, contrasterende of accentkleuren rond het eindresultaat.

Hoe RGB-menging wordt berekend

Additieve menging voor schermen

De tool gebruikt het RGB-model, een lichtgebaseerd model dat wordt gebruikt door monitoren, telefoons en digitale interfaces. Rood, groen en blauw worden daarin opgeteld om nieuwe kleuren te maken.

• Rood + groen = geel
• Groen + blauw = cyaan
• Blauw + rood = magenta
• Rood + groen + blauw = wit

Daarom komt het RGB-resultaat niet overeen met verf- of pigmentmengingen. Voor digitale projecten is het juist wel de meest bruikbare referentie.

Gewogen gemiddelde van de kanalen

Elke schuifregelaar bepaalt het gewicht van een kleur binnen de RGB-kanalen. Als u rood (#FF0000) en blauw (#0000FF) in een verhouding van 50:50 mengt:

• R = (255 × 0,5) + (0 × 0,5) = 127
• G = (0 × 0,5) + (0 × 0,5) = 0
• B = (0 × 0,5) + (255 × 0,5) = 127
• Resultaat: RGB(127, 0, 127) = #7F007F

Harmonieën rond de eindkleur

Nadat de mengkleur is berekend, breidt de tool die uit met relevante relaties uit de kleurencirkel zodat u sneller een volledig palet kunt opbouwen.

Complementair

Deze optie levert het sterkste contrast en is geschikt voor CTA’s, waarschuwingen en duidelijke visuele accenten.

Analoog

Deze combineert dicht bij elkaar liggende kleuren en werkt daarom rustiger en vloeiender.

Triadisch

Hierdoor ontstaat meer variatie, terwijl de visuele balans redelijk behouden blijft.

Gesplitst complementair

Deze aanpak houdt het contrast sterk, maar voelt meestal iets flexibeler dan een puur complementair paar.

Veelgestelde vragen