Paletti kuvasta

Näin poimit väripaletin kuvasta

1. Pudota kuva latausalueelle tai valitse tiedosto napsauttamalla sitä. JPG, PNG, WebP, GIF ja mikä tahansa muu muoto, jonka selaimesi voi näyttää, toimii.
2. Työkalu analysoi kuvan heti ja näyttää sen Hallitsevat värit järjestettynä eniten esiintyvästä vähiten esiintyvään.
3. Säädä Värien määrä (3–12) saadaksesi laajemman tai tiiviimmän paletin. Poista valinta kohdasta Ohita valkoiset ja lähes valkoiset pikselit, jos valkoinen on kuvasi tärkeä väri, esimerkiksi valkoinen tuote tai lumi.
4. Kopioi yksi väri värinäytteen alla olevalla Kopioi-painikkeella tai valitse muoto kohdasta Vie muodossa (HEX-luettelo, CSS-muuttujat, SCSS-muuttujat, JSON-taulukko tai Tailwind-värit) ja napsauta Kopioi tai Lataa koko paletille. Poimi värit ajaa analyysin uudelleen.

Selaimesi lukee kuvasi paikallisesti. Sitä ei koskaan lähetetä palvelimelle.

Näin hallitsevat värit löydetään

Kuva piirretään ensin näkymättömälle canvasille ja pienennetään niin, että sen pisin sivu on enintään 512 pikseliä. Se pitää analyysin nopeana muuttamatta kokonaisvärejä. Pikselit ryhmitellään sitten kvantisointialgoritmilla (muokattu median cut, avoimen lähdekoodin Color Thief -kirjastosta) OKLCH-väriavaruudessa, jolloin silmälle samankaltaisilta näyttävät värit päätyvät samaan ryhmään.

Jokaisesta ryhmästä tulee yksi paletin väri, ja jokaisen värinäytteen alla oleva prosenttiluku on sen osuus näytteistetyistä pikseleistä. Värinäytteiden yläpuolella oleva palkki näyttää nämä suhteet yhdellä silmäyksellä. Läpinäkyvät pikselit ohitetaan, samoin valkoiset ja lähes valkoiset pikselit, kun valinta on päällä, koska pelkät valkoiset taustat hallitsisivat muuten useimpia tuotekuvia ja kuvakaappauksia.

Jokainen värinäyte näyttää HEX-koodinsa mustalla tai valkoisella sen mukaan, kumpi on luettavampi, joten teksti pysyy luettavana sekä vaaleilla että tummilla väreillä.

Ideoita kuvapaletin käyttöön

• Brändäys ja verkkosuunnittelu: rakenna verkkosivuston teema pääkuvasta tai logosta, jotta käyttöliittymä sopii kuvaan.
• Esitykset ja sosiaalinen media: valitse tekstin ja taustan värit, jotka sopivat kansikuvaan.
• Sisustus, muoti ja taide: vangitse valokuvan, maalauksen tai kangasnäytteen tunnelma.
• Tietojen visualisointi: ota kaavioiden värit samassa raportissa käytetystä kuvituksesta.

Poimitut värit ovat monien pikselien keskiarvoja, joten ne voivat näyttää hieman vähemmän eloisilta kuin valokuvan kylläisin kohta. Jos tarvitset yhden tietyn pikselin täsmällisen värin, käytä sen sijaan kuvan värinvalitsinta.