Lähteekö mitään palvelimelle

Ei. Valitsin, liukuvärityökalu ja kuvapipetti toimivat selaimessasi, ja historia on oman laitteesi paikallisessa tallennustilassa.

Mitä muotoja voin kopioida

HEX, RGB ja RGBA, HSL, HSV, CMYK, XYZ, LAB ja LCH sekä valmis CSS-määrittely niin yksivärisille pinnoille kuin liukuväreille.

Miksi näytön pipetti ei näy

Se nojaa selaimen EyeDropper-rajapintaan, jota ei ole kaikkialla. Jos se puuttuu, lataa kuva ja poimi väri siitä.

Miten trendivärit valitaan

Havaitusta käytöstä ennusteen sijaan: mitkä värit valitaan ja kuinka usein vuoden aikana.

Saanko käyttää värejä kaupallisesti

Saat. Väriarvo ei kuulu kenellekään, joten kaikki täältä kopioimasi voi siirtyä suoraan työhösi.

Valitse väri, ota koodi ja jatka työtä

Värivalitsin, liukuvärityökalu ja kuvapipetti yhdellä sivulla. Ei tiliä, ei asennusta eikä odottelua: valitse sävy ja kopioi se muodossa HEX, RGB, HSL tai HSV.

Avaa värisivu

Värikoodit

HEX#0F37FF

RGBrgb(15, 55, 255)

HSLhsl(230°, 100%, 52.94%)

HSVhsv(230°, 94.12%, 100%)

CMYKcmyk(94.12%, 78.43%, 0%, 0%)

XYZxyz(19.61, 10.05, 95.5)

LABlab(37.93, 62.96, -98.45)

LCHlch(37.93, 116.86, 302.6°)

Trendivärit

Katso kaikki trendivärit

Mitä sivulta löytyy

Pipetti

Poimi värejä ladatusta kuvasta tai mistä tahansa näytöltä siellä, missä selain sen sallii. Pudota tiedosto sivulle ja napsauta pikseliä.

Muunnokset

Vaihda hetkessä muotojen HEX, RGB, HSL, HSV, CMYK, XYZ, LAB ja LCH välillä ja kopioi mikä tahansa arvo suoraan CSS:ään tai suunnitteluohjelmaan.

Liukuvärityökalu

Lisää ja raahaa pysäytyskohtia palkilla, vaihda lineaarisen ja säteittäisen välillä, säädä kulma ja läpinäkyvyys ja kopioi valmis CSS.

Värihistoria

Jokainen tekemäsi väri ja liukuväri jää selaimeesi, joten voit palata siihen myöhemmin tai käyttää sitä toisessa projektissa.

Harmoniat ja muunnelmat

Jokaisella värisivulla on vaaleammat ja tummemmat sävyt sekä kuusi harmoniamallia, ja mikä tahansa niistä muuttuu liukuväriksi yhdellä napsautuksella.

Ilmainen ja yksityinen

Ei maksumuuria eikä seurantaa siitä, mitä valitset. Ladatut kuvat luetaan selaimessa eivätkä ne mene minnekään.

Kenelle tämä on

Suunnittelijat ja tuotetiimit: Kun luonnostelet käyttöliittymää tai brändipalettia, kokeilet yhdistelmiä ja kopioit liukuvärin tarkan CSS:n.
Kuvitus ja maalaus: Värien poimimiseen valokuvista ja maalauksista pipetillä sekä pehmeiden siirtymien suunnitteluun.
Frontend-kehitys: Johdonmukaisten väriarvojen tuottamiseen läpi projektin ja arvojen lukemiseen valmiista suunnittelusta.
Saavutettavuuden tarkistajat: Värin vertaamiseen eri malleissa ja sen säätämiseen, kunnes kontrastisuhde ylittää tarvittavan rajan.

Näin käytät sitä

1
Valitse väri
Napsauta mihin tahansa kylläisyyskentässä ja hienosäädä sitten sävy- ja alfaliukusäätimillä. HEX, RGB ja HSV päivittyvät matkan varrella.
2
Poimi kuvasta
Raahaa kuva sivulle tai valitse tiedosto ja napsauta haluamaasi pikseliä. Koodit ilmestyvät heti.
3
Rakenna liukuväri
Napsauta palkkia lisätäksesi pysäytyskohdan ja raahaa se paikalleen. Vaihda lineaarisen ja säteittäisen välillä ja aseta kulma.
4
Kopioi ja käytä uudelleen
Kopioi arvo tai koko CSS-määrittely. Kaikki valitsemasi tallentuu historiaan itsestään.

Usein kysyttyä

Pieni työkalu, joka ei ole tiellä

Kaikki alkoi sisäisenä apuvälineenä: halusimme napata värin, säätää sitä ja jatkaa eteenpäin avaamatta ensin raskasta suunnitteluohjelmaa. Tämä on tarkoituksella yksi sivu, tarkoituksella nopea, ja se pysyy ilmaisena.

Selainlaajennukset

Poimitko mieluummin värit suoraan sivuilta, joilla käyt? Chromen ja Edgen laajennukset lisäävät pipetin työkalupalkkiin, pitävät omaa historiaansa ja avaavat tämän työkalun yhdellä napsautuksella.

Avaa Chrome Web Store Avaa Microsoft Edge -lisäosat