Najprej ekstrahirajte primer palete, nato uporabite natančno izbiranje in ročne popravke, da se odločite, katere barve spadajo v vaš projekt. Odpri Izbirnik barv s slike.
Naložite in pridobite začetno paleto
Odprite Image Color Picker in naložite eno podprto sliko ali poskusite z vzorcem. Samodejno pridobivanje naloži vir na strežnik. Vzorec v tem vodniku je collage-botanical.jpg, 1200 x 900 fotografija cvetov, listov in breskovega ozadja.
Pustite Colors to extract na 6 in za primer izberite Dominant. Dominant daje prednost glavnim barvam slike, medtem ko Vibrant daje večji vpliv barvitim poudarkom. Zahteva lahko uporabi od 3 do 12 barv; slika z manj ločenimi vidnimi skupinami lahko vrne manj barv.
Dejanski rezultat Dominant vsebuje #E3B49F, #A5927F, #F3C2AC, #FBCEBA, #746E4F, #C297CA. Največja skupina je #E3B49F pri približno 28.88% vzorčenih vidnih slikovnih pik. Pridobivanje je uporabilo 512 x 384 vzorec; ti odstotki niso natančen popis slike v polni ločljivosti.
Barva palete je lahko povprečje bližnjih barv. Izberite določeno slikovno piko, ko potrebujete vrednost ene majhne podrobnosti.
Izberite in izboljšajte posamezne barve
Kliknite ali tapnite sliko, da pregledate slikovno piko s povečevalnim steklom. Fokusirajte sliko in uporabite puščične tipke za premik za eno slikovno piko, Shift in puščico za premik za deset, nato Enter za izbiro. Kopirajte HEX, RGB ali HSL s pripadajočim gumbom za kopiranje ali uporabite Add to palette.
Izberite vzorec za spremembo njegove vrednosti HEX ali barve, ga premaknite levo ali desno oziroma ga odstranite. Dodajanje barve po meri sprejme vrednost HEX po vaši izbiri. Zaklepanje barve ohrani izbrani vzorec, ko osvežitev palete ali spremenjena nastavitev ekstrakcije ustvari drugo začetno paleto.
Vzorčenje in prosojnost ponujata izvorno barvo in sestavljanje čez ozadje. Izvorna barva vključuje prosojnost v kopiranih kodah, kjer je to primerno; sestavljanje prikazuje slikovno piko, zmešano čez izbrano ozadje vzorčenja. Vzorci palete so sami po sebi neprozorne vrednosti RGB. Urejene in izbrane barve nimajo ocenjenega izvornega odstotka.
Slike, ki jih brskalnik lahko dekodira, uporabljajo vzorce sRGB brskalnika. Če je uporabljen normaliziran predogled, izbirnik barve in koordinate izrecno označi kot približne.
Primer v tem vodniku
Barve za ekstrakcijo: 6; Dominantne; brez ročnih sprememb ali zaklepov; Shrani kot: PNG. Samodejna ekstrakcija je vzorčila 512 x 384 slikovnih pik.
- Izvorna slika
- 1200 x 900 px
- Ekstrahirane barve
- 6 neprozornih barv
- Kartica palete
- 600 x 500 px
- Preneseno PNG
- 9,163 bajtov
Preverite par besedila in ozadja
Odprite Preveri barvni kontrast. Nastavite besedilo in ozadje z barvnimi kontrolniki, vnesite kode HEX ali uporabite izbrano barvo za obe strani. Vzorec besedila v živo vam omogoča primerjavo para, razmerje pa spremljajo ločeni rezultati Normal AA, Normal AAA, Large AA in Large AAA.
Izberite par za predvideni namen, namesto da predpostavljate, da se lahko vsaka ekstrahirana barva uporabi kot besedilo. Svetlo breskova in svetlo vijolična barva lahko na fotografiji delujeta skupaj, medtem ko sta kot kombinacija besedila in ozadja neustrezni.
Ta kontrolnik preveri samo ta par barv za kontrast besedila. To ni popolna revizija dostopnosti in ne odloča o tem, ali so tipografija, interakcija s tipkovnico ali preostanek zasnove uporabni.
Prehodno razmerje kontrasta je koristen preizkus, ne pa zagotovilo, da je celotna stran dostopna.
Kopirajte vrednosti ali izvozite paleto
Za hitro predajo kopirajte posamezno kodo ali uporabite Kopiraj barve palete HEX. Za datoteko izberite Shrani kot in izberite Začni. PNG ustvari sliko palete z oznakami; SVG ohrani vzorce in oznake kot vektorsko vsebino; CSS zagotavlja oštevilčene barvne spremenljivke; JSON vsebuje vrednosti HEX, RGB in HSL.
Neurejen primer s šestimi barvami izvozi palette.png pri 600 x 500 slikovnih pikah in 9,163 bajtih. Vrstni red vzorcev se ujema s paleto. Vaša končna paleta lahko po urejanju vsebuje od 1 do 12 barv, tudi če je bilo samodejno začetno število drugačno.
Prenesite pred odhodom ali osvežitvijo. Končni izvoz naloži izvorne in izbrane barve za obdelavo na strežniku. Ustvari novo datoteko palete in ne prebarva ali zamenja izvirne fotografije.
PNG in SVG sta priročni vizualni referenci. CSS in JSON sta uporabna, ko naslednji korak potrebuje ponovno uporabne barvne vrednosti.
Pogosta vprašanja
Ali kapalka vrne iste barve kot samodejna ekstrakcija?
Ne nujno. Izbrana vrednost opisuje določeno izvorno slikovno piko ali slikovno piko predogleda. Samodejna ekstrakcija združuje vzorčene slikovne pike in lahko vrne povprečne barve.
Ali se prozorne slikovne pike štejejo?
Popolnoma prozorne slikovne pike so izključene iz ekstrakcije. Delno prozorne slikovne pike imajo zmanjšano težo. Izvorno vzorčenje lahko prikaže prosojnost, vendar so izvoženi vzorci palete neprozorni.
Kaj se zgodi z zaklenjenimi barvami, ko osvežim?
Zaklenjene barve ostanejo v paleti, medtem ko nove ekstrahirane barve zapolnijo druge položaje. Ohranjeni ali urejeni barvi ni dodeljen izmišljen odstotek slike.
Ali lahko to uporabim za točno barvo blagovne znamke?
Vnesite znano vrednost HEX neposredno ali izberite ustrezno izvorno slikovno piko. Osvetlitev fotografije, stiskanje, upravljanje barv in normalizirani predogledi lahko spremenijo vzorčene vrednosti, zato samodejna paleta fotografije ni dokaz o izvirni specifikaciji blagovne znamke.
Sestavite paleto, ki jo lahko vzamete v svojo naslednjo zasnovo
Preizkusite vzorec ali uporabite svojo datoteko in pred skupno rabo preglejte rezultat.
