Color Picker

Valitse värit ja ryhdy töihin — ilman säätöä

Rakensimme Color Pickerin vuonna 2025, koska raskaat sovellukset ja monimutkaiset värityökalut kyllästyttivät. Frontend-kehittäjinä ja kuvittajina tarvitsimme keinon napata väri, hienosäätää sitä hieman ja jatkaa eteenpäin. Se alkoi sisäisenä työkaluna, nousi kollegoiden suosikiksi, ja hioimme sen kaikkien käytettäväksi verkkoon. Ei tilejä, ei opettelujyrkkyyttä — avaa sivu, valitse sävy ja kopioi HEX-, RGB-, HSL- tai HSV-koodit.

Miksi ihmiset pitävät värivalitsimestamme?

Jos olet joskus tuijottanut suunnitelmaa ja miettinyt, miten saat täsmälleen oikean sävyn, arvostat Color Pickerin selkeyttä. Pidimme käyttöliittymän tarkoituksella minimalistisena:

• Napsautus — ja väri on sinulla — napauta mitä tahansa kohtaa paletissa ja työkalu näyttää heti tarvitsemasi arvot. Haluatko näytteen valokuvasta tai kuvakaappauksesta? Pudota se sivulle ja käytä pipettiä.
• Liukuvärit helposti — luo silkkiset siirtymät lisäämällä ja siirtämällä pysäytyskohtia palkissa. Vaihda lineaarisen ja säteittäisen välillä, säädä kulmaa ja peittävyyttä ja kopioi CSS.
• Ei rajoja, ei maksuja — Color Picker toimii missä tahansa modernissa selaimessa tietokoneella, tabletilla tai puhelimella. Ei asennettavaa eikä maksuja.
• Laajennukset tarpeen mukaan — valinnaiset Chrome- ja Edge-laajennuksemme tuovat pipetin suoraan selaimeen, jotta voit poimia värejä millä tahansa sivulla ja pitää historiasi mukanasi.

Mihin se sopii

Ihmiset käyttävät Color Pickeriä monin tavoin:

• Suunnittelijat ja tuotetiimit turvautuvat siihen luonnostellessaan käyttöliittymiä tai brändipaletteja. Yhdistelmien tutkiminen ja liukuväreihin tarvittavan CSS:n kopiointi on nopeaa.
• Kuvittajat ja taiteilijat käyttävät pipettiä inspiraation hakemiseen valokuvista ja maalauksista. Liukuvärityökalu auttaa suunnittelemaan pehmeää varjostusta ja värisiirtymiä.
• Frontend-kehittäjät luottavat siihen tuottaakseen yhdenmukaiset väriarvot projekteissa. Laajennus tekee näytteenotosta olemassa olevilta sivustoilta vaivatonta.
• Kaikki, jotka tarkistavat saavutettavuutta voivat tarkastella värejä eri malleissa ja säätää peittävyyttä, kunnes kontrastiohjeet täyttyvät.

Aloita

Käyttöohjetta ei tarvita — tässä pikakatsaus:

• Valitse väri — napsauta paletin mitä tahansa kohtaa. Näet heti HEX-, RGB- ja HSV-arvot. Hienosäädä sävyä, kylläisyyttä, kirkkautta ja läpinäkyvyyttä liukusäätimillä.
• Näytteenotto kuvasta — vedä kuvatiedosto sivulle tai valitse sellainen. Klikkaa haluamaasi pikseliä — värikoodit ilmestyvät.
• Rakenna liukuväri — lisää pysäytyskohta napsauttamalla liukuväripalkkia ja vedä niitä; vaihda lineaarisen ja säteittäisen välillä. Säädä kulmaa ja peittävyyttä, kunnes lopputulos on kohdallaan.
• Kopioi ja käytä uudelleen — värisi ja liukuvärisi tallentuvat automaattisesti. Kopioi koodit tai CSS ja liitä projektiisi tai jaa tiimille.