Paleta de Culori scanează fiecare element de pe o pagină web și extrage setul complet de culori utilizate — de la text și fundal până la borduri, umbre și accente. Culorile sunt afișate ca mostre vizuale sortate după frecvență (cele mai utilizate primele), fiecare afișând valoarea HEX și numărul de utilizări. Fă clic pe orice mostră pentru a copia sau exportă întreaga paletă ca o listă de coduri de culori.
Fiecare site web bine proiectat are o paletă de culori consistentă — de obicei 3-8 culori primare plus niște neutrale. Paleta de Culori extrage această paletă automat prin scanarea valorilor calculate color, background-color, border-color și box-shadow ale fiecărui element. Rezultatul este o colecție sortată după frecvență a fiecărei culori de pe pagină, oferindu-ți imaginea completă a sistemului de culori al site-ului. Culorile dominante (culoarea primară de brand, culoarea de fundal, culoarea textului) apar primele cu numere mari de utilizare. Culorile accent și valorile one-off apar mai jos. Aceasta este neprețuită pentru cercetarea de design — vizitează orice site web și extrage paleta sa exactă de culori în secunde. Este de asemenea utilă pentru auditarea propriului site: există culori care nu aparțin sistemului tău de design? Utilizezi 5 nuanțe ușor diferite de gri când specificația de design definește doar 3? Paleta de Culori face vizibilă și numărabilă întreaga utilizare a culorilor.
Scanează fiecare element vizibil de pe pagină și extrage culori din proprietăți calculate: color, background-color, border-color, culoarea box-shadow, outline-color și text-decoration-color. Fiecare culoare utilizată pe pagină este capturată.
Culorile sunt sortate după numărul de utilizări — culoarea cea mai utilizată apare prima. Culorile dominante de brand și fundalurile ajung la vârf, în timp ce culorile accent one-off apar ultimele. Observă instant culorile primare, secundare și accent ale paginii.
Fiecare culoare este randată ca o mostră vizuală mare cu codul HEX și numărul de utilizări afișate mai jos. Mostrele sunt suficient de mari pentru a distinge diferențele subtile de nuanță (ca #333 față de #2a2a2a).
Fă clic pe orice mostră de culoare pentru a copia imediat valoarea sa HEX în clipboard. Nu este nevoie să deschizi un panou de culori sau un dialog secundar — un clic, copiat, gata.
Fă clic pe Export All pentru a copia întreaga paletă ca o listă formatată de coduri de culori HEX. Lipește într-un instrument de design, fișier de variabile CSS sau documentație de culori. Lista păstrează ordinea de sortare după frecvență.
Culorile sunt normalizate (reprezentările rgb și hex ale aceleași culori sunt îmbinate) și de-duplicate. Paleta arată numai culori unice, cu numere combinate de utilizare pentru reprezentările duplicate.
Vizitează site-uri web cu scheme de culori frumoase și extrage paleta lor exactă. Folosește culorile ca punct de plecare pentru propriul tău design — sau pur și simplu documentează care combinații de culori funcționează bine împreună.
Rulează Paleta de Culori pe propriul tău site pentru a verifica consistența culorilor de brand. Există 4 albăstrui ușor diferite unde ar trebui să fie 1? Se strecoară culori off-brand? Sortarea după frecvență face inconsistențele evidente.
Exportă paleta și convertește-o în proprietăți CSS personalizate (--color-primary, --color-secondary etc.). Ieșirea sortată după frecvență îți spune care culori merită roluri primare, secundare și accent.
Extrage palete de culori de pe site-urile competitorului pentru a înțelege poziționarea lor de brand. Culori calde față de culori reci, contrast ridicat față de estompat — paleta dezvăluie alegerile de design intenționate.
Observă toate culorile textului alături de culorile de fundal. Există combinații de text-fundal cu contrast prea scăzut? Paleta îți oferă setul complet de culori pentru a le verifica față de cerințele de contrast WCAG.
Deschide floating dock-ul DevSuite Pro și fă clic pe iconița Paletă de Culori. Instrumentul scanează fiecare element de pe pagină și extrage toate valorile de culoare.
Apare un grid de mostre de culoare, sortate după frecvența de utilizare. Culorile cele mai utilizate sunt în vârf. Fiecare mostră arată codul HEX și numărul de elemente care utilizează acea culoare.
Fă clic pe orice mostră pentru a copia valoarea sa HEX în clipboard. Apare o confirmare scurtă.
Fă clic pe Export All pentru a copia fiecare culoare ca o listă formatată. Lipește în fișierul tău de variabile CSS, instrumentul de design sau documentație.
Navighează la pagini diferite de pe același site și extrage palete pentru a verifica consistența culorilor pe tot site-ul.
Instalează DevSuite Pro gratuit și deblochează peste 39 de instrumente pentru dezvoltatori în browserul tău.
