Cum se folosește
- Alege o imagine sau trage-o în casetă.
- Mută cursorul peste imagine; lupa arată pixelii din jur.
- Dă clic sau atinge pentru a alege culoarea și a o copia ca HEX, RGB sau HSL.
- Derulează în jos pentru culorile dominante, alege câte vrei și copiază-le sau descarcă-le ca variabile CSS.
Cum funcționează
Imaginea este desenată pe un canvas în browser, iar culoarea pixelului exact de sub cursor este citită de acolo. Lupa afișează o zonă de 11 × 11 pixeli mărită, cu pixelul selectat evidențiat. Imaginile mai mari de 4096 pixeli pe o latură sunt mai întâi reduse, astfel încât, la fotografiile foarte mari, pixelul selectat reprezintă media câtorva pixeli originali.
Culorile dominante sunt identificate prin gruparea k-means: pixelii sunt întâi grupați în 32.768 de grupuri mici de culori, apoi grupurile sunt comasate în numărul de culori ales de dvs., ponderate în funcție de numărul de pixeli pe care îl conține fiecare. Punctele de pornire sunt alese determinist, astfel încât aceeași imagine generează întotdeauna aceeași paletă.
Culorile sunt citite în spațiul sRGB folosit de browser pentru afișare. Dacă o imagine are un profil de culoare cu gamă largă încorporat, valorile pot diferi ușor față de cele afișate de un editor foto. În browserele care acceptă acest lucru (Chrome și Edge pe desktop), butonul Selectare de pe ecran folosește funcția EyeDropper încorporată pentru a prelua o culoare de oriunde de pe ecran.
Exemple
Potrivirea culorii de brand
Încărcați o captură de ecran cu un logo, dați clic pe culoarea sa principală și copiați #1a73e8 sau rgb(26, 115, 232) în CSS.
Paletă dintr-o fotografie
O fotografie de plajă împărțită în 6 culori oferă tonuri de nisip, mare și cer, fiecare cu ponderea din imagine pe care o acoperă, sortate de la cea mai mare la cea mai mică.
Verificarea unei nuanțe
Folosiți lupa pentru a selecta pixelul exact al unei linii subțiri, nu marginea anti-aliasată de lângă ea.
Întrebări frecvente
De ce diferă ușor culoarea față de editorul meu foto?
Browserele convertesc imaginile în sRGB pentru afișare. Fotografiile cu profil de gamă largă (Display P3, Adobe RGB) pot afișa valori ușor diferite într-un editor care păstrează profilul original.
De ce lipsește butonul Selectare de pe ecran?
Are nevoie de API-ul EyeDropper, pe care doar unele browsere îl acceptă, momentan Chrome și Edge pe desktop. Selectarea din imaginea încărcată funcționează peste tot.
Cum sunt alese culorile dominante?
Prin gruparea k-means a tuturor pixelilor, ponderată în funcție de frecvența fiecărei culori. Detaliile mici, dar intense, pot fi comasate într-o culoare apropiată mai răspândită; creșteți numărul de culori pentru a le separa.
Este încărcată imaginea?
Nu. Este decodificată și analizată de această pagină în browserul tău și nu părăsește niciodată dispozitivul tău.
Confidențialitate
Imaginea este procesată integral în browserul tău. Nu este încărcată, iar culorile alese nu sunt trimise sau stocate.