Cum să identifici o anumită culoare pe o aplicație sau pe un site web

click fraud protection

Imaginați-vă că defilați prin imagini și că găsiți culoarea perfectă - nuanța exactă de care aveți nevoie pentru următorul dvs. proiect de design. Există câteva instrumente minunate pe internet care vă ajută să identificați anumite culori pe orice aplicație sau site web. Să aruncăm o privire la unele dintre cele mai bune opțiuni pentru ele.

1. Utilizarea Instrumentelor pentru dezvoltatori pe browserul web Chrome

O opțiune pe care o puteți încerca este instrumentul Chrome Developer. Chrome vine cu o mulțime de funcții utile pentru dezvoltatori, ceea ce face sarcinile mult mai ușor de realizat. Puteți utiliza următorii pași pentru a identifica anumite culori pe orice aplicație sau site web.

  • Deschideți site-ul web pe care doriți să identificați o culoare în browserul web Chrome
  • Faceți clic pe pictograma cu trei puncte din dreapta sus a Chrome. Va apărea o fereastră pop-up cu o mulțime de opțiuni.
  • Faceți clic pe „Mai multe instrumente” și apoi selectați „Instrumente pentru dezvoltatori” din fereastra pop-up rezultată.
  • Folosiți Ctrl + Shift + I dacă doriți să săriți peste pașii de mai sus
  • Acum, fereastra se împarte în două ecrane – site-ul în stânga și codul site-ului în dreapta
  • Tastați Ctrl + Shift + C pe tastatură. Aceasta vă arată toate detaliile unui anumit element de pe site atunci când trecem cursorul mouse-ului pe elemente.
  • Puteți găsi codul de culoare al elementului împreună cu alte informații utile.

Exemplu

Să presupunem că sunteți interesat de codurile de culoare specifice pentru unele elemente de pe următorul site web:

Puteți alege instrumentele de dezvoltare făcând clic pe cele trei puncte din colțul ecranului. În meniul drop-down, selectați Mai multe instrumente, apoi Instrumente pentru dezvoltatori.

Ecranul va fi împărțit vizual în două pagini. Veți vedea site-ul în stânga și codul site-ului în dreapta.

Tastați comanda și scurtătură „Ctrl + Shift + C” și treceți cursorul mouse-ului peste elementele site-ului web. Aceasta va afișa culoarea acelui element, împreună cu alte informații utile. Mai jos sunt două exemple în care găsim culoarea barei de navigare și un tablou de bord sub instrumentul de căutare.

Aici, putem găsi codul de culoare pe pop-up-ul pentru bara de navigare. Codul culorii este #333333.

Culoarea tabloului de bord poate fi găsită împreună cu alte detalii utile. Culoare: #333333, Culoare de fundal: #5D4A8E. Deși ar putea părea puțin intimidant la început, programul devine mult mai ușor de utilizat cu puțină practică.

2. Extensie pentru picurare pentru ochi

Eye Dropper este o extensie Chrome populară și utilizată pe scară largă pentru a vă ajuta să găsiți anumite culori pe orice site web sau aplicație.

Urmați pașii de mai jos pentru a identifica anumite culori pe un site web sau pe o aplicație folosind instrumentul de extensie Eye Dropper.

  • Deschideți orice site web sau aplicație în browserul web Chrome
  • Faceți clic pe pictograma extensiei Eye Dropper
  • Selectați „Alege culoarea de pe pagina web” și plasați cursorul mouse-ului pe diferite elemente din aplicație sau site.

Puteți găsi codul de culoare al elementelor enumerate în partea dreaptă jos a paginii web.

Exemplu

Bine, să folosim instrumentul de extensie pentru pipetă într-un exemplu real. Vom începe prin a deschide un site web și vom apăsa pictograma extensiei Eye Dropper

Când treceți cursorul pe diferite elemente ale site-ului web, puteți vedea codurile de culoare care apar într-o secțiune din dreapta jos a ecranului.

Când trec cursorul pe pictograma în formă de V, pot vedea codul său de culoare în fereastra de jos, așa cum este menționat. Avantajul acestui instrument este că puteți găsi și codul RGB împreună cu codul de culoare hexadecimal al elementului. Metoda este flexibilă de utilizat pentru cei care doresc o modalitate simplă și rapidă de a prelua codurile pentru culorile lor preferate.