Slaan oor na hoofinhoud
LibraTool logoLibraTool

Gratis Kleurkeuser en paletgenerator

Kies kleure, skakel om tussen HEX/RGB/HSL, en genereer harmonieuse palette.

Werk vanlyn sodra gelaai
HEX
HSV
h217°
s76%
v96%
toon slegs

RGB

r
g
b

HSL

H
S
L

Meer formate

HEX8#3b82f6ff
RGBrgb(59 130 246)
HWBhwb(217 23% 4%)
CMYKcmyk(76%, 47%, 0%, 4%)
OKLCHoklch(62.3% 0.188 259.8)
SwiftUIColor(red: 0.231, green: 0.510, blue: 0.965, alpha: 1)
Android0xFF3B82F6
FlutterColor(0xFF3B82F6)

WCAG-kontras

Naaste benoemde kleur: dodgerblue · Swart teks is hier makliker om te lees (5,71:1)

Teks op wit3,68:1AA groot
Teks op swart5,71:1AA
Teks op #ffffff3,68:1AA groot

Skakerings & tinte (50–950)

Kleurpalet

Komplementêr

#3b82f6
#f6af3c

Triadies

#3b82f6
#f63c83
#83f63c

Analoog

#3ce0f6
#3b82f6
#523cf6

Monokromaties

#073c92
#0a5adb
#3b82f6
#85b2f9
#cee0fd

Algemene gebruike

  • Kleurkeuse vir webontwerpKies en genereer kleure vir u webwerf — kry HEX-, RGB- en HSL-waardes plus harmoniese palette.
  • Kleurkeuse vir brandwerkBou u merk se kleurpalet — kies primêre, sekondêre en aksent-kleure wat saamwerk.
  • Kleurkeuse vir sosiale mediaSkep oog-vangende kleurpalette vir sosiale media-plasings, stoorhoeke en profielontwerpe.
  • Kleurkeuse vir drukontwerpKies kleure vir gedrukte materiale — vlugblaaie, besoekkaartjies, brosjures — met akkurate kleurvoorbeelde.
  • Kleurkeuse vir aanbiedingsOntwerp glyf-kleurskema's — kies leesbare teks-kleure, grafiese palette en konsekwente aksent-skakerings.

Hoe dit werk

Alles loop direk in jou blaaier met handgeskrewe omskakelingswiskunde — geen kleurbiblioteek, geen bediener-heen-en-weer nie. Jy kies 'n kleur via die blaaier se inheemse kleurtoevoer of die EyeDropper-API, en die nutsprogram skakel dit oombliklik om na ses formate terwyl dit ook WCAG-kontrasverhoudings bereken en harmonie-palette genereer.

  1. 1
    Kleurtoevoer via inheemse API
    Jy kies 'n kleur deur die blaaier se ingeboude <input type="color">-widget, of — in Chromium-gebaseerde blaaiers — laat die EyeDropper-API jou toe om enige pixel op jou skerm te monster. Albei paaie gee 'n heks-string terug wat die enkele bron van waarheid word.
  2. 2
    Handgeskrewe formaatomskakelings
    Die nutsprogram skakel die heks-waarde om na RGB, HSL, HSV, CMYK, en OKLCH met sy eie wiskundefunksies (geen eksterne biblioteek nie). Die OKLCH-omskakeling lineariseer die sRGB-kanale, pas die OKLab-kubuswortel-matriks toe, en lei dan chroma en kleurtoon-hoek af — wat ooreenstem met moderne CSS Color Level 4-uitset.
  3. 3
    WCAG-kontrasverhouding-berekening
    Relatiewe luminansie word bereken uit die gelineariseerde RGB-kanale met die WCAG 2.x-formule. Die nutsprogram bereken dan kontrasverhoudings teen suiwer wit en suiwer swart en etiketteer hulle AA-groot, AA, AAA, of Druip volgens die WCAG-drempels (3:1, 4.5:1, 7:1).
  4. 4
    Harmonie-paletgenerering en plaaslike stoor
    Komplementêre, triadiese, analoë, en monochromatiese kleurstale word afgelei deur die HSL-kleurtoon- en ligtheidwaardes wiskundig te draai of te stap. Gestoorde palette word na localStorage in jou blaaier geskryf — niks verlaat jou toestel nie.

Verwante gereedskap

Gereelde vrae