Tutorial HTML - Coduri de culori

Exista trei feluri distincte de a defini o culoare. Cea mai simpla metoda este aceea de a numi culorile (in engleza). De exemplu: black, white, red, green, si blue. Am alaturat mai jos numele de culori care sunt suportate in HTML.

ColorHexaColorHexColorHexColorHex
aqua#00FFFFgreen#008000navy#000080silver#C0C0C0
black#000000gray#808080olive#808000teal#008080
blue#0000FFlime#00FF00purple#800080white#FFFFFF
fuchsia#FF00FFmaroon#800000red#FF0000yellow#FFFF00

HTML - Sistemul de culori RGB

Cu ceva vreme in urma, Internet explorer era singurul browser care avea suport pentru sistemul de culor RGB. In ziua de astazi, toate browserele cunoscute, ofera suport pentru acest sitem de culori. Pe de alta parte, sistemul RGB, se foloseste foarte mult in CSS

RGB este prescurtarea pentru: Red, Green, Blue. Fiecare dintre aceste culoripoate lua orice valoare intre 0 (nu exista culoare) si 255 (in totalitate acea culoare). Am alaturat mai jos forma de scriere a culorilor in RGB. Daca folosesti un browser care nu este Internet Explorer nu vei avea nici un rezultat.

bgcolor="rgb(255,255,255)"White
bgcolor="rgb(255,0,0)"Red
bgcolor="rgb(0,255,0)"Green
bgcolor="rgb(0,0,255)"Blue

HTML - Sistemul de culori hexazecimal

Sistemul hexazecimal este destul de dificil la prima vedere. Cu toate astea te asigur ca odata cu trecerea timpului, si cu putina practica, il vei intelege pe deplin. Sistemul de culori hexazecimal este sistemul standard pentru toate browser-ele web. Este de incredere si este compatibil nu numai in aplicatiile web dar si aplicatii locale precum gimp, photoshop, corel, etc.

Sistemul coduri de culori hexazecimale este o reprezentare de 6 caractere de culoare. Primele doua caractere (RR) reprezinta culoarea rosu (Red), urmatoarele doua (GG) culoarea verde (Green), iar ultimele doua (BB) culoarea albastra (Blue).

htmlbgcolor="#RRGGBB"

HTML - Coduri de culoare - Ruperea codului

Tabelul urmator arata cum literele sunt integrate in sistemul hexazecimal, marind astfel posibilitatile de combinare pentru obtinerea codurilor de culori in HTML.

Zecimal

0123456789101112131415

Hexazecimal

0123456789ABCDEF

In acest fel posibilitatile cresc iar sistemul poate avea 16 valori.

Un exemplu de cod hexazecimal ar fi:

htmlbgcolor="#FFFFFF"

Litera "F" este valoarea maxima pe care o poate avea sistemul. La intalnirea acestui cod un browser va afisa culoarea alba. In cazul in care vrei sa afli valoarea numerica a acestei culori avem formula urmatoare:

html(15 * 16) + (15) = 255

Formula este foarte simpla. Se ia prima valoare a lui "F" sau 15 si se inmulteste cu 16 si se adauga celei de-a doua valoare 15. Rezultatul este 255, valoarea maxima pe care o poate avea o culoare primara.

htmlbgcolor="#CC7005"

CC(RR - Red)
(12 * 16) + (12) = 204
70(GG - Green)
(7 * 16) + (0) = 112 
05(BB - Blue)
(0 * 16) + (5) = 5

HTML - Culori sigure

Sistemul hexazecimal este cel mai utilizal pentru crearea paginilor. Acesta este compatibil cu majoritatea browser-elor, in acest fel interfata pagini web nu va fi distorsionata. Pentru a adauga o nota de siguranta iti recomand sa folosesti culorile imperechiate (sau true colors) precum: "#0011EE", "#44HHFF", sau "#117788. Conform statisticilor acestea nu vor fi schimbate indiferent de browser.

Am alaturat mai jos un tabel cu codurile corespunzatoare acestor culori sigure.

Pentru a simplifica tabelul de mai jos am afisat culorile sigure folosind coduri scurte. Tine minte in acest sub-capitol vorbim de culori imperechiate, asa ca de exemplu culoarea reprezentata ca fiind 369 este de fapt 33 66 99 iar FFC va fi FF FF CC.

*000300600900C00*F00
*003303603903C03*F03
006306606906C06F06
009309609909C09F09
00C30C60C90CC0CF0C
*00F30F60F90FC0F*F0F
030330630930C30F30
033333633933C33F33
036336636936C36F36
039339639939C39F39
03C33C63C93CC3CF3C
03F33F63F93FC3FF3F
060360660960C60F60
063363663963C63F63
066366666966C66F66
069369669969C69F69
06C36C66C96CC6CF6C
06F36F66F96FC6FF6F
090390690990C90F90
093393693993C93F93
096396696996C96F96
099399699999C99F99
09C39C69C99CC9CF9C
09F39F69F99FC9FF9F
0C03C06C09C0CC0FC0
0C33C36C39C3CC3FC3
0C63C66C69C6CC6FC6
0C93C96C99C9CC9FC9
0CC3CC6CC9CCCCCFCC
0CF3CF6CF9CFCCFFCF
*0F03F0*6F09F0CF0*FF0
0F3*3F3*6F39F3CF3*FF3
*0F6*3F66F69F6*CF6*FF6
0F93F96F99F9CF9FF9
*0FC*3FC6FC9FCCFCFFC
*0FF*3FF*6FF9FFCFF*FFF

*Cele mai sigure culori HTML

Cu toate ca aceste culori sigure (true colors) de mai sus, sunt cele recomadate pentru a fi folosite de catre webmasteri, a fost demonstrat ca doar 22 dintre cele 216 culori sunt cu adevarat sigure si nu vor fi in absolut modificate in reprezentare de catre nici un monitor. In tabelul de mai sus culorile cu adevarat sigure au fost reprezentate cu un asterix ( * ) in fata.

Am alaturat totusi un tabel cu acestea:

*000*F00
*003*F03
*00F*F0F
*FF0*FF3
*CF6*FF6
*0F0*6F0
*3F3*6F3
*0F6*3F6
*0FC*3FC
*0FF*3FF
*6FF*FFF