Kleurenpalet Naamgever
Plak kleuren en krijg voor elke kleur een naam, de dichtstbijzijnde CSS-kleur, bijna-duplicaatwaarschuwingen en WCAG-contrast — exporteerbaar als CSS of JSON.
🔒 Deze tool werkt volledig in je browser. Je bestanden worden nooit naar een server geüpload.
Browsertool
Kleurenpalet Naamgever
Hoe het werkt
- Plak je kleuren — hex, rgb() of CSS-kleurnamen, één per regel of gescheiden door komma's.
- Elke kleur krijgt een naam: een exacte CSS-kleurnaam bij een nauwe overeenkomst, anders een gegenereerde beschrijving zoals "Levendig Donkerblauw".
- Bekijk de waarschuwingen voor bijna-identieke kleuren en de contrastwaarden als je een kleur als tekst of achtergrond gebruikt.
- Exporteer de hele palet als CSS custom properties of JSON.
FAQ
Worden mijn gegevens ergens geüpload?
Nee. Color Palette Namer werkt volledig in je browser — er wordt niets naar een server verstuurd.
Waar komen de namen vandaan?
Uit twee bronnen. Als een kleur dicht bij een van de 148 standaard CSS-kleursleutelwoorden ligt (zoals "forestgreen" of "royalblue" — geverifieerd tegen de CSS/SVG-specificatie), wordt die exacte naam gebruikt. Anders wordt een beschrijvende naam gegenereerd op basis van tint, helderheid en verzadiging, zoals "Levendig Donkerblauw" of "Grijzig Lichtgroen" — nooit een verzonnen naam die niet te verifiëren is.
Wat telt als een "bijna-duplicaat" kleur?
Twee kleuren die dicht genoeg bij elkaar liggen in de perceptuele kleurruimte (gemeten in CIE Lab, niet ruwe RGB) om er naast elkaar bijna identiek uit te zien — iets dat vaak wordt opgespoord voordat een palet met twee onherkenbare stalen wordt gepubliceerd.
Wat betekenen de contrastwaarden?
De WCAG 2-contrastverhouding van die kleur tegen zuiver wit en zuiver zwart, van 1:1 (geen contrast) tot 21:1 (zwart op wit). AA vereist 4,5:1 voor normale tekst of 3:1 voor grote tekst; AAA vereist 7:1 — handig om te controleren of een kleur veilig is als tekst of achtergrond.
Kan ik meerdere kleuren tegelijk invoeren?
Ja — één per regel, of gescheiden door komma's. Hexcodes, rgb()/rgba() en CSS-kleurnamen worden allemaal geaccepteerd.
Hoe nauwkeurig is het resultaat?
De 148 exacte CSS-kleurnamen zijn geverifieerd tegen de CSS Color Module / SVG-specificatie. Afstanden tussen kleuren gebruiken een standaard sRGB-naar-Lab-conversie, gecontroleerd tegen gepubliceerde referentiewaarden. De beschrijvende namen volgen een schema van duidelijke tint-/helderheid-/verzadigingsbanden, geen gok.
Kan ik de namen gebruiken voor design tokens of een stijlgids?
Ja — daar is het precies voor gebouwd: een palet van hexcodes omzetten in leesbare namen die je kunt gebruiken in tokennamen, documentatie of een stijlgids in plaats van ruwe hexwaarden.
Hoe we ons vergelijken
| Functie | Online Tool Store | Theme & Color hex-zoeker | Betaalde ontwerpsoftware |
|---|---|---|---|
| Benoemt een hele palet in één keer, niet één kleur tegelijk | ✓ | ✗ | ✓ |
| Signaleert bijna-duplicaatkleuren in dezelfde palet | ✓ | Niet van toepassing — slechts één kleur | ✗ |
| WCAG-contrast tegen wit en zwart direct getoond | ✓ | ✗ | Meestal een apart hulpmiddel |
| Exacte match gebruikt een geverifieerde standaard CSS-kleurnaam | ✓ | ✓ | Merkspecifieke naamgeving |
| Gratis, geen aanmelding | ✓ | ✓ | Vaak op abonnementsbasis |
Naamzoekers voor één kleur zijn gebouwd om één staal tegelijk op te zoeken. Dit is gebouwd om een hele palet te beoordelen — de bijna-duplicaat- en contrastcontroles zijn precies wat problemen opvangt voordat een palet wordt gepubliceerd.