Ga naar inhoud
TextArray1.87.0
100% lokaal

Generator voor donkere kleurpaletten

Converteer een lichte kleurenpalet naar een donker tegenhanger met geverifieerd contrast.

Invoer
30
Uitvoer
Gerelateerde tools
KleurenpaletgeneratorWillekeurige generatoren
ContrastcontroleOntwikkelaarstools
CSS-kleurvariabele-extractorOntwikkelaarstools
i18n sleutel diffOntwikkelaarstools
TOML naar JSON-converterOntwikkelaarstools
SQL naar JSONOntwikkelaarstools
Generator voor donkere kleurpaletten
Voer de kleuren uit een licht thema in — één per regel — en deze tool genereert een donker tegenhangende kleur voor elke kleur, klaar om in je stylesheet in te voegen. Het is ontworpen voor het dagelijks handafgeven van het verzenden van een donker thema nadat het lichte thema al bestaat: geef het je achtergrond-, oppervlakte- en accentkleuren en het retourneert dezelfde set, geïnverteerd voor een donkere gebruikersinterface.
Noem elke regel zoals een CSS custom property ("background: #ffffff", "--accent: #3366cc") of plak gewoon een hex-waarde. Donkere thema achtergrond stelt de paginaachtergrond in waartegen het palet wordt gebouwd, en het contrast van elke kleur wordt ertegen gecontroleerd. Doel contrast kiest WCAG AA (4.5:1) of AAA (7:1) — accenten (de meer verzadigde items, bedoeld voor tekst, links en pictogrammen) worden naar die verhouding geduwd, terwijl gedimderde oppervlakken eerlijk worden gerapporteerd maar nooit worden geforceerd, omdat een kaartachtergrond niet als tekst wordt gelezen. Verzadiging verminderen verzacht kleuren die anders volledige verzadiging in het donker zouden stralen, Accent kleurverzadiging behouden houdt een merkkleur hue en intensiteit onveranderd, en Oppervlakken aan hoogteverschillen toewijzen trappen neutrale tinten in incrementen omhoog vanaf de nieuwe donkere achtergrond, op dezelfde manier als een kaart boven een paginaachtergrond.
Een regel die de tool niet als kleur kan lezen — een dwaalgast opmerking, een lege kop — wordt overgeslagen in plaats van de rest te verbreken, en het aantal verschijnt in de tally naast hoeveel kleuren zijn gegenereerd en hoeveel accenten het doelcontrast hebben bereikt. Zeer lange lijsten en Windows- of Unix-regeleindes worden beide zonder extra setup verwerkt.
Alles wordt lokaal in je browser uitgevoerd: kleuren worden nooit geüpload of ergens anders heen gestuurd. Kopieer het resultaat, download het als .txt-bestand of stuur de uitvoer direct terug naar de invoer om het palet verder te verfijnen.
FAQ
Welk invoerformaat verwacht het?
Één kleur per regel als hex-waarde. Noem het als een CSS-variabele ("primary: #3366cc") voor een leesbare variabelenaam, of plak een blote hex-code en het tool noemt deze automatisch.
Hoe bepaalt het welke kleuren accenten zijn?
Een kleur met merkbare verzadiging wordt behandeld als een accent — bedoeld voor tekst, links of pictogrammen — en wordt naar je gekozen contrastverhouding geduwd. Een bijna grijze kleur wordt als oppervlak beschouwd en volgt in plaats daarvan de hoogteverschilkoppeling.
Waarom bereikt niet elke kleur de doelcontrastverhouding?
Alleen accenten worden naar het doel geduwd, omdat die verhouding een tekstcontrastregelen is. Oppervlakte- en achtergrondvullingen zijn geen tekst, dus hun contrast wordt in de tally gerapporteerd, maar niet geforceerd.
Wat doet "Oppervlakken aan hoogteverschillen toewijzen"?
Het trapsgewijze je neutrale, laag verzadigde kleuren in kleine, gelijke stappen omhoog vanaf de nieuwe donkere achtergrond, in plaats van hun oorspronkelijke helderheid te weerspiegelen — hetzelfde gelaagde uiterlijk als kaarten boven een paginaachtergrond.
Wordt mijn kleurenlijst ergens geüpload?
Nee. Het palet wordt volledig in je browser gegenereerd en verlaat nooit je apparaat.