Värinvalitsin ja palettigeneraattori ilmaiseksi
Valitse värejä, muunna HEX/RGB/HSL-välillä ja luo harmonisia paletteja.
RGB
HSL
Lisää muotoja
WCAG kontrasti
Lähin nimetty väri: dodgerblue · Musta teksti on tässä helpommin luettavaa (5,71:1)
Sävyt ja vaalennukset (50–950)
Väripaletti
Komplementaarinen
Triadinen
Analoginen
Monokromaattinen
Yleiset käyttötavat
- Värinvalitsin VerkkosuunnittelulleValitse ja luo värit verkkosivustollesi — hanki HEX, RGB ja HSL arvot sekä harmonisia paletteja.
- Värinvalitsin BrändäykselleRakenna brändin väripaletti — valitse pää-, toissija- ja korostusvärit, jotka toimivat yhdessä.
- Värinvalitsin Sosiaaliselle MedialleLuo silmää miellyttävät väripaletti sosiaalisen median postaukselle, tarinoille ja profiilin suunnitteluille.
- Värinvalitsin TulostussuunnittelulleValitse värit painettuun materiaaliin — mainokset, käyntikortit, esitteet — tarkoilla värin esikatselu.
- Värinvalitsin EsityksilleSuunnittele diaesityksen värikaaviot — valitse luettavat tekstivärit, kaaviopaletti ja yhdenmukaiset korostusvärit.
Miten se toimii
Kaikki tapahtuu suoraan selaimessasi käsin kirjoitetulla muunnosmatematiikalla — ei värikirjastoa, ei palvelinkierrosta. Valitset värin selaimen natiivilla väriä syöttävällä komponentilla tai EyeDropper-rajapinnalla, ja työkalu muuntaa sen välittömästi kuuteen muotoon, samalla laskien WCAG-kontrastisuhteet ja luoden harmoniapaletteja.
- 1Värin syöttö natiivin rajapinnan kauttaValitset värin selaimen sisäänrakennetulla <input type="color">-elementillä, tai — Chromium-pohjaisissa selaimissa — EyeDropper-rajapinnalla, joka antaa sinun näytteistää minkä tahansa pikselin näytöltäsi. Molemmat polut palauttavat heksamerkkijonon, josta tulee ainoa totuuden lähde.
- 2Käsin kirjoitetut muotomuunnoksetTyökalu muuntaa heksa-arvon RGB:ksi, HSL:ksi, HSV:ksi, CMYK:ksi ja OKLCH:ksi omilla matemaattisilla funktioillaan (ei ulkoista kirjastoa). OKLCH-muunnos linearisoi sRGB-kanavat, soveltaa OKLab-kuutiojuurimatriisia, ja johtaa sitten kroman ja sävykulman — vastaten nykyaikaista CSS Color Level 4 -tulostetta.
- 3WCAG-kontrastisuhteen laskentaSuhteellinen luminanssi lasketaan linearisoiduista RGB-kanavista WCAG 2.x -kaavalla. Työkalu laskee sitten kontrastisuhteet puhdasta valkoista ja mustaa vasten ja merkitsee ne AA-large, AA, AAA tai Fail WCAG-kynnysarvojen mukaan (3:1, 4,5:1, 7:1).
- 4Harmoniapalettien luonti ja paikallinen tallennusKomplementaariset, triadiset, analogiset ja monokromaattiset näytteet johdetaan kiertämällä tai askeltamalla HSL-sävy- ja vaaleusarvoja matemaattisesti. Tallennetut paletit kirjoitetaan selaimesi localStorageen — mitään ei poistu laitteeltasi.
Liittyvät työkalut
Satunnainen värigeneraattori
Luo satunnaisia värejä yksi kerrallaan tai viiden värin paletiksi, lukitse mieleisesi, kopioi HEX-, RGB- tai HSL-arvoja ja vie paletti PNG- tai CSS-tiedostona.
Värimuunnin
Muunna värejä HEX-, RGB-, HSL-, HSV- ja CMYK-muotojen välillä välittömästi. Sisältää valoisuusskaalaa ja esimääritetyt värimalleja.
Kuvan väripaletin poimija
Poimi hallitsevat värit mistä tahansa kuvasta k-means-värikvantisoinnilla. Saat heksadesimaaliarvot 2–16 pääväristä valokuvassasi tai logossasi.