Kleurenpalet-generator
Werkt op je apparaat. Er wordt niets verstuurd.Alles gebeurt in je browser - er wordt niets geüpload.
Kleuren5
Tip: druk op spatie voor een nieuw palet.Harmonie
Exporteren
:root {
--color-1: #264653;
--color-2: #2a9d8f;
--color-3: #e9c46a;
--color-4: #f4a261;
--color-5: #e76f51;
}Maak kleurenpaletten met harmonieën uit de kleurencirkel of willekeurig, zet je favoriete kleuren vast en kopieer ze als CSS-variabelen, Tailwind-kleuren of JSON.
Druk op Genereren (of spatie) voor een nieuw palet. Zet de kleuren vast die je wilt houden; de rest wordt eromheen opnieuw opgebouwd volgens een harmonie uit de kleurencirkel: analoge buren, een monochrome reeks, complementaire of gesplitst complementaire tegenpolen, triades en tetrades - of puur willekeurig met gelijk verdeelde tinten. Klik op de hexcode om te kopiëren of op de kleur om er zelf een te kiezen. Exporteer als CSS custom properties, Tailwind-kleurschaal of JSON, bewaar een PNG of kopieer een link naar hetzelfde palet.
Veelgestelde vragen
Wat betekenen de harmonieën?
Het zijn posities op de kleurencirkel. Analoge kleuren liggen naast elkaar (rustig), complementaire tegenover elkaar (veel contrast), gesplitst complementair neemt de twee buren van de tegenkleur, een triade drie kleuren op 120° en een tetrade vier op 90°. Monochroom houdt de tint en varieert de lichtheid.
Hoe maak ik een palet rond mijn merkkleur?
Klik op de eerste kleur, kies je eigen kleur, zet hem vast en druk op Genereren. De vrije vakken worden gevuld volgens de gekozen harmonie, uitgaand van jouw kleur.
Is de tekst op elke kleur leesbaar?
De hexcode wisselt tussen zwart en wit, wat het meeste contrast geeft. Controleer voor lopende tekst het exacte paar in de WCAG-contrastchecker van onze kleurtools.
Wordt er iets opgeslagen?
Je huidige palet wordt op dit apparaat onthouden. Een gedeelde link bevat de kleuren na de # in het adres; dat deel wordt niet naar onze server gestuurd.