Willekeurige kleur

Willekeurige kleuren en codes voor ontwerp en code.

Klik op een code om hem te kopiëren. Klik op het slotje om een kleur vast te houden als je opnieuw genereert.

Zo genereer je willekeurige kleuren

  1. Stel in hoeveel kleuren je wilt en kies een codeformaat.
  2. Kies een willekeurig, pastel- of donker palet.
  3. Klik op een swatch om de code te kopiëren, of zet hem vast voordat je meer genereert.

HEX, RGB en HSL vergeleken

Alle drie de formaten beschrijven exact dezelfde kleur. Welke je nodig hebt hangt af van waar je hem plakt.

FormaatZiet eruit alsHet beste voor
HEX#3B82F6CSS, ontwerptools, snel delen
RGBrgb(59, 130, 246)CSS, code die kleuren mixt of laat vervagen
HSLhsl(217, 91%, 60%)Een kleur met de hand aanpassen: tint, dan felheid, dan lichtheid

HSL is meestal het makkelijkst om zelf bij te schaven, want het lichtheidsgetal lichter of donkerder schuiven houdt dezelfde tint, iets wat HEX en RGB moeilijker maken om op het oog te doen.

Willekeurig, pastel en donker, in cijfers

Elke modus kiest uit een ander deel van het kleurenwiel in plaats van alleen de tint te veranderen.

ModusVerzadigingsbereikLichtheidsbereik
Willekeurig40 tot 100%25 tot 75%
Pastel35 tot 60%75 tot 88%
Donker35 tot 70%12 tot 28%

Tint wordt in elke modus altijd gekozen uit het volledige bereik van 0 tot 359, dus pastel en donker dekken nog steeds elke kleurfamilie, alleen lichter of donkerder.

Waar mensen willekeurige kleuren voor gebruiken

  • Snelle ontwerpinspiratie als je vastzit bij het kiezen van een merk- of themakleur.
  • Placeholderkleuren voor wireframes, grafieken en UI-mockups voordat er een echt palet is gekozen.
  • Avatarachtergronden, labels of categoriekleuren genereren in een app.
  • Kunst- en knutselprojecten, zoals een willekeurige kleuropdracht voor een dagelijkse schets.

Veelgestelde vragen over Willekeurige kleur

Wat is het verschil tussen de paletten?

Willekeurig bestrijkt het hele kleurenwiel. Pastel houdt lichtheid en verzadiging zacht voor rustige achtergronden. Donker houdt kleuren laag in lichtheid voor donkere thema's en contrastrijke tekst.

Hoe hou ik een kleur die ik mooi vind?

Klik op het slotje op een swatch. Vastgezette swatches houden hun kleur de volgende keer dat je genereert, zodat je alleen de rest opnieuw kunt rollen.

Wat is het verschil tussen HEX, RGB en HSL?

HEX en RGB beschrijven een kleur met de hoeveelheid rood, groen en blauw. HSL beschrijft hem met tint, verzadiging en lichtheid, wat vaak makkelijker met de hand aan te passen is.

Hoe kopieer ik een kleurcode?

Klik op de codetekst onder een swatch en hij wordt meteen naar je klembord gekopieerd.

Welke bereiken gebruiken de paletten precies?

Willekeurig kiest elke tint met een verzadiging van 40 tot 100 procent en een lichtheid van 25 tot 75 procent. Pastel versmalt de lichtheid naar 75 tot 88 procent. Donker versmalt de lichtheid naar 12 tot 28 procent, met een verzadiging van 35 tot 70 procent zodat kleuren rijk blijven in plaats van modderig.

Passen twee willekeurige kleuren altijd goed bij elkaar?

Soms. Deze tool kiest kleuren onafhankelijk van elkaar voor variatie en inspiratie, hij bouwt geen bijpassend palet. Voor kleuren die gegarandeerd samengaan, genereer er meerdere, zet de kleuren die je mooi vindt vast, en herrol de rest tot de set klopt.

Kan ik maar één kleur genereren in plaats van een set?

Ja, zet het aantal op 1 en klik op Genereren voor één willekeurige kleur in je gekozen formaat.

Waar kan ik een HEX- of RGB-code gebruiken zodra ik er een heb?

Plak een HEX-code direct in CSS, Figma, Photoshop of bijna elke ontwerptool. RGB- en HSL-waarden werken op dezelfde manier in CSS-functies zoals rgb() en hsl().

Gerelateerde tools