Coduri de culori pastelate. Tutorial HTML. Culori RGB. Paleta de culori sigure. Specificarea culorii folosind RGB
Există mai multe moduri de a reprezenta culoarea în design web.
HEX este un sistem de reprezentare a culorilor hexazecimală bazat pe baza 16. Pentru acest sistem, cifrele zecimale arabe de la 0 la 9 și litere latine de la A la F sunt folosite pentru a completa numărul digital la 16. Pentru design web, 16 culori primare (cheie) sunt folosite, așa-numitul cod de culoare hexazecimal #RRGGBB, unde fiecare pereche este responsabilă pentru cota sa de culoare: RR – roșu, GG – verde și BB – albastru. Fiecare fracțiune de culoare variază de la 00 la FF.
Alte două reprezentări ale culorii în design web sunt: sub formă de RGB(*,*,*), unde fiecare fracțiune „*” a unei culori este reprezentată prin cifre zecimale de la 0 la 255 și prin nume de culori pe Limba engleză.
La crearea unei imagini color problema principala este redarea corectă a culorilor tipuri diferite computere, monitoare și browsere. Dacă browserul nu poate afișa corect o culoare, selectează una similară sau amestecă mai multe culori. Și uneori poate fi înlocuit cu o culoare complet diferită.
Masa 16 culori primare, care sunt utilizate în toate browserele
| Nume | Culoare | Hex | (RGB) |
| Aqua (valul mării) | #00FFFF | (000,255,255) | |
| Negru | #000000 | (000,000,000) | |
| Albastru | #0000FF | (000,000,255) | |
| fucsia (magenta) | #FF00FF | (255,000,255) | |
| gri | #808080 | (128,128,128) | |
| Verde | #008000 | (000,128,000) | |
| Tei (verde aprins) | #00FF00 | (000,255,000) | |
| Maroon (visiniu închis) | #800000 | (128,000,000) | |
| Bleumarin (albastru închis) | #000080 | (000,000,128) | |
| măsline | #808000 | (128,128,000) | |
| Violet | #800080 | (128,000,128) | |
| roșu | #FF0000 | (255,000,000) | |
| Argint | #C0C0C0 | (192,192,192) | |
| Teal (gri-verde) | #008080 | (000,128,128) | |
| alb | #FFFFFF | (255,255,255) | |
| Galben | #FFFF00 | (255,255,000) |
Masa Violet culorile și nuanțele sale
| Nume | Culoare | Hex | (RGB) |
| Magenta (magenta) | #FFCBDB | (255,203,219) | |
| Magenta (magenta) | #FF0099 | (255,000,153) | |
| Magenta (magenta) | #F95A61 | (249,090,097) | |
| fucsia (fucsia) | #FF00FF | (255,000,255) | |
| Mauvein (violet anilină) | #EF0097 | (239,000,151) | |
| Roz somon (roz portocaliu) | #FF91A4 | (255,145,164) | |
| Cenise (o nuanță de violet) | #DE3163 | (153,149,140) | |
| vinete vinete (vinete) | #990066 | (153,000,132) | |
| Blush de lavandă (roz-lavandă) | #FFF0F5 | (255,240,245) | |
| liliac (liliac) | #C8A2C8 | (200,162,200) | |
| Magenta (magenta) | #FF008F | (255,000,143) | |
| orhidee (orhidee) | #DA70D6 | (218,112,214) | |
| Roșu-violet (violet-roșu) | #C71585 | (199,021,133) | |
| Sanguin (sangvin) | #92000A | (146,000,010) | |
| Ciulin (nuanță de violet) | #D8BFD8 | (185,211,238) | |
| Violet-vinete (o nuanță de violet) | #991199 | (153,017,153) | |
| Rosa vivo (roz intens) | #FF007F | (255,000,127) | |
| Lavandă-trandafir (o nuanță de violet) | #FBA0E3 | (108,123,139) | |
| Mountbatten roz | #997ABD | (153,122,141) |
Masa gri culorile și nuanțele sale
| Nume | Culoare | Hex | (RGB) |
| gri | #808080 | (128,128,128) | |
| gri | #bebebe | (190,190,190) | |
| (nuanță gri) | #858585 | (133,133,133) | |
| Gri33 | #545454 | (084,084,084) | |
| (Ardezie gri) | #708090 | (112,128,144) | |
| (Cuarţ) | #99958с | (153,149,140) | |
| (Gri deschis) | #bbbbbb | (187,187,187) | |
| (Argint) | #c0c0c0 | (192,192,192) | |
| (gri-alb) | #f0f0f0 | (240,240,240) | |
| (Barba lui Abdel-Kerim) | #e0e0e0 | (224,224,224) | |
| Gri deschis (gri deschis) | #d3d3d3 | (211,211,211) | |
| LightStateGray() | #778899 | (119,136,153) | |
| StateGray-1 (albastru pal floarea de colț1) | #c6e2ff | (198,226,255) | |
| StateGray-2 (albastru pal de floarea de colț2) | #b9d3ee | (185,211,238) | |
| StateGray3() | #9fb6cd | (159,182,205) | |
| StateGray4() | #6c7b8b | (108,123,139) |
După cum știți, culoarea poate afecta starea unei persoane: atât mentală, cât și fizică. În fiecare zi, în timp ce navighează pe site-uri web pe internet, ochii evaluează milioane de culori și nuanțe. Un web designer care este familiarizat cu psihologia culorii poate manipula starea de spirit a vizitatorului pentru a atinge anumite obiective.
Acest lucru se datorează faptului că unele nuanțe calmează, iar altele, dimpotrivă, excită. În continuare vom vorbi despre modul în care culoarea este sintetizată și afișată folosind tehnologia computerizată.
RGB este un model de culoare care reprezintă o metodă de obținere a tuturor culorilor și nuanțelor acestora prin amestecarea în diverse proporții a trei componente principale, care sunt:
- Culoare rosie ( roșu);
- Culoarea verde ( Verde);
- Culoarea albastră ( Albastru).
De aici provine numele abreviat RGB. Aceste culori au fost alese ca fiind principale dintr-un motiv: motivul este fiziologia retinei ochiului uman și modul în care le percepe:
Modelul RGB rămâne cel mai popular astăzi și este folosit pentru a reproduce culorile pe ecranele TV și monitoare de calculator. Deoarece producătorii își dotează produsele cu diverse caracteristici, în 1996 a fost creat un singur sistem Sinteza de culoare bazată pe RGB numită sRGB, care a fost dezvoltată în comun de Microsoft și HP.
Reprezentarea numerică a culorii
După cum am menționat mai devreme, culorile RGB sunt formate prin amestecarea culorilor primare. Pentru a descrie intensitatea fiecăruia dintre ele, a fost adoptată o schemă în care culoarea este reprezentată de intervalul 0-255 (8 biți), care în notație hexazecimală corespunde cu 00-FF.
Adică, culorile primare vor arăta astfel:
- Roșu – RGB (255,0,0);
- Verde – RGB (0,255,0);
- Albastru – RGB (0,0,255);
Dacă intensitatea culorii ia valori mai mici de 255, atunci se obțin diferite nuanțe de roșu, verde și albastru. Următorul este un tabel cu gradațiile lor, precum și valorile hexazecimale ale fiecăreia dintre nuanțe:
Tabelele de culori RGB
Desigur, pe lângă gradările de culori primare, există și cele mixte, iar numărul lor este destul de mare. Prin urmare, a fost creat un tabel de culori RGB, care prezintă toate nuanțele existente, precum și numele și reprezentările numerice ale acestora ( în formă zecimală și hexazecimală).
O puteți vizualiza aici. Aceasta masa face viața mult mai ușoară pentru web designeri, deoarece în câteva secunde puteți găsi nuanța necesară și aflați reprezentarea numerică a acesteia.
Paletă de culori RGB sigură
Cu toate acestea, la un moment dat a apărut o problemă cu afișarea culorilor în diferite browsere și, pentru a o rezolva, a fost compilată așa-numita paletă „sigură” de culori RGB, care au fost derivate prin calcule matematice.
Când browserul nu poate afișa corect o culoare, va încerca să obțină ceva aproape de ceea ce are nevoie prin amestecarea culorilor adiacente și, cel mai probabil, rezultatul va fi complet inacceptabil:
Folosind codurile de culoare RGB din această paletă, un dezvoltator web nu se poate teme de afișarea culorilor pe paginile site-ului său atunci când este vizualizat folosind browsere diferite, pe diverse platformeși monitoare. Deși pe acest moment tabelul culorilor sigure își pierde relevanța ( progresul tehnologic încă nu stă pe loc), când îl folosești, poți, după cum se spune, să dormi liniștit.
Culoare aurie în modelul RGB
Cuvântul „aur” a fost folosit pentru prima dată la începutul secolului al XIV-lea pentru a descrie culoarea unui element chimic numit Aurum - aur. În modelul RGB, culoarea aurie este reprezentată de următoarele valori numerice:
- RGB (255, 215, 0) – sistem zecimal;
- HEX #FFD700 – sistem hexazecimal.
Culoare bej în modelul RGB
Culoarea bej ocupă un loc destul de semnificativ în istorie, chiar dacă nu este cea mai expresivă. Multe monumente culturale, în special sculpturi antice, au fost realizate din piatră de sălatură și piatră de sălatură, care au o tentă bej. În modelul RGB, culoarea bej are următoarele reprezentări numerice.
Codurile de culoare în CSS sunt folosite pentru a specifica culorile. De obicei, codurile de culoare sau valorile de culoare sunt folosite pentru a seta culoarea fie pentru culoarea primului plan a unui element (de exemplu, culoarea textului, culoarea linkului), fie pentru culoarea de fundal a unui element (culoarea fundalului, culoarea blocului). Ele pot fi, de asemenea, folosite pentru a schimba culoarea unui buton, chenar, marcator, hover și alte efecte decorative.
Puteți specifica valorile culorii în diferite formate. Următorul tabel listează toate formatele posibile:
Formatele enumerate sunt descrise mai detaliat mai jos.
Culori CSS - coduri hexadecimale
Cod de culoare hexazecimal este o reprezentare de șase cifre a culorii. Primele două cifre (RR) reprezintă valoarea roșie, următoarele două reprezintă valoarea verde (GG), iar ultimele două reprezintă valoarea albastră (BB).
Culori CSS - coduri hexadecimale scurte
Cod de culoare hexadecimal scurt este o formă mai scurtă de notație cu șase caractere. În acest format, fiecare cifră este repetată pentru a produce o valoare de culoare echivalentă din șase cifre. De exemplu: #0F0 devine #00FF00.
Valoarea hexazecimală poate fi luată din orice grafic software, ca Adobe Photoshop, Core Draw etc.
Fiecare cod de culoare hexazecimal din CSS va fi precedat de semnul hash „#”. Mai jos sunt exemple de utilizare a notațiilor hexazecimale.
Culori CSS - Valori RGB
Valoarea RGB este un cod de culoare care este setat folosind proprietatea rgb(). Această proprietate are trei valori: câte una pentru roșu, verde și albastru. Valoarea poate fi un număr întreg, de la 0 la 255 sau un procent.
Notă: Nu toate browserele acceptă proprietatea de culoare rgb(), deci nu este recomandat să o folosești.
Mai jos este un exemplu care arată mai multe culori folosind valori RGB.
Generator de coduri de culoare
Puteți crea milioane de coduri de culoare folosind serviciul nostru.
Culori sigure pentru browser
Mai jos este un tabel cu 216 culori care sunt cele mai sigure și independente de computer. Aceste culori în CSS variază de la 000000 la codul hexazecimal FFFFFF. Sunt sigure de utilizat deoarece asigură că toate computerele afișează corect culoarea atunci când lucrează cu paleta de 256 de culori.
| Tabel de culori „sigure” în CSS | |||||
| #000000 | #000033 | #000066 | #000099 | #0000CC | #0000FF |
| #003300 | #003333 | #003366 | #003399 | #0033CC | #0033FF |
| #006600 | #006633 | #006666 | #006699 | #0066CC | #0066FF |
| #009900 | #009933 | #009966 | #009999 | #0099CC | #0099FF |
| #00CC00 | #00CC33 | #00CC66 | #00CC99 | #00CCCC | #00CCFF |
| #00FF00 | #00FF33 | #00FF66 | #00FF99 | #00FFCC | #00FFFF |
| #330000 | #330033 | #330066 | #330099 | #3300CC | #3300FF |
| #333300 | #333333 | #333366 | #333399 | #3333CC | #3333FF |
| #336600 | #336633 | #336666 | #336699 | #3366CC | #3366FF |
| #339900 | #339933 | #339966 | #339999 | #3399CC | #3399FF |
| #33CC00 | #33CC33 | #33CC66 | #33CC99 | #33CCCC | #33CCFF |
| #33FF00 | #33FF33 | #33FF66 | #33FF99 | #33FFCC | #33FFFF |
| #660000 | #660033 | #660066 | #660099 | #6600CC | #6600FF |
| #663300 | #663333 | #663366 | #663399 | #6633CC | #6633FF |
| #666600 | #666633 | #666666 | #666699 | #6666CC | #6666FF |
| #669900 | #669933 | #669966 | #669999 | #6699CC | #6699FF |
| #66CC00 | #66CC33 | #66CC66 | #66CC99 | #66CCCC | #66CCFF |
| #66FF00 | #66FF33 | #66FF66 | #66FF99 | #66FFCC | #66FFFF |
| #990000 | #990033 | #990066 | #990099 | #9900CC | #9900FF |
| #993300 | #993333 | #993366 | #993399 | #9933CC | #9933FF |
| #996600 | #996633 | #996666 | #996699 | #9966CC | #9966FF |
| #999900 | #999933 | #999966 | #999999 | #9999CC | #9999FF |
| #99CC00 | #99CC33 | #99CC66 | #99CC99 | #99CCCC | #99CCFF |
| #99FF00 | #99FF33 | #99FF66 | #99FF99 | #99FFCC | #99FFFF |
| #CC0000 | #CC0033 | #CC0066 | #CC0099 | #CC00CC | #CC00FF |
| #CC3300 | #CC3333 | #CC3366 | #CC3399 | #CC33CC | #CC33FF |
| #CC6600 | #CC6633 | #CC6666 | #CC6699 | #CC66CC | #CC66FF |
| #CC9900 | #CC9933 | #CC9966 | #CC9999 | #CC99CC | #CC99FF |
| #CCCC00 | #CCCC33 | #CCCC66 | #CCCC99 | #CCCCCC | #CCCCFF |
| #CCFF00 | #CCFF33 | #CCFF66 | #CCFF99 | #CCFFCC | #CCFFFF |
| #FF0000 | #FF0033 | #FF0066 | #FF0099 | #FF00CC | #FF00FF |
| #FF3300 | #FF3333 | #FF3366 | #FF3399 | #FF33CC | #FF33FF |
| #FF6600 | #FF6633 | #FF6666 | #FF6699 | #FF66CC | #FF66FF |
| #FF9900 | #FF9933 | #FF9966 | #FF9999 | #FF99CC | #FF99FF |
| #FFCC00 | #FFCC33 | #FFCC66 | #FFCC99 | #FFCCCC | #FFCCFF |
| #FFFF00 | #FFFF33 | #FFFF66 | #FFFF99 | #FFFFCC | #FFFFFF |
Pentru pagini html Culorile sunt desemnate în principal în hexazecimal. Pentru a face acest lucru, sunt utilizate două tipuri de înregistrare a codului - completă sau prescurtată. Pentru a indica corect culoarea html în întregime, trebuie să scrieți șase caractere (cifre și/sau litere englezești) după semnul hash, de exemplu, negru este scris astfel: #000000. Forma prescurtată a instrucțiunilor culori html constă dintr-un hash și trei numere și/sau litere în spatele acestuia. în care acest tip rezervele pot fi utilizate numai dacă înregistrarea completă a unei anumite culori constă din simboluri identice după semnul hash. De exemplu, aceeași culoare neagră poate fi scrisă astfel: #000. Puteți specifica culorile html folosind atât caractere mari, cât și mici, deoarece nu țin cont de majuscule și minuscule.
Fiecare caracter scris după „#” corespunde unei anumite proporții a culorilor roșu, verde și albastru. La rândul lor, toate monitoarele constau din sumă uriașă pixeli (puncte microscopice), fiecare dintre care include 3 așa-numite „lanterne” (surse de lumină): roșu, verde și albastru. Apoi, prin reglarea intensității luminii emise de aceste „lanterne”, monitorul afișează culoarea de care avem nevoie.
Prin combinarea intensității de emisie a luminii roșii, albastre și verzi (de la 0 la 256), monitoarele pot afișa 16.000.000 de nuanțe diferite.
De asemenea, culorile pentru site-uri web pot fi indicate verbal sau în cod RGB.
Astăzi, 147 de culori pot fi scrise verbal. Este important de știut că unele nume diferite pot însemna aceleași culori, de exemplu Gri și Gri sunt culoarea gri (#808080).
Culori sigure pentru site-uri web.
Nu orice monitor și browser pot afișa corect toate cele 16 milioane de culori html.
Dacă, de exemplu, întâlniți o culoare pe care browserul nu o poate afișa corect, atunci:
- Browserul îl înlocuiește cu cel care îi seamănă cel mai mult și poate fi reprodus cu succes;
- Pentru a afișa corect, browserul poate amesteca mai multe culori și poate reproduce rezultatul.
Pentru a vă asigura că rezultatul în orice browser și pe orice monitor este culoarea pe care ați specificat-o în cod, se recomandă să utilizați „Culori sigure”. Ele au fost determinate nu manual sau de dorința altcuiva, ci matematic. Acestea sunt culori 100% sigure pentru documente html sunt 216. Și deși tehnologia actuală a ajuns la punctul în care monitoarele și browserele moderne recunosc milioane de nuanțe, vă recomandăm să folosiți aceste culori sigure pentru a garanta reproducerea culorilor.
| Sistem de culori hexazecimal. | Coduri de culoare în RGB (roșu, verde, albastru). |
| Cod de culoare HTML: #000000 | Culoare RGB: 0 0 0 |
| Cod de culoare HTML: #333333 | Culoare RGB: 51 51 51 |
| Cod de culoare HTML: #666666 | Culoare RGB: 102 102 102 |
| Cod de culoare HTML: #999999 | Culoare RGB: 153 153 153 |
| Cod de culoare HTML: #CCCCCC | Culoare RGB: 204 204 204 |
| Cod de culoare HTML: #FFFFFF | Culoare RGB: 255 255 255 |
| Cod de culoare HTML: #666600 | Culoare RGB: 102 102 0 |
| Cod de culoare HTML: #999900 | Culoare RGB: 153 153 0 |
| Cod de culoare HTML: #999933 | Culoare RGB: 153 153 51 |
| Cod de culoare HTML: #999966 | Culoare RGB: 153 153 102 |
| Cod de culoare HTML: #CCCC33 | Culoare RGB: 204 204 51 |
| Cod de culoare HTML: #CCCC66 | Culoare RGB: 204 204 102 |
| Cod de culoare HTML: #333300 | Culoare RGB: 51 51 0 |
| Cod de culoare HTML: #666633 | Culoare RGB: 102 102 51 |
| Cod de culoare HTML: #CCCC99 | Culoare RGB: 204 204 153 |
| Cod de culoare HTML: #CCFF33 | Culoare RGB: 204 255 51 |
| Cod de culoare HTML: #CCFF00 | Culoare RGB: 204 255 0 |
| Cod de culoare HTML: #CCFF66 | Culoare RGB: 204 255 102 |
| Cod de culoare HTML: #669900 | Culoare RGB: 102 153 0 |
| Cod de culoare HTML: #99CC33 | Culoare RGB: 153 204 51 |
| Cod de culoare HTML: #99CC00 | Culoare RGB: 153 204 0 |
| Cod de culoare HTML: #99CC66 | Culoare RGB: 153 204 102 |
| Cod de culoare HTML: #99FF33 | Culoare RGB: 153 255 51 |
| Cod de culoare HTML: #99FF00 | Culoare RGB: 153 255 0 |
| Cod de culoare HTML: #336600 | Culoare RGB: 51 102 0 |
| Cod de culoare HTML: #669933 | Culoare RGB: 102 153 51 |
| Cod de culoare HTML: #66CC33 | Culoare RGB: 102 204 51 |
| Cod de culoare HTML: #66CC00 | Culoare RGB: 102 204 0 |
| Cod de culoare HTML: #99FF66 | Culoare RGB: 153 255 102 |
| Cod de culoare HTML: #CCFF99 | Culoare RGB: 204 255 153 |
| Cod de culoare HTML: #009900 | Culoare RGB: 0 153 0 |
| Cod de culoare HTML: #339900 | Culoare RGB: 51 153 0 |
| Cod de culoare HTML: #33CC00 | Culoare RGB: 51 204 0 |
| Cod de culoare HTML: #33FF00 | Culoare RGB: 51 255 0 |
| Cod de culoare HTML: #66FF33 | Culoare RGB: 102 255 51 |
| Cod de culoare HTML: #66FF00 | Culoare RGB: 102 255 0 |
| Cod de culoare HTML: #00CC33 | Culoare RGB: 0 204 51 |
| Cod de culoare HTML: #33CC33 | Culoare RGB: 51 204 51 |
| Cod de culoare HTML: #00CC00 | Culoare RGB: 0 204 0 |
| Cod de culoare HTML: #00FF00 | Culoare RGB: 0 255 0 |
| Cod de culoare HTML: #00FF33 | Culoare RGB: 0 255 51 |
| Cod de culoare HTML: #33FF33 | Culoare RGB: 51 255 51 |
| Cod de culoare HTML: #003300 | Culoare RGB: 0 51 0 |
| Cod de culoare HTML: #336633 | Culoare RGB: 51 102 51 |
| Cod de culoare HTML: #669966 | Culoare RGB: 102 153 102 |
| Cod de culoare HTML: #66CC66 | Culoare RGB: 102 204 102 |
| Cod de culoare HTML: #99CC99 | Culoare RGB: 153 204 153 |
| Cod de culoare HTML: #CCFFCC | Culoare RGB: 204 255 204 |
| Cod de culoare HTML: #006600 | Culoare RGB: 0 102 0 |
| Cod de culoare HTML: #339933 | Culoare RGB: 51 153 51 |
| Cod de culoare HTML: #00FF66 | Culoare RGB: 0 255 102 |
| Cod de culoare HTML: #33FF66 | Culoare RGB: 51 255 102 |
| Cod de culoare HTML: #66FF66 | Culoare RGB: 102 255 102 |
| Cod de culoare HTML: #99FF99 | Culoare RGB: 153 255 153 |
| Cod de culoare HTML: #009933 | Culoare RGB: 0 153 51 |
| Cod de culoare HTML: #00CC66 | Culoare RGB: 0 204 102 |
| Cod de culoare HTML: #33CC66 | Culoare RGB: 51 204 102 |
| Cod de culoare HTML: #00FF99 | Culoare RGB: 0 255 153 |
| Cod de culoare HTML: #33FF99 | Culoare RGB: 51 255 153 |
| Cod de culoare HTML: #66FF99 | Culoare RGB: 102 255 153 |
| Cod culoare HTML: #006633 | Culoare RGB: 0 102 51 |
| Cod de culoare HTML: #009966 | Culoare RGB: 0 153 102 |
| Cod de culoare HTML: #339966 | Culoare RGB: 51 153 102 |
| Cod de culoare HTML: #00CC99 | Culoare RGB: 0 204 153 |
| Cod de culoare HTML: #33CC99 | Culoare RGB: 51 204 153 |
| Cod de culoare HTML: #66CC99 | Culoare RGB: 102 204 153 |
| Cod de culoare HTML: #009999 | Culoare RGB: 0 153 153 |
| Cod de culoare HTML: #33CCCC | Culoare RGB: 51 204 204 |
| Cod de culoare HTML: #00FFCC | Culoare RGB: 0 255 204 |
| Cod de culoare HTML: #33FFCC | Culoare RGB: 51 255 204 |
| Cod de culoare HTML: #66FFCC | Culoare RGB: 102 255 204 |
| Cod de culoare HTML: #99FFCC | Culoare RGB: 153 255 204 |
| Cod de culoare HTML: #00CCCC | Culoare RGB: 0 204 204 |
| Cod de culoare HTML: #00FFFF | Culoare RGB: 0 255 255 |
| Cod de culoare HTML: #33FFFF | Culoare RGB: 51 255 255 |
| Cod de culoare HTML: #66FFFF | Culoare RGB: 102 255 255 |
| Cod de culoare HTML: #99FFFF | Culoare RGB: 153 255 255 |
| Cod de culoare HTML: #CCFFFF | Culoare RGB: 204 255 255 |
| Cod de culoare HTML: #336666 | Culoare RGB: 51 102 102 |
| Cod de culoare HTML: #006666 | Culoare RGB: 0 102 102 |
| Cod de culoare HTML: #669999 | Culoare RGB: 102 153 153 |
| Cod de culoare HTML: #339999 | Culoare RGB: 51 153 153 |
| Cod de culoare HTML: #66CCCC | Culoare RGB: 102 204 204 |
| Cod de culoare HTML: #99CCCC | Culoare RGB: 153 204 204 |
| Cod de culoare HTML: #003333 | Culoare RGB: 0 51 51 |
| Cod culoare HTML: #0099CC | Culoare RGB: 0 153 204 |
| Cod de culoare HTML: #3399CC | Culoare RGB: 51 153 204 |
| Cod de culoare HTML: #00CCFF | Culoare RGB: 0 204 255 |
| Cod de culoare HTML: #33CCFF | Culoare RGB: 51 204 255 |
| Cod de culoare HTML: #66CCFF | Culoare RGB: 102 204 255 |
| Cod de culoare HTML: #006699 | Culoare RGB: 0 102 153 |
| Cod de culoare HTML: #336699 | Culoare RGB: 51 102 153 |
| Cod de culoare HTML: #6699CC | Culoare RGB: 102 153 204 |
| Cod culoare HTML: #0099FF | Culoare RGB: 0 153 255 |
| Cod de culoare HTML: #3399FF | Culoare RGB: 51 153 255 |
| Cod de culoare HTML: #99CCFF | Culoare RGB: 153 204 255 |
| Cod de culoare HTML: #003366 | Culoare RGB: 0 51 102 |
| Cod de culoare HTML: #003399 | Culoare RGB: 0 51 153 |
| Cod de culoare HTML: #0033FF | Culoare RGB: 0 51 255 |
| Cod de culoare HTML: #3366CC | Culoare RGB: 51 102 204 |
| Cod culoare HTML: #0066CC | Culoare RGB: 0 102 204 |
| Cod de culoare HTML: #0066FF | Culoare RGB: 0 102 255 |
| Cod de culoare HTML: #000033 | Culoare RGB: 0 0 51 |
| Cod de culoare HTML: #0033CC | Culoare RGB: 0 51 204 |
| Cod de culoare HTML: #0000CC | Culoare RGB: 0 0 204 |
| Cod de culoare HTML: #0000FF | Culoare RGB: 0 0 255 |
| Cod de culoare HTML: #3366FF | Culoare RGB: 51 102 255 |
| Cod de culoare HTML: #6699FF | Culoare RGB: 102 153 255 |
| Cod de culoare HTML: #000066 | Culoare RGB: 0 0 102 |
| Cod de culoare HTML: #000099 | Culoare RGB: 0 0 153 |
| Cod de culoare HTML: #3333CC | Culoare RGB: 51 51 204 |
| Cod de culoare HTML: #3300CC | Culoare RGB: 51 0 204 |
| Cod de culoare HTML: #3300FF | Culoare RGB: 51 0 255 |
| Cod de culoare HTML: #3333FF | Culoare RGB: 51 51 255 |
| Cod de culoare HTML: #333366 | Culoare RGB: 51 51 102 |
| Cod de culoare HTML: #333399 | Culoare RGB: 51 51 153 |
| Cod de culoare HTML: #666699 | Culoare RGB: 102 102 153 |
| Cod de culoare HTML: #6666CC | Culoare RGB: 102 102 204 |
| Cod de culoare HTML: #6666FF | Culoare RGB: 102 102 255 |
| Cod de culoare HTML: #9999CC | Culoare RGB: 153 153 204 |
| Cod de culoare HTML: #330066 | Culoare RGB: 51 0 102 |
| Cod de culoare HTML: #330099 | Culoare RGB: 51 0 153 |
| Cod de culoare HTML: #6600FF | Culoare RGB: 102 0 255 |
| Cod de culoare HTML: #6633FF | Culoare RGB: 102 51 255 |
| Cod de culoare HTML: #9999FF | Culoare RGB: 153 153 255 |
| Cod de culoare HTML: #CCCCFF | Culoare RGB: 204 204 255 |
| Cod de culoare HTML: #330033 | Culoare RGB: 51 0 51 |
| Cod de culoare HTML: #663399 | Culoare RGB: 102 51 153 |
| Cod de culoare HTML: #6633CC | Culoare RGB: 102 51 204 |
| Cod de culoare HTML: #6600CC | Culoare RGB: 102 0 204 |
| Cod de culoare HTML: #9966FF | Culoare RGB: 153 102 255 |
| Cod de culoare HTML: #9966CC | Culoare RGB: 153 102 204 |
| Cod de culoare HTML: #663366 | Culoare RGB: 102 51 102 |
| Cod de culoare HTML: #660099 | Culoare RGB: 102 0 153 |
| Cod de culoare HTML: #9900FF | Culoare RGB: 153 0 255 |
| Cod de culoare HTML: #9933FF | Culoare RGB: 153 51 255 |
| Cod de culoare HTML: #9933CC | Culoare RGB: 153 51 204 |
| Cod de culoare HTML: #CC99FF | Culoare RGB: 204 153 255 |
| Cod de culoare HTML: #660066 | Culoare RGB: 102 0 102 |
| Cod de culoare HTML: #996699 | Culoare RGB: 153 102 153 |
| Cod de culoare HTML: #9900CC | Culoare RGB: 153 0 204 |
| Cod de culoare HTML: #CC00FF | Culoare RGB: 204 0 255 |
| Cod de culoare HTML: #CC33FF | Culoare RGB: 204 51 255 |
| Cod de culoare HTML: #CC66FF | Culoare RGB: 204 102 255 |
| Cod de culoare HTML: #993399 | Culoare RGB: 153 51 153 |
| Cod de culoare HTML: #990099 | Culoare RGB: 153 0 153 |
| Cod de culoare HTML: #CC33CC | Culoare RGB: 204 51 204 |
| Cod de culoare HTML: #CC00CC | Culoare RGB: 204 0 204 |
| Cod de culoare HTML: #CC66CC | Culoare RGB: 204 102 204 |
| Cod de culoare HTML: #CC99CC | Culoare RGB: 204 153 204 |
| Cod de culoare HTML: #CC3399 | Culoare RGB: 204 51 153 |
| Cod de culoare HTML: #FF00FF | Culoare RGB: 255 0 255 |
| Cod de culoare HTML: #FF33FF | Culoare RGB: 255 51 255 |
| Cod de culoare HTML: #FF66FF | Culoare RGB: 255 102 255 |
| Cod de culoare HTML: #FF99FF | Culoare RGB: 255 153 255 |
| Cod de culoare HTML: #FFCCFF | Culoare RGB: 255 204 255 |
| Cod de culoare HTML: #990066 | Culoare RGB: 153 0 102 |
| Cod culoare HTML: #CC0099 | Culoare RGB: 204 0 153 |
| Cod de culoare HTML: #CC6699 | Culoare RGB: 204 102 153 |
| Cod de culoare HTML: #FF33CC | Culoare RGB: 255 51 204 |
| Cod de culoare HTML: #FF00CC | Culoare RGB: 255 0 204 |
| Cod de culoare HTML: #FF66CC | Culoare RGB: 255 102 204 |
| Cod de culoare HTML: #660033 | Culoare RGB: 102 0 51 |
| Cod de culoare HTML: #993366 | Culoare RGB: 153 51 102 |
| Cod de culoare HTML: #CC0066 | Culoare RGB: 204 0 102 |
| Cod de culoare HTML: #FF0099 | Culoare RGB: 255 0 153 |
| Cod de culoare HTML: #FF3399 | Culoare RGB: 255 51 153 |
| Cod de culoare HTML: #FF99CC | Culoare RGB: 255 153 204 |
| Cod de culoare HTML: #663333 | Culoare RGB: 102 51 51 |
| Cod de culoare HTML: #996666 | Culoare RGB: 153 102 102 |
| Cod de culoare HTML: #CC3366 | Culoare RGB: 204 51 102 |
| Cod de culoare HTML: #FF0066 | Culoare RGB: 255 0 102 |
| Cod de culoare HTML: #FF3366 | Culoare RGB: 255 51 102 |
| Cod de culoare HTML: #FF6699 | Culoare RGB: 255 102 153 |
| Cod de culoare HTML: #330000 | Culoare RGB: 51 0 0 |
| Cod de culoare HTML: #990033 | Culoare RGB: 153 0 51 |
| Cod de culoare HTML: #993333 | Culoare RGB: 153 51 51 |
| Cod de culoare HTML: #CC3333 | Culoare RGB: 204 51 51 |
| Cod de culoare HTML: #CC6666 | Culoare RGB: 204 102 102 |
| Cod de culoare HTML: #CC9999 | Culoare RGB: 204 153 153 |
| Cod de culoare HTML: #CC0033 | Culoare RGB: 204 0 51 |
| Cod de culoare HTML: #FF0033 | Culoare RGB: 255 0 51 |
| Cod de culoare HTML: #FF3333 | Culoare RGB: 255 51 51 |
| Cod de culoare HTML: #FF6666 | Culoare RGB: 255 102 102 |
| Cod de culoare HTML: #FF9999 | Culoare RGB: 255 153 153 |
| Cod de culoare HTML: #FFCCCC | Culoare RGB: 255 204 204 |
| Cod de culoare HTML: #990000 | Culoare RGB: 153 0 0 |
| Cod de culoare HTML: #CC0000 | Culoare RGB: 204 0 0 |
| Cod de culoare HTML: #FF0000 | Culoare RGB: 255 0 0 |
| Cod de culoare HTML: #FF3300 | Culoare RGB: 255 51 0 |
| Cod de culoare HTML: #CC3300 | Culoare RGB: 204 51 0 |
| Cod de culoare HTML: #FF6633 | Culoare RGB: 255 102 51 |
| Cod de culoare HTML: #660000 | Culoare RGB: 102 0 0 |
| Cod de culoare HTML: #993300 | Culoare RGB: 153 51 0 |
| Cod de culoare HTML: #CC6633 | Culoare RGB: 204 102 51 |
| Cod de culoare HTML: #FF6600 | Culoare RGB: 255 102 0 |
| Cod de culoare HTML: #FF9966 | Culoare RGB: 255 153 102 |
| Cod de culoare HTML: #FFCC99 | Culoare RGB: 255 204 153 |
| Cod de culoare HTML: #663300 | Culoare RGB: 102 51 0 |
| Cod de culoare HTML: #996633 | Culoare RGB: 153 102 51 |
| Cod de culoare HTML: #CC6600 | Culoare RGB: 204 102 0 |
| Cod de culoare HTML: #CC9966 | Culoare RGB: 204 153 102 |
| Cod de culoare HTML: #FF9933 | Culoare RGB: 255 153 51 |
| Cod de culoare HTML: #FF9900 | Culoare RGB: 255 153 0 |
| Cod de culoare HTML: #996600 | Culoare RGB: 153 102 0 |
| Cod de culoare HTML: #CC9933 | Culoare RGB: 204 153 51 |
| Cod de culoare HTML: #CC9900 | Culoare RGB: 204 153 0 |
| Cod de culoare HTML: #FFCC33 | Culoare RGB: 255 204 51 |
| Cod de culoare HTML: #FFCC00 | Culoare RGB: 255 204 0 |
| Cod de culoare HTML: #FFCC66 | Culoare RGB: 255 204 102 |
| Cod de culoare HTML: #CCCC00 | Culoare RGB: 204 204 0 |
| Cod de culoare HTML: #FFFF00 | Culoare RGB: 255 255 0 |
| Cod de culoare HTML: #FFFF33 | Culoare RGB: 255 255 51 |
| Cod de culoare HTML: #FFFF66 | Culoare RGB: 255 255 102 |
| Cod de culoare HTML: #FFFF99 | Culoare RGB: 255 255 153 |
| Cod de culoare HTML: #FFFFCC | Culoare RGB: 255 255 204 |
Acest tabel include 216 coduri de culoare html sigure. Fiecare culoare are o valoare RGB pentru a defini culoarea editori graficiși HEX pentru a specifica culoarea pe paginile html.
În HTML, culoarea poate fi specificată în trei moduri:
Setarea unei culori în HTML după numele acesteia
Unele culori pot fi specificate după numele lor, folosind numele culorii în engleză ca valoare. Cel mai comun Cuvinte cheie: negru (negru), alb (alb), roșu (roșu), verde (verde), albastru (albastru), etc.:
Culoarea textului – roșu
Cele mai populare culori ale standardului Consorțiului World wide web(Consorțiul World Wide Web englezesc, W3C):
| Culoare | Nume | Culoare | Nume | Culoare | Nume | Culoare | Nume |
|---|---|---|---|---|---|---|---|
| Negru | gri | Argint | alb | ||||
| Galben | Lămâie verde | Aqua | Fucsie | ||||
| roșu | Verde | Albastru | Violet | ||||
| Maro | măsline | Marinei | Teal |
Exemplu de utilizare a diferitelor nume de culori:
Exemplu: specificarea unei culori după numele acesteia
- Incearca-l tu insuti "
Antet pe fundal roșu
Antet pe fundal portocaliu
Îndreptare pe fundal de var
Text alb pe fundal albastru
Antet pe fundal roșu
Antet pe fundal portocaliu
Îndreptare pe fundal de var
Text alb pe fundal albastru
Specificarea culorii folosind RGB
Când se afișează culori diferite pe un monitor, paleta RGB este folosită ca bază. Orice culoare se obține prin amestecarea a trei culori de bază: R - roșu, G - verde, B - albastru. Luminozitatea fiecărei culori este dată de un octet și, prin urmare, poate lua valori de la 0 la 255. De exemplu, RGB(255,0,0) este afișat ca roșu, deoarece roșu este setat la cea mai mare valoare (255) și restul sunt setate la 0 Puteți seta și culoarea ca procent. Fiecare parametru indică nivelul de luminozitate al culorii corespunzătoare. De exemplu: valorile rgb(127, 255, 127) și rgb(50%, 100%, 50%) vor seta aceeași culoare verde mediu:
Exemplu: specificarea culorii folosind RGB
- Incearca-l tu insuti "
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
rgb(127, 255, 127)
rgb(50%, 100%, 50%)
Setați culoarea după valoarea hexazecimală
Valori R G B poate fi specificat și folosind valori hexazecimale (HEX) de culoare sub forma: #RRGGBB unde RR (roșu), GG (verde) și BB (albastru) sunt valori hexazecimale de la 00 la FF (la fel ca zecimalul 0-255). ). Sistemul hexazecimal, spre deosebire de sistemul zecimal, se bazează, după cum sugerează și numele, pe numărul 16. Sistemul hexazecimal folosește următoarele semne: 0, 1, 2, 3, 4, 5, 6, 7, 8, 9, A, B, C, D, E, F. Aici numerele de la 10 la 15 sunt înlocuite cu litere latine. Numerele mai mari de 15 în sistemul hexazecimal sunt reprezentate prin combinarea a două caractere într-o singură valoare. De exemplu, cel mai mare număr 255 în zecimală corespunde celei mai mari valori FF în hexazecimal. Spre deosebire de sistemul zecimal, un număr hexazecimal este precedat de un simbol hash. # , de exemplu, #FF0000 este afișat ca roșu, deoarece roșul este setat la cea mai mare valoare (FF) și restul culorilor sunt setate la valoarea minimă (00). Semne după simbolul hash # Puteți introduce atât litere mari, cât și litere mici. Sistemul hexazecimal vă permite să utilizați forma prescurtată #rgb, unde fiecare caracter este echivalent cu dublu. Astfel, intrarea #f7O ar trebui considerată ca #ff7700.
Exemplu: Culoare HEX
- Incearca-l tu insuti "
roșu: #FF0000
verde: #00FF00
albastru: #0000FF
roșu: #FF0000
verde: #00FF00
albastru: #0000FF
roșu+verde=galben: #FFFF00
roșu+albastru=violet: #FF00FF
verde+albastru=cian: #00FFFF
Lista culorilor comune (nume, HEX și RGB):
| nume englezesc | nume rusesc | Probă | HEX | RGB | ||
|---|---|---|---|---|---|---|
| Nemuritoare | Nemuritoare | #E52B50 | 229 | 43 | 80 | |
| Chihlimbar | Chihlimbar | #FFBF00 | 255 | 191 | 0 | |
| Aqua | Albastru verde | #00FFFF | 0 | 255 | 255 | |
| Azur | Azur | #007FFF | 0 | 127 | 255 | |
| Negru | Negru | #000000 | 0 | 0 | 0 | |
| Albastru | Albastru | #0000FF | 0 | 0 | 255 | |
| Bondi Blue | Apa de pe plaja Bondi | #0095B6 | 0 | 149 | 182 | |
| Alamă | Alamă | #B5A642 | 181 | 166 | 66 | |
| Maro | Maro | #964B00 | 150 | 75 | 0 | |
| Albastru ca cerul | Azur | #007BA7 | 0 | 123 | 167 | |
| Verde închis de primăvară | Verde închis de primăvară | #177245 | 23 | 114 | 69 | |
| Smarald | Smarald | #50C878 | 80 | 200 | 120 | |
| Vânătă | Vânătă | #990066 | 153 | 0 | 102 | |
| Fucsie | Fucsie | #FF00FF | 255 | 0 | 255 | |
| Aur | Aur | #FFD700 | 250 | 215 | 0 | |
| gri | Gri | #808080 | 128 | 128 | 128 | |
| Verde | Verde | #00FF00 | 0 | 255 | 0 | |
| Indigo | Indigo | #4B0082 | 75 | 0 | 130 | |
| Jad | Jad | #00A86B | 0 | 168 | 107 | |
| Lămâie verde | Lămâie verde | #CCFF00 | 204 | 255 | 0 | |
| Malachit | Malachit | #0BDA51 | 11 | 218 | 81 | |
| Marinei | Albastru inchis | #000080 | 0 | 0 | 128 | |
| Ocru | Ocru | #CC7722 | 204 | 119 | 34 | |
| măsline | măsline | #808000 | 128 | 128 | 0 | |
| Portocale | Portocale | #FFA500 | 255 | 165 | 0 | |
| Piersică | Piersică | #FFE5B4 | 255 | 229 | 180 | |
| Dovleac | Dovleac | #FF7518 | 255 | 117 | 24 | |
| Violet | violet | #800080 | 128 | 0 | 128 | |
| roșu | roșu | #FF0000 | 255 | 0 | 0 | |
| Şofran | Şofran | #F4C430 | 244 | 196 | 48 | |
| Mare verde | Marea verde | #2E8B57 | 46 | 139 | 87 | |
| Verde de mlaștină | Bolotny | #ACB78E | 172 | 183 | 142 | |
| Teal | Albastru verde | #008080 | 0 | 128 | 128 | |
| Ultramarin | Ultramarin | #120A8F | 18 | 10 | 143 | |
| violet | violet | #8B00FF | 139 | 0 | 255 | |
| Galben | Galben | #FFFF00 | 255 | 255 | 0 | |
Codurile de culoare (fond) după saturație și nuanță.