Siirry pääsisältöön
LibraTool logoLibraTool

Värimuunnin ilmaiseksi

Muunna värejä HEX-, RGB-, HSL-, HSV- ja CMYK-muotojen välillä välittömästi. Sisältää valoisuusskaalaa ja esimääritetyt värimalleja.

Toimii offline-tilassa kerran ladattuna

Muunna väri HEX:n, RGB:n, HSL:n, HSV:n ja CMYK:n välillä — live-esikatselu ja yhdellä napauttamalla kopiointi. Kaikki toimii selaimessasi.

Hyväksyy: HEX (#fff tai #ffffff), RGB (255, 255, 255) tai HSL (360, 100%, 50%)

100%
Esiasetetut:
HEX#14B8A6
rgb() · perinteinenrgb(20, 184, 166)
rgb() · modernirgb(20 184 166)
hsl() · perinteinenhsl(173, 80%, 40%)
hsl() · modernihsl(173 80% 40%)
oklch()oklch(70.4% 0.123 182.5)
lab()lab(67.1% -42.9 -2.3)
lch()lch(67.1% 43.0 183.1)
hsv()hsv(173, 89%, 72%)
cmyk()cmyk(89%, 0%, 10%, 28%)
RGB-arvot20, 184, 166

WCAG-kontrasti

Valkoisella taustalla

2,49:1

Hylätty

Mustalla taustalla

8,44:1

AAA
🖨️ Painatusta varten: Nämä CMYK-arvot (89%, 0%, 10%, 28%) ovat vakio sRGB→CMYK-approksimaatio vertailua varten. Tarkkaa painoväriä varten käytä tulostimesi ICC-profiilia tai painotuotetta — näytön CMYK ei voi vastata jokaista mustetta/paperia.

Kirkkausasteikko

Napsauta väripalaa vaihtaaksesi kyseiseen sävyyn

Yleiset käyttötavat

  • Muunna Värit Verkkosivuston SuunnitteluunHae HEX-, RGB- ja HSL-arvot mihin tahansa väriin — valmiina liitettäväksi CSS:ään tai Tailwindiin.
  • Muunna Värit Painolle (CMYK)Muunna näytön värit (HEX/RGB) CMYK-arvoiksi käytettäväksi painosuunnittelussa ja ammattimaisessa tulostuksessa.
  • Rakenna Väripaletteja SuunnittelujärjestelmilleMuunna brändin värit kaikissa muodoissa ja luo johdonmukaiset kirkkauden asteikot täydelliselle suunnittelujärjestelmälle.
  • Tarkista Värin Kontrasti Saavutettavuutta VartenMuunna värit saadaksesi RGB-arvot kontrastitasosuhteen työkaluissa käytettäväksi - WCAG-yhteensopivuus saavutettavan suunnittelun osalta.
  • Muunna Värit FigmaksiHae tarkat HEX- ja RGB-arvot Figman värinvalitsimiin ja suunnittelun tunnus-järjestelmiin liitettäväksi.

Miten se toimii

Kaikki muunnoslogiikka on käsin kirjoitettua JavaScriptia, joka toimii kokonaan selaimessasi — ei kirjastoa, ei palvelinkutsua. Työkalu jäsentää syötteesi, ohjaa sen puhtaiden matemaattisten funktioiden ketjun läpi, ja tuottaa samanaikaisesti yksitoista tulostemuotoa, mukaan lukien nykyaikaiset CSS Color 4 -avaruudet oklch() ja lab().

  1. 1
    Joustava syötteen jäsennys
    Mukautettu jäsennin hyväksyy heksan (3, 4, 6 tai 8 numeroa), rgb()/rgba()-muodon, hsl()/hsla()-muodon sekä perinteisellä pilkkusyntaksilla että nykyaikaisella välilyöntisyntaksilla, ja paljaat numeeriset kolmikot. Alfa-arvot desimaaleina tai prosentteina normalisoidaan välille 0–1 ennen minkään muunnoksen alkua.
  2. 2
    RGB muunnoksen keskuksena
    Jokainen hyväksytty muoto ratkaistaan ensin kanoniseksi RGB-kolmikoksi. Tästä yhdestä esitystavasta työkalu haarautuu: HSL ja HSV käyttävät standardeja min/max/kroma-kaavoja; CMYK johdetaan löytämällä avainkanava; ja sRGB-linearisointi (paloittainen gammakäyrä, joka on määritelty IEC 61966-2-1:ssä) sovelletaan ennen havaintoavaruuslaskelmia.
  3. 3
    Havaintoavaruuksien värit lasketaan alusta asti
    oklch() lasketaan Björn Ottossonin viitteellisillä 3×3-matriiseilla (LMS-kuutiojuuriavaruus). lab() ja lch() käyttävät Bradfordin kromaattista adaptaatiota D65-valkopisteestä D50:een muuntamiseen, mikä vastaa sitä, miten CSS Color 4 määrittelee lab()-funktion. Nämä ovat samat kaavat, joita selainten piirtomoottorit käyttävät — toteutettu tässä ilman ulkoisia riippuvuuksia.
  4. 4
    WCAG-kontrasti ja vaaleusasteikko
    Suhteellinen luminanssi lasketaan WCAG 2.1 -kaavan mukaan (linearisoidut R, G, B painotettuina 0,2126/0,7152/0,0722), ja kontrastisuhde valkoista ja mustaa vasten luokitellaan AA-large, AA, AAA tai Fail. Yhdeksänportainen vaaleusliuska luodaan askeltamalla HSL-vaaleuskanavaa 10 %:sta 90 %:iin, ja voit napsauttaa mitä tahansa näytettä muuntaaksesi kyseisen sävyn.

Liittyvät työkalut

🎨

Värinvalitsin ja palettigeneraattori

Valitse värejä, muunna HEX/RGB/HSL-välillä ja luo harmonisia paletteja.

Kokeile sitä
🎨

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.

Kokeile sitä
🎨

Väripalettigeneraattori

Luo täydentäviä, analogisia, triadisia ja monokromaattisia väripaletteja mistä tahansa perusväristä. Kopioi heksadesimaaliarvot yhdellä napsautuksella.

Kokeile sitä

Usein kysytyt kysymykset