Nazwy kolorów html to często spotykana alternatywa do kodów kolorów, takich jak RGB czy HEX. W znaczący sposób przyśpiesza pracę nad stylami, ponieważ pod każdą nazwą kryje się odwołanie do kodu koloru.
Kody kolorów w internecie
Kolor w Internecie jest reprezentowany za pomocą kodów kolorów, które określają intensywność trzech podstawowych kolorów: czerwonego (Red), zielonego (Green) i niebieskiego (Blue).
Najczęściej stosowanym systemem kodowania kolorów w Internecie jest system RGB. W systemie RGB, każdy z kolorów czerwonego, zielonego i niebieskiego może mieć wartość od 0 do 255, gdzie 0 oznacza brak intensywności danego koloru, a 255 – pełną intensywność. Na przykład, kod koloru RGB (255, 0, 0) oznacza pełną intensywność czerwonego, brak intensywności zielonego i brak intensywności niebieskiego, co daje nam kolor czerwony.
Innym popularnym systemem kodowania kolorów w Internecie jest system HEX (hexadecimal). W systemie HEX, kolor jest reprezentowany przez sześć znaków w formacie szesnastkowym, gdzie pierwsze dwa znaki określają intensywność czerwonego, kolejne dwa – zielonego, a ostatnie dwa – niebieskiego. Na przykład, kod koloru #FF0000 w systemie HEX oznacza pełną intensywność czerwonego, brak intensywności zielonego i brak intensywności niebieskiego, co daje nam kolor czerwony.
Nazwy kolorów w HTML
Specyfikacja HTML 4.0 zawiera 16 podstawowych nazwanych kolorów:
| Kolor | Nazwa koloru pl/en | HTML / HEX | HTML / RGB |
|---|---|---|---|
| cyjan / aqua | #00FFFF | rgb (0,255,255) | |
| czarny / black | #000000 | rgb (0,0,0) | |
| granatowy / navy | #0000FF | rgb (0,0,255) | |
| fuksja / fuchsia | #FF00FF | rgb (255,0,255) | |
| granatowy / navy | #008000 | rgb (0,102,255) | |
| niebieski / blue | #808080 | rgb (102,255,255) | |
| granatowy / navy | #00FF00 | rgb (0,255,0) | |
| kasztanowy / maroon | #800000 | rgb (102,255,255) | |
| granatowy / navy | #000080 | rgb (0,0,102) | |
| oliwkowy / olive | #808000 | rgb (102,255,255) | |
| niebieski / blue | #800080 | rgb (102,255,255) | |
| czerwony / red | #FF0000 | rgb (255,0,0) | |
| niebieski / blue | #C0C0C0 | rgb (153.255.255) | |
| granatowy / navy | #008080 | rgb (0,102,255) | |
| biały / white | #FFFFFF | rgb (255,255,255) | |
| morski / teal | #FFFF00 | rgb (255,255,0) |
Bezpieczne kolory html
Tabela bezpiecznych kolorów w Internecie, znana również jako paleta bezpiecznych kolorów, została stworzona w celu zapewnienia spójności kolorów na różnych przeglądarkach i platformach. Ta tabela zawiera 216 kolorów, które są uznawane za bezpieczne i powinny być dobrze wyświetlane na większości urządzeń i przeglądarek internetowych. Oto przykładowa tabela bezpiecznych kolorów w Internecie:
| Kolor | Nazwa koloru pl/en | HTML / HEX | HTML / RGB |
|---|---|---|---|
| czarny / black | #000000 | rgb (0,0,0) | |
| #000033 | rgb (0,0,51) | ||
| #000066 | rgb (0,0,102) | ||
| #000099 | rgb (0,0,153) | ||
| #0000CC | rgb (0,0,204) | ||
| niebieski / blue | #0000FF | rgb (0,0,255) | |
| #003300 | rgb (0,51,0) | ||
| #003333 | rgb (0,51,51) | ||
| #003366 | rgb (0,51,102) | ||
| #003399 | rgb (0,51,153) | ||
| #0033CC | rgb (0,51,204) | ||
| #0033FF | rgb (0,51,255) | ||
| #006600 | rgb (0,102,0) | ||
| #006633 | rgb (0,102,51) | ||
| #006666 | rgb (0,102,102) | ||
| #006699 | rgb (0,102,153) | ||
| #0066CC | rgb (0,102,204) | ||
| #0066FF | rgb (0,102,255) | ||
| #009900 | rgb (0,153,0) | ||
| #009933 | rgb (0,153,51) | ||
| #009966 | rgb (0,153,102) | ||
| #009999 | rgb (0,153,153) | ||
| #0099CC | rgb (0,153,204) | ||
| #0099FF | rgb (0,153,255) | ||
| #00CC00 | rgb (0,204,0) | ||
| #00CC33 | rgb (0,204,51) | ||
| #00CC66 | rgb (0,204,102) | ||
| #00CC99 | rgb (0,204,153) | ||
| #00CCCC | rgb (0,204,204) | ||
| #00CCFF | rgb (0,204,255) | ||
| limonka / lime | #00FF00 | rgb (0,255,0) | |
| #00FF33 | rgb (0,255,51) | ||
| #00FF66 | rgb (0,255,102) | ||
| #00FF99 | rgb (0,255,153) | ||
| #00FFCC | rgb (0,255,204) | ||
| cyjan / aqua | #00FFFF | rgb (0,255,255) | |
| #330000 | rgb (51,0,0) | ||
| #330033 | rgb (51,0,51) | ||
| #330066 | rgb (51,0,102) | ||
| #330099 | rgb (51,0153) | ||
| #3300CC | rgb (51,0,204) | ||
| #3300FF | rgb (51,0,255) | ||
| #333300 | rgb (51,51,0) | ||
| #333333 | rgb (51,51,51) | ||
| #333366 | rgb (51,51,102) | ||
| #333399 | rgb (51,51,153) | ||
| #3333CC | rgb (51,51,204) | ||
| #3333FF | rgb (51,51,255) | ||
| #336600 | rgb (51,102,0) | ||
| #336633 | rgb (51,102,51) | ||
| #336666 | rgb (51,102,102) | ||
| #336699 | rgb (51,102,153) | ||
| #3366CC | rgb (51,102,204) | ||
| #3366FF | rgb (51,102,255) | ||
| #339900 | rgb (51,153,0) | ||
| #339933 | rgb (51,153,51) | ||
| #339966 | rgb (51.153.102) | ||
| #339999 | rgb (51.153.153) | ||
| #3399CC | rgb (51.153.204) | ||
| #3399FF | rgb (51.153.255) | ||
| #33CC00 | rgb (51,204,0) | ||
| #33CC33 | rgb (51,204,51) | ||
| #33CC66 | rgb (51,204,102) | ||
| #33CC99 | rgb (51.204.153) | ||
| #33CCCC | rgb (51,204,204) | ||
| #33CCFF | rgb (51,204,255) | ||
| #33FF00 | rgb (51,255,0) | ||
| #33FF33 | rgb (51,255,51) | ||
| #33FF66 | rgb (51.255.102) | ||
| #33FF99 | rgb (51.255.153) | ||
| #33FFCC | rgb (51.255.204) | ||
| #33FFFF | rgb (51.255.255) | ||
| #660000 | rgb (102,0,0) | ||
| #660033 | rgb (102,0,51) | ||
| #660066 | rgb (102, 0,102) | ||
| #660099 | rgb (102,0,153) | ||
| #6600CC | rgb (102,0,204) | ||
| #6600FF | rgb (102,0,255) | ||
| #663300 | rgb (102,51,0) | ||
| #663333 | rgb (102,51,51) | ||
| #663366 | rgb (102,51,102) | ||
| #663399 | rgb (102,51,153) | ||
| #6633CC | rgb (102,51,204) | ||
| #6633FF | rgb (102,51,255) | ||
| #666600 | rgb (102,102,0) | ||
| #666633 | rgb (102,102,51) | ||
| #666666 | rgb (102,102,102) | ||
| #666699 | rgb (102,102,153) | ||
| #6666CC | rgb (102,102,204) | ||
| #6666FF | rgb (102,102,255) | ||
| #669900 | rgb (102,153,0) | ||
| #669933 | rgb (102,153,51) | ||
| #669966 | rgb (102,153,102) | ||
| #669999 | rgb (102,153,153) | ||
| #6699CC | rgb (102,153,204) | ||
| #6699FF | rgb (102,153,255) | ||
| #66CC00 | rgb (102,204,0) | ||
| #66CC33 | rgb (102,204,51) | ||
| #66CC66 | rgb (102,204,102) | ||
| #66CC99 | rgb (102,204,153) | ||
| #66CCCC | rgb (102,204,204) | ||
| #66CCFF | rgb (102,204,255) | ||
| #66FF00 | rgb (102,255,0) | ||
| #66FF33 | rgb (102,255,51) | ||
| #66FF66 | rgb (102,255,102) | ||
| #66FF99 | rgb (102,255,153) | ||
| #66FFCC | rgb (102,255,204) | ||
| #66FFFF | rgb (102,255,255) | ||
| #990000 | rgb (153,0,0) | ||
| #990033 | rgb (153,0,51) | ||
| #990066 | rgb (153, 0,102) | ||
| #990099 | rgb (153,0,153) | ||
| #9900CC | rgb (153,0,204) | ||
| #9900FF | rgb (153,0,255) | ||
| #993300 | rgb (153,51,0) | ||
| #993333 | rgb (153,51,51) | ||
| #993366 | rgb (153,51,102) | ||
| #993399 | rgb (153,51,153) | ||
| #9933CC | rgb (153,51,204) | ||
| #9933FF | rgb (153,51,255) | ||
| #996600 | rgb (153,102,0) | ||
| #996633 | rgb (153,102,51) | ||
| #996666 | rgb (153,102,102) | ||
| #996699 | rgb (153,102,153) | ||
| #9966CC | rgb (153,102,204) | ||
| #9966FF | rgb (153,102,255) | ||
| #999900 | rgb (153,153,0) | ||
| #999933 | rgb (153,153,51) | ||
| #999966 | rgb (153,153,102) | ||
| #999999 | rgb (153,153,153) | ||
| #9999CC | rgb (153,153,204) | ||
| #9999FF | rgb (153,153,255) | ||
| #99CC00 | rgb (153,204,0) | ||
| #99CC33 | rgb (153,204,51) | ||
| #99CC66 | rgb (153,204,102) | ||
| #99CC99 | rgb (153,204,153) | ||
| #99CCCC | rgb (153,204,204) | ||
| #99CCFF | rgb (153,204,255) | ||
| #99FF00 | rgb (153,255,0) | ||
| #99FF33 | rgb (153,255,51) | ||
| #99FF66 | rgb (153.255.102) | ||
| #99FF99 | rgb (153.255.153) | ||
| #99FFCC | rgb (153,255,204) | ||
| #99FFFF | rgb (153.255.255) | ||
| #CC0000 | rgb (204,0,0) | ||
| #CC0033 | rgb (204,0,51) | ||
| #CC0066 | rgb (204, 0,102) | ||
| #CC0099 | rgb (204,0,153) | ||
| #CC00CC | rgb (204,0,204) | ||
| #CC00FF | rgb (204,0,255) | ||
| #CC3300 | rgb (204,51,0) | ||
| #CC3333 | rgb (204,51,51) | ||
| #CC3366 | rgb (204,51,102) | ||
| #CC3399 | rgb (204,51,153) | ||
| #CC33CC | rgb (204,51,204) | ||
| #CC33FF | rgb (204,51,255) | ||
| #CC6600 | rgb (204,102,0) | ||
| #CC6633 | rgb (204,102,51) | ||
| #CC6666 | rgb (204,102,102) | ||
| #CC6699 | rgb (204,102,153) | ||
| #CC66CC | rgb (204,102,204) | ||
| #CC66FF | rgb (204,102,255) | ||
| #CC9900 | rgb (204,153,0) | ||
| #CC9933 | rgb (204,153,51) | ||
| #CC9966 | rgb (204,153,102) | ||
| #CC9999 | rgb (204,153,153) | ||
| #CC99CC | rgb (204,153,204) | ||
| #CC99FF | rgb (204,153,255) | ||
| #CCCC00 | rgb (204,204,0) | ||
| #CCCC33 | rgb (204,204,51) | ||
| #CCCC66 | rgb (204,204,102) | ||
| #CCCC99 | rgb (204,204,153) | ||
| #CCCCCC | rgb (204,204,204) | ||
| #CCCCFF | rgb (204,204,255) | ||
| #CCFF00 | rgb (204,255,0) | ||
| #CCFF33 | rgb (204,255,51) | ||
| #CCFF66 | rgb (204,255,102) | ||
| #CCFF99 | rgb (204,255,153) | ||
| #CCFFCC | rgb (204,255,204) | ||
| #CCFFFF | rgb (204,255,255) | ||
| czerwony / red | #FF0000 | rgb (255,0,0) | |
| #FF0033 | rgb (255,0,51) | ||
| #FF0066 | rgb (255, 0,102) | ||
| #FF0099 | rgb (255,0,153) | ||
| #FF00CC | rgb (255,0,204) | ||
| fuksja / fuchsia | #FF00FF | rgb (255,0,255) | |
| #FF3300 | rgb (255,51,0) | ||
| #FF3333 | rgb (255,51,51) | ||
| #FF3366 | rgb (255,51,102) | ||
| #FF3399 | rgb (255,51,153) | ||
| #FF33CC | rgb (255,51,204) | ||
| #FF33FF | rgb (255,51,255) | ||
| #FF6600 | rgb (255,102,0) | ||
| #FF6633 | rgb (255,102,51) | ||
| #FF6666 | rgb (255,102,102) | ||
| #FF6699 | rgb (255,102,153) | ||
| #FF66CC | rgb (255,102,204) | ||
| #FF66FF | rgb (255,102,255) | ||
| #FF9900 | rgb (255,153,0) | ||
| #FF9933 | rgb (255,153,51) | ||
| #FF9966 | rgb (255,153,102) | ||
| #FF9999 | rgb (255,153,153) | ||
| #FF99CC | rgb (255,153,204) | ||
| #FF99FF | rgb (255,153,255) | ||
| #FFCC00 | rgb (255,204,0) | ||
| #FFCC33 | rgb (255,204,51) | ||
| #FFCC66 | rgb (255,204,102) | ||
| #FFCC99 | rgb (255,204,153) | ||
| #FFCCCC | rgb (255,204,204) | ||
| #FFCCFF | rgb (255,204,255) | ||
| żółty / yellow | #FFFF00 | rgb (255,255,0) | |
| #FFFF33 | rgb (255,255,51) | ||
| #FFFF66 | rgb (255,255,102) | ||
| #FFFF99 | rgb (255,255,153) | ||
| #FFFFCC | rgb (255,255,204) | ||
| biały / white | #FFFFFF | rgb (255,255,255) |
Warto zauważyć, że tabela bezpiecznych kolorów w Internecie jest stosowana głównie w kontekście obszarów, takich jak tła, tekst czy linki, które mają być czytelne i dobrze wyglądać na różnych urządzeniach i przeglądarkach. Jednak w przypadku projektowania stron internetowych, można wykorzystywać także inne kolory spoza tej palety, o ile są one odpowiednio zdefiniowane w systemie kodowania kolorów, takim jak RGB czy HEX.
Narzędzia do kolorów
Istnieje wiele narzędzi online, które umożliwiają wybór i sprawdzanie kodów kolorów w Internecie, takich jak kalkulatory kolorów czy palety kolorów. Można również używać programów graficznych, takich jak Adobe Photoshop czy GIMP, aby dostosować kolory i uzyskać ich odpowiednie kody w systemie RGB lub HEX.
