Poimi esimerkkipaletti ensin, käytä sitten tarkkaa valintaa ja manuaalisia muokkauksia päättääksesi, mitkä värit kuuluvat omaan projektiisi. Avaa Kuvan värivalitsin.
Lataa ja uuta aloituspaletti
Avaa Image Color Picker ja lataa tuettu kuva tai kokeile näytettä. Automaattinen poiminta lataa lähteen palvelimelle. Tämän oppaan näyte on collage-botanical.jpg, 1200 x 900 kokoinen valokuva kukista, lehdistä ja persikanvärisestä taustasta.
Jätä poimittavien värien määräksi 6 ja valitse esimerkkiä varten Dominant. Dominant suosii kuvan päävärejä, kun taas Vibrant antaa värikkäille korostuksille enemmän vaikutusvaltaa. Pyyntö voi käyttää 3–12 väriä; kuva, jossa on vähemmän erottuvia näkyviä ryhmiä, voi palauttaa vähemmän värejä.
Varsinainen Dominant-tulos sisältää värit #E3B49F, #A5927F, #F3C2AC, #FBCEBA, #746E4F ja #C297CA. Suurin ryhmä on #E3B49F, joka vastaa noin 28.88 %:a näytteistetyistä näkyvistä pikseleistä. Poiminnassa käytettiin 512 x 384 näytettä; nämä prosenttiosuudet eivät ole tarkka laskenta koko resoluution kuvasta.
Palettiväri voi olla lähistön värien keskiarvo. Valitse tietty pikseli, kun tarvitset yhden pienen yksityiskohdan arvon.
Poimi ja tarkenna yksittäisiä värejä
Napsauta tai napauta kuvaa tarkastellaksesi pikseliä suurennuslasilla. Kohdista kuva ja käytä nuolinäppäimiä siirtyäksesi yhden pikselin, Shift ja nuolinäppäin siirtyäksesi kymmenen, ja Enter valitaksesi. Kopioi HEX, RGB tai HSL omalla kopiointipainikkeellaan tai käytä Lisää palettiin -toimintoa.
Valitse värimalli muuttaaksesi sen HEX-arvoa tai väriä, siirtääksesi sitä vasemmalle tai oikealle tai poistaaksesi sen. Mukautetun värin lisääminen hyväksyy valitsemasi HEX-arvon. Lukitse väri säilyttää valitun värimallin, kun Päivitä paletti tai muuttunut poiminta-asetus luo uuden aloituspaletin.
Näytteenotto ja läpinäkyvyys tarjoavat lähdevärin ja yhdistelmän taustan päällä. Lähdeväri sisältää peittävyyden kopioiduissa koodeissa tarvittaessa; yhdistelmä näyttää pikselin sekoitettuna valitun näytetaustan päälle. Itse paletin värimallit ovat peittäviä RGB-arvoja. Muokatuilla ja valituilla väreillä ei ole arvioitua lähdeprosenttia.
Selaindekoodattavat kuvat käyttävät selaimen sRGB-näytteitä. Jos käytetään normalisoitua esikatselua, värivalitsin merkitsee värit ja koordinaatit nimenomaisesti likimääräisiksi.
Tämän oppaan esimerkki
Poimittavat värit: 6; Dominant; ei manuaalisia muutoksia tai lukituksia; Tallenna nimellä: PNG. Automaattinen poiminta näytisti 512 x 384 pikseliä.
- Lähdekuva
- 1200 x 900 px
- Poimitut värit
- 6 peittävää väriä
- Palettikortti
- 600 x 500 px
- Ladattu PNG
- 9,163 tavua
Tarkista teksti- ja taustapari
Avaa Tarkista värikontrasti. Aseta teksti ja tausta värisäätimillä, syötä HEX-koodit tai käytä valittua väriä kummallakin puolella. Elävä tekstinäyte antaa sinun verrata paria, ja suhdetta täydentävät erilliset Normal AA, Normal AAA, Large AA ja Large AAA -tulokset.
Valitse pari aiottuun tarkoitukseen sen sijaan, että olettaisit jokaisen poimitun värin sopivan tekstiksi. Vaalea persikka ja vaalea violetti voivat toimia yhdessä valokuvassa, mutta muodostavat huonon teksti-tausta-yhdistelmän.
Tämä säädin tarkistaa vain kyseisen väriparin tekstikontrastin. Se ei ole täydellinen saavutettavuusauditointi eikä se päätä, onko typografia, näppäimistökäyttö tai muu suunnittelu käytettävissä.
Hyväksyttävä kontrastisuhde on hyödyllinen tarkistus, ei takuu siitä, että koko sivu on saavutettava.
Kopioi arvot tai vie väripaletti
Nopeaa luovutusta varten kopioi yksittäinen koodi tai käytä Kopioi paletti HEX väriä. Tiedostoa varten valitse Tallenna nimellä ja valitse Aloita. PNG luo nimetyn palettikuvan; SVG säilyttää värimallit ja etiketit vektorisisältönä; CSS tarjoaa numeroidut värimuuttujat; JSON sisältää HEX, RGB ja HSL-arvot.
Muokkaamaton kuusivärinen esimerkki vie palette.png koossa 600 x 500 pikseliä ja 9,163 tavua. Sen värimallien järjestys vastaa palettia. Lopullinen palettisi voi sisältää 1–12 väriä muokkauksen jälkeen, vaikka automaattinen aloitusmäärä olisi ollut eri.
Lataa ennen poistumista tai päivittämistä. Lopullinen vienti lataa lähteen ja valitut värit palvelinkäsittelyä varten. Se luo uuden palettitiedoston eikä värjää tai korvaa alkuperäistä valokuvaa.
PNG ja SVG ovat käteviä visuaalisia viitteitä. CSS ja JSON ovat hyödyllisiä, kun seuraava vaihe vaatii uudelleenkäytettäviä väriarvoja.
Yleisiä kysymyksiä
Palauttaako pipetti samat värit kuin automaattinen poiminta?
Ei välttämättä. Valittu arvo kuvaa tiettyä lähde- tai esikatselupikseliä. Automaattinen poiminta ryhmittelee näytistettyjä pikseleitä ja voi palauttaa keskiarvovärejä.
Lasketaanko läpinäkyvät pikselit?
Täysin läpinäkyvät pikselit jätetään poiminnan ulkopuolelle. Osittain läpinäkyvillä pikseleillä on pienempi painoarvo. Lähdenäytteenotto voi näyttää peittävyyden, mutta viedyt paletin värimallit ovat peittäviä.
Mitä lukituille väreille tapahtuu, kun päivitän?
Lukitut värit pysyvät paletissa, kun taas uudet poimitut värit täyttävät muut paikat. Säilytetylle tai muokatulle värille ei määritetä keksittyä kuvan prosenttiosuutta.
Voinko käyttää tätä tarkkaan brändiväriin?
Syötä tunnettu HEX -arvo suoraan tai valitse sopiva lähdepikseli. Valokuvan valaistus, pakkaus, värienhallinta ja normalisoidut esikatselut voivat muuttaa näytteistettyjä arvoja, joten automaattinen valokuvapaletti ei ole todiste alkuperäisestä brändimäärityksestä.
Rakenna paletti, jonka voit ottaa mukaan seuraavaan suunnitelmaasi
Kokeile näytettä tai käytä omaa tiedostoasi ja tarkista tulos ennen jakamista.