Lucrul cu culorile în HTML este relativ simplu. Cu câteva declarații CSS simple, puteți modifica culoarea oricărui text sau fundal de pe pagina dvs. web. Dar cum specifici o culoare? Răspunsul la această întrebare ne va duce într-o groapă care în cele din urmă ne duce la conceptul de coduri de culoare hexazecimale.
Dacă ați mai lucrat cu HTML sau CSS, probabil că ați auzit termenul de cod hexadecimal. Dar ce este exact un cod hexadecimal? Care sunt câteva exemple de coduri hexadecimale? Care este diferența dintre un cod hexadecimal și un cod de culoare RGB?
Ce este codul hexadecimal?
Când începeți să lucrați cu culoarea, puteți utiliza o interfață grafică pentru a alege culorile pe care să le aplicați elementelor din pagina dvs. Când începi să te uiți la codul de bază și nu doar la editorul tău grafic, descoperi că culorile apar ca secvențe de caractere cu aspect ciudat. Astfel de secvențe sunt cunoscute ca coduri hexadecimale; arata cam asa:
#FF0092
Legate de: Termeni esențiali de design grafic pe care trebuie să-i cunoașteți
Puteți specifica culorile în CSS în câteva moduri diferite. Puteți folosi numele unor culori predefinite, cum ar fi roșu și magenta închisă. Totuși, pentru a specifica nuanțe exacte de culoare, va trebui să utilizați o măsurătoare mai precisă: ceva numeric.
CSS oferă două opțiuni principale: RGB și hex. În ambele formate, specificați cantitățile de roșu, verde și albastru care compun culoarea finală. RGB folosește trei numere între 0 și 255. Hex face exact același lucru, doar cu o bază diferită (16) decât zecimala (10) cu care te-ai obișnuit.
Hex folosește literele A-F, pe lângă cifrele 0-9, pentru un total de 16 simboluri. A în hex este echivalentul a 10 în zecimală. F în hex este 15 în zecimală.
Cum funcționează codurile de culoare hexadecimale?
În forma sa cea mai de bază, un cod hexadecimal este o reprezentare a cât de mult roșu, verde și albastru există într-o culoare. Un cod hexadecimal este format din șase caractere. Primele două se referă la cât de mult roșu este în amestec, următoarele două se referă la cantitatea de verde, iar ultimele două cifre reflectă cantitatea de albastru. Codurile hexadecimale se referă la anumite culori, permițând designerilor și dezvoltatorilor să comunice cu ușurință despre schemele de culori.
Cu valori de 16 × 16 (256) pentru fiecare componentă de culoare, există atunci 256 × 256 × 256 combinații posibile. În hex, ele variază de la #000000 (negru pur) la #FFFFFF (alb pur).
Cum să citiți codurile de culoare hexadecimale
Este ușor să înțelegeți codurile de culoare hexadecimale. Să luăm exemplul #FF5733. Mai întâi, împărțiți cele șase caractere în trei părți care conțin câte două caractere fiecare. După cum știți, primele două părți reprezintă roșu, a doua părți reprezintă verde, iar a treia două părți reprezintă albastru. Deci, în exemplul nostru:
- Componenta roșie, RR, are valoarea FF.
- Componenta verde, GG, este 57.
- Componenta albastră, BB, este 33.
Acum, pentru a găsi intensitatea acestor segmente de culoare, trebuie să calculați numărul hexazecimal utilizând acești trei pași:
- Înmulțiți primul caracter hexazecimal al RR cu 16. Dacă caracterul este o literă, convertiți-o în valoarea corespunzătoare. În acest caz, primul caracter este F care este 15. Deci, pentru exemplul nostru, înmulțiți 15 × 16, ceea ce este egal cu 240.
- Apoi, adăugați al doilea caracter din RR. Din nou, convertiți o scrisoare în valoarea ei corespunzătoare, dacă este nevoie. În exemplul nostru, al doilea caracter este F care este egal cu 15.
- După ce ați terminat, adăugați totalurile pentru a obține o singură valoare. Dacă adăugați 240 și 15 din exemplul nostru, veți vedea că valoarea lui FF este 255.
Repetați aceeași formulă pentru celelalte două segmente, GG notat cu 57 și BB notat cu 33. Dacă calculele manuale par prea copleșitoare, puteți utiliza întotdeauna un instrument de conversie hexagonal în RGB (cum ar fi Convertor BinaryHex) pentru a citi o culoare. Ar trebui să găsiți că valoarea hex #FF5733 este echivalent cu rgb (255, 87, 51).
De ce este codul de culoare hexadecimal atât de popular?
Deși există mai multe modele de culori diferite (RGB, CMYK, HSL), codurile de culoare hexadecimale sunt poate cea mai utilizată reprezentare. Acest lucru se datorează faptului că sunt simple și ușor de înțeles.
Un format cu lățime fixă este, de asemenea, foarte util. Culorile hexazecimale de lungime completă sunt întotdeauna șapte caractere, inclusiv primul # simbol.
Culorile hexagonale sunt foarte eficiente, folosind doar aceste șapte caractere pentru a reprezenta mai mult de 16 milioane de culori. Și diferențierea între aceste culori este un proces simplu.
Hex vs. RGB: Există vreo diferență?
Sistemul RGB de codificare a culorilor folosește trei numere zecimale pentru a indica intensitățile relative de roșu, verde și albastru. Utilizează cifrele 0-9.
Hex folosește, de asemenea, trei numere pentru a reprezenta roșu, verde și albastru, dar folosește cifre suplimentare (A-F) pentru a satisface baza 16. Nu există nicio diferență în culorile rezultate, sunt pur și simplu formate diferite pentru a comunica aceleași informații.
Legate de: Fundamentele CSS: Lucrul cu culorile
Pentru ce este folosit codul hexadecimal?
O varietate de aplicații diferite utilizează RGB, de la ecrane de televiziune la dispozitive mobile, jocuri și semne. Veți vedea în principal coduri de culoare hexadecimale în design web și alte programe de grafică.
De asemenea, puteți vedea codurile hexadecimale ca o modalitate universală de identificare a culorilor. Multe site-uri web le folosesc pentru a identifica o anumită culoare, deoarece sunt scurte și, de obicei, lipsite de ambiguitate în context.
Codul de culoare hexadecimal nu este știință rachetă
Deci, aici aveți elementele de bază ale codurilor de culoare hexadecimale. Nu sunt chiar științe dure, dar servesc un scop precis în design (și în lumea tehnologiei). Dacă sunteți în căutarea unui instrument care să vă ajute să înțelegeți cum funcționează culorile hexagonale sau unul care să vă învețe despre teoria amestecului RGB, există o mulțime online. Amintiți-vă, cheia pentru a învăța ceva nou este să faceți pas la un pas.
Codurile de culoare hexadecimale nu sunt cel mai interesant lucru din lume, dar este vital să le înțelegeți dacă lucrați în design web. Capacitatea de a lucra cu coduri de culoare hexadecimale vă va face munca de proiectare mult mai ușoară.
Aflați cum să alegeți orice valoare de culoare de pe ecran în câteva secunde. Util mai ales pentru web designeri!
Citiți în continuare
- Creativ
- CSS
- HTML
- Web design
- Scheme de culori
Gargi este scriitor, povestitor și cercetător. Ea este specializată în scrierea de piese de conținut convingătoare despre toate lucrurile pe internet pentru clienți din țări și industrii. Este absolventă de literatură, cu o diplomă în editare și editare. În afara muncii, ea găzduiește spectacole TEDx și festivaluri de literatură. Într-o lume ideală, ea este întotdeauna la un minut distanță de a pleca spre munți.
Aboneaza-te la newsletter-ul nostru
Alăturați-vă buletinului nostru informativ pentru sfaturi tehnice, recenzii, cărți electronice gratuite și oferte exclusive!
Click aici pentru a te abona