Värivalitsin ja palettipoimija – Valitse värejä kuvasta

Lataa mikä tahansa kuva, klikkaa valitaksesi pikselivärin (HEX / RGB / HSL) tai poista hallitseva paletti automaattisesti. Lataa JSON- tai CSS-muuttujina.

Pudota kuva saadaksesi sen paletin

Tietoa Color Pickerista

Kvantisoi kuvasi haluttuun määrään dominoivia värejä 4-bittisen kanavakohtaisen bucketingin avulla ja lajittelee sitten taajuuden mukaan. Toimii kokonaan selaimessasi — kuvasi ei koskaan poistu laitteestasi.

Frequently Asked Questions

Lataa mikä tahansa JPG-, PNG-, WebP- tai GIF-tiedosto ja klikkaa missä tahansa kuvassa — tarkka pikseli osoittimen alla näytetään ja näytetään HEX-, RGB- ja HSL-muodossa, joissa kutakin muotoa voi kopioida yhdellä klikkauksella. Täydellinen brändin värin sovittamiseen, valokuvanäytteen näytteen ottamiseen tai tehostesävyjen poimimiseen design-mallista.

usage

Kuva pienennetään 320 pikseliin pisimmältä puoleltaan, minkä jälkeen jokainen pikseli jaetaan kanavaa kohden 4 ylimmän bitin mukaan. Eniten väkimääräiset bucketit palautetaan täyteen 8-bittiseen väriin, lajitellaan frekvenssin mukaan ja palautetaan palettina. Tuloksena on tyypillisesti 5–24 hallitsevaa väriä, jotka visuaalisesti tiivistävät kuvan.

technical

Kyllä. Latauspainikkeet tuottavat kaksi muotoa: CSS-muuttujalohkon, joka on valmis liitettäväksi :root-valitsimeen (--color-1, --color-2...), sekä JSON-tiedoston, jossa on heksa-, RGB-komponentit ja painoprosentti jokaiselle värille. Molemmat formaatit integroituvat selkeästi design-tokeneihin, Tailwind-konfiguraatioihin ja palettikirjastoihin.

features

Ei — värien valinta ja palettien poimiminen tapahtuu kokonaan selaimessasi HTML canvas API:n avulla. Kuva pysyy laitteellasi, mikä tekee työkalusta turvallisen julkaisemattomille tuotekuville, luonnosmalleille ja brändiomaisuudelle salassapitosopimuksen mukaisesti.

privacy

Brändi-identiteettityössä 5–8 väriä on paras vaihtoehto — se vangitsee hallitsevan teeman ilman, että korostusvalintoja laimennetaan. Datavisualisoinnissa suosittelemme 10–16 väriä, jotta kategoriset sävyt ovat riittävät. Liukusäädin antaa valita 5:n ja 24:n välillä.

tips

Pikselit, joiden alfa on alle 128, jätetään huomiotta, joten läpinäkyvät taustat eivät saastuta palettia "tausta"-väreillä. Tämä tekee Image Color Pickeristä erityisen hyvän tuotteen leikkauksiin, tarrataiteeseen ja eristyneisiin kohteisiin.

technical

HEX (#RRGGBB) on kompaktein ja CSS, Figma ja Sketch käyttävät sitä oletuksena. RGB näyttää kolme komponenttiarvoa välillä 0–255 — hyödyllistä kuvadatan ohjelmallisessa käsittelyssä. HSL (sävy, kylläisyys, vaaleus) on intuitiivinen värien säätämiseen: vaihda sävyä muuttaaksesi väriperhettä, säädä vaaleutta sävyjen ja sävyjen mukaan.

technical

Kyllä. Ilmainen, tiliä ei vaadita, ei rajoituksia kuvan koolle tai palettien määrälle. Ei ole mitään asennettavaa — koko työkalu on yksi verkkosivu.

pricing

Use Cases

Brändi-identiteetin tarkastus

Kerää tarkat HEX-arvot olemassa olevasta logosta tai markkinointiresurssista ja syötä sitä tyylioppaaseesi. Sovita kilpailijan merkkivärit sijoittumispakkaan tai heittoon.

design

Verkkosuunnittelupaletin rakentaminen

Poimi hallitsevat värit valokuvasta tai tunnelmataulusta, vie ne CSS-muuttujina ja lisää ne tyylilomakkeeseen. 5–8 värin sweet spot kattaa primaariset, korostavat ja neutraalit sävyt täyden design-järjestelmän siemeneksi.

design

Verkkokaupan tuotelistaukset

Sovita tuotekuvien taustavärit myymälän teemaan. Valitse hallitseva korostusväri lenkkarista tai mekkokuvasta ja käytä sitä ilmoituksen korostettuna kohokohtana.

ecommerce

Sisustus- ja muoti-inspiraatio

Kuvaa huone tai asu, josta pidät, ja poimi paletti. Käytä sitä valitsemaan maaleja, kankaita tai asusteita, jotka täydentävät olemassa olevaa kokonaisuutta — muuttaen visuaalisen inspiraation toiminnallisiksi näytteiksi.

lifestyle

Datavisualisointimenetelmät

Luo kategorinen 10–16 värin paletti kuvasta, jonka haluat herättää (esim. vesivärimaalaus pehmeälle kaaviolle, auringonlasku lämpimästä viileäksi -liukuväreille). Parempi kuin valita geneerisiä sävyjä.

data

Peli- ja käyttöliittymän asset-työnkulut

Poima indeksoitu väripaletti sprite-taiteesta tai käyttöliittymämallinnuksista ja syötä sitä pikselitaidetyökaluun tai pelimoottoriin. Paletti JSON-vienti integroituu Asepriteen, Photoshopin ja useimpiin assettiputkiin.

gamedev