Kolory strony internetowej
Kolory internetowe to te kolory, które pojawiają się na stronie internetowej . Mogą być oparte na systemach kolorów RGB lub HSL . W kodzie CSS (a dawniej w HTML ) są one określane jako wartości liczbowe, chociaż istnieją kolory, które mogą być również używane przez ich angielskie nazwy. [ 1 ]
RGB
Podstawa teoretyczna
Trójka szesnastkowa to sześciocyfrowa, trzybajtowa liczba szesnastkowa używana w HTML , CSS , SVG i innych aplikacjach komputerowych do reprezentowania kolorów.
Paleta kolorów RGB (RGB w języku hiszpańskim) zasadniczo składa się z trzech addytywnych kolorów podstawowych : czerwonego , zielonego , niebieskiego .
Te addytywne kolory podstawowe w HTML są reprezentowane przez trzy pary szesnastkowe typu 0xHH-HH-HH zgodnie z następującym formatem: (kolory podstawowe lub podstawowe, a nie te wynikające z mieszanin).
Wartości, które każda z trzech par szesnastkowych może dostosować, mieszczą się w zakresie od 0x00 (0 dziesiętnie) do 0xFF (255 dziesiętnie). Im wyższa wartość pary, tym większa intensywność (odcień, jasność lub jasność) koloru odpowiadającego tej parze (i odwrotnie). Oznacza to, że dolny koniec skali chromatycznej zaczyna się od minimalnej intensywności koloru (stopień) ( null = nawet 0x00), przechodzi przez średnią intensywność koloru ( medium = nawet 0x80 [128 dziesiętnie]) aż do osiągnięcia intensywności koloru maksymalnego ( nasycony = nawet 0xFF). Stopień najwyższej czystości ( bezwzględny ) dodatkowego koloru podstawowego będzie określony przez jego całkowitą obecność ( nasycenie = 0xFF) wraz z całkowitym brakiem ( nieważność = 0x00) pozostałych dwóch dodatkowych kolorów podstawowych.
Oprócz tych trzech addytywnych kolorów podstawowych (RGB) istnieją trzy subtraktywne kolory podstawowe lub CMY (w języku hiszpańskim CMA): C ian, M agenta, Yellow . Kolory te powstają z następującej kombinacji (mieszaniny) dodatków podstawowych:
- Cyjan = Zielony + Niebieski
- Magenta = niebieski + czerwony
- Żółty = Czerwony + Zielony
Jeśli chodzi o stopień czystości, dzieje się coś odwrotnego z addytywnymi kolorami podstawowymi, ponieważ stopień bezwzględny będzie określony przez nieważność jednego z jego składników i nasycenie dwóch pozostałych. Uzupełniające kolory podstawowych, zarówno addytywne, jak i subtraktywne, będą wzajemnie:
- Czerwony ↔ Cyjan
- Zielony ↔ Magenta
- Niebieski ↔ Żółty
Jednoczesne połączenie trzech nasyconych dodatków podstawowych daje biel (0xFFFFFF). Odwrotnie, jednoczesne połączenie trzech zerowych odejmowanych barw podstawowych daje czerń (0x000000). Oczywiste jest również, że połączenie dwóch wzajemnie uzupełniających się kolorów spowoduje powstanie bieli, podobnie jak odjęcie (absorpcja) obu spowoduje powstanie czerni ( całkowity brak koloru ). Tak więc, s. Na przykład czerwony (0xFF0000) plus jego dopełnienie, czyli cyjan (0x00FFFF), generuje biały (0xFFFFFF). W rzeczywistości cyjan to nic innego jak odejmowanie czerwieni od bieli. Zwróć uwagę na następujący wykres:
Ze swojej strony, średni szary (0x808080), który jest dokładnym środkiem pomiędzy czernią a bielą, zostanie uzyskany z jednoczesnego połączenia trzech średnich addytywnych kolorów podstawowych . Podobnie szarość półnasycona (jasna) zostanie uzyskana z kombinacji 0xC0C0C0, natomiast szarość półnasycona ( ciemna) zostanie uzyskana z 0x404040. W ten sposób mamy, że pozostałe kolory, które są pomiędzy czarnym (0x000000) a białym (0xFFFFFF), powstają z kombinacji trzech addytywnych kolorów podstawowych w różnym stopniu. Innymi słowy: wystarczy zastąpić każdą z par 0xHH-HH-HH wartością z zakresu od 0x00 do 0xFF, aby uzyskać dowolny z możliwych kolorów.
W 24-bitowym systemie RGB jest 16 777 216 różnych kombinacji, a więc 16 777 216 kolorów: 256 × 256 × 256 = 16 777 216. W praktyce jednak mogą istnieć kombinacje, które nie są prawidłowe. Tak było w dawnych czasach, kiedy największa paleta kolorów miała 256 kolorów (8 bitów). W związku z tym istnieje 216 bezpiecznych kolorów, które będą widoczne na dowolnym urządzeniu bez ditheringu , rezerwując pozostałe 40 kolorów dla systemu, z których niektóre pokazano tutaj.
HSL
W systemie kolorów HSL kolory są mierzone za pomocą trzech parametrów ( odcień , nasycenie i światło ), które określają położenie koloru w cylindrze kolorów HSL. Pierwszy parametr to kąt poziomy, drugi to odległość w poziomie od środka podstawy, a trzeci to odległość pionowa (wysokość) od środka podstawy.
alfa
Kolor może być wyświetlany na ekranie z pewnym przezroczystością, która jest określona przez parametr alfa, który dodany do RGB i HSL konwertuje je do RGBa i HSLa.
Równoważniki
Wśród systemów internetowych istnieje kilka sprzeczności, które można podsumować w poniższej tabeli:
| Nazwa | Kolory X11 | W3C/CSS/ HTML/VGA | ||
|---|---|---|---|---|
| RGB | Próbka | Próbka | RGB | |
| Szary - Szary | #DZIECKO | #808080 | ||
| Zielony - Zielony | #00FF00 | #008000 | ||
| Brązowy - Brązowy | #B03060 | #7F0000 | ||
| Fioletowy - Fioletowy | #A020F0 | #7F007F | ||
| W3C/CSS/ HTML/VGA |
Kolor | X11 | |
|---|---|---|---|
| RGB | Próbka | ||
| Srebro - Srebro | #C0C0C0 | Szary | |
| Limonka - Limonka | #00FF00 | Zielony | |
| Magenta | #FF00FF | Fuksja | |
| Cyjan - Cyjan | #00FFFF | wodny | |
Tabela kolorów
Poniższa tabela kolorów została zaadoptowana do użytku przez W3C / CSS , [ 2 ] HTML / X11 , [ 3 ] Mozilla , [ 4 ] SVG , 5 , Internet Explorer (IE)/ Microsoft Windows , [ 6 ] itp.
| Nazwa HTML | kod szesnastkowy | Wartości RGB |
Wartości HSL |
Wartości HSV |
|---|---|---|---|---|
| czerwone kolory | ||||
| jasny koral | F08080 | 240 128 128 | 0° 79% 72% | 0° 47% 94% |
| Łosoś | FA8072 | 250 128 114 | 6. 93% 71% | 6. 55% 98% |
| IndyjskiCzerwony | CD5C5C | 205 92 92 | 0° 53% 58% | 0° 55% 80% |
| Internet | FF0000 | 255 0 0 | 0° 100% 50% | 0° 100% 100% |
| Karmazynowy | DC143C | 220 20 60 | 348° 83% 47% | 348° 91% 86% |
| FireCegły | B22222 | 178 34 34 | 0° 68% 42% | 0° 81% 71% |
| brązowy | A52A2A | 165 42 42 | 0° 75% 65% | 0° 58% 91% |
| Ciemno czerwony | 8B0000 | 139 0 0 | 0° 100% 27% | 0° 100% 54% |
| brązowy | 800000 | 128 0 0 | 0° 100% 25% | 0° 100% 50% |
| różowe kolory | ||||
| mistyroza | FFE4E1 | 255 228 225 | 6. 100% 94% | 6. 12% 100% |
| Różowy | FFC0CB | 255 192 203 | 350° 100% 88% | 350° 24% 100% |
| Jasnoróżowy | FFB6C1 | 255 182 193 | 351° 100% 86% | 351° 28% 100% |
| Gorący róż | FF69B4 | 255 105 180 | 330° 100% 71% | 330° 58% 100% |
| różowobrązowy | BC8F8F | 188 143 143 | 0° 25% 65% | 0° 24% 74% |
| PaleVioletRed | DB7093 | 219 112 147 | 340° 60% 65% | 340° 49% 86% |
| Głęboki róż | FF1493 | 255 20 147 | 328° 100% 54% | 328° 92% 100% |
| ŚredniFioletowyCzerwony | C71585 | 199 21 133 | 322. 81% 43% | 322° 90% 78% |
| pomarańczowe kolory | ||||
| PapajaBicz | FFEFD5 | 255 239 213 | 37° 100% 92% | 37° 16% 100% |
| blanszowany migdał | FFEBCD | 255 235 205 | 36° 100% 90% | 36° 20% 100% |
| for | FFE4C4 | 255 228 196 | 33° 100% 88% | 33° 24% 100% |
| mokasyn | FFE4B5 | 255 228 181 | 38° 100% 85% | 38° 30% 100% |
| Brzoskwinia | FFDAB9 | 255 218 185 | 28° 100% 86% | 28° 28% 100% |
| NavajoBiały | FFDEAD | 255 222 173 | 36° 100% 84% | 36° 32% 100% |
| Jasnołosoś | FFA07A | 255 160 122 | 17. 100% 74% | 17. 52% 100% |
| DarkSalmon | E9967A | 233 150 122 | 15° 72% 70% | 15. 47% 92% |
| Pomarańczowy | FFA500 | 255 165 0 | 39° 100% 50% | 39° 100% 100% |
| Ciemna pomarańcza | FF8C00 | 255 140 0 | 33° 100% 50% | 33° 100% 100% |
| Koral | FF7F50 | 255 127 80 | 16. 100% 66% | 16. 68% 100% |
| pomidor | FF6347 | 255 99 71 | 9. 100% 64% | 9. 72% 100% |
| Pomarańczowy czerwony | FF4500 | 255 69 0 | 16° 100% 50% | 16° 100% 100% |
| brązowe kolory | ||||
| pszenica | F5DEB3 | 245 222 179 | 39° 77% 83% | 39° 27% 96% |
| BurlyWood | DEB887 | 222 184 135 | 34° 57% 70% | 34° 39% 87% |
| Więc | D2B48C | 210 180 140 | 34. 44% 69% | 34° 33% 83% |
| SandyBrown | F4A460 | 244 164 96 | 28° 87% 67% | 28° 60% 96% |
| złoty pręt | DAA520 | 218 165 32 | 43. 74% 49% | 43° 85% 85% |
| Peru | CD853F | 205 133 63 | 30° 59% 53% | 30° 69% 81% |
| DarkGoldenrod | B8860B | 184 134 11 | 43. 89% 38% | 43. 94% 72% |
| Czekolada | D2691E | 210 105 30 | 25° 75% 47% | 25° 86% 82% |
| Sjena | A0522D | 160 82 45 | 19. 56% 40% | 19. 72% 62% |
| SiodłoBrązowy | 8B4513 | 139 69 19 | 25° 76% 31% | 25° 86% 55% |
| żółte kolory | ||||
| Jasny zółty | FFFFE0 | 255 255 224 | 60° 100% 94% | 60° 12% 100% |
| kukurydziany | FFF8DC | 255 248 220 | 48° 100% 93% | 48° 14% 100% |
| CytrynaSzyfon | FFFACD | 255 250 205 | 54° 100% 90% | 54° 20% 100% |
| LightGoldenrodŻółty | FAFAD2 | 250 250 210 | 60° 80% 90% | 60° 16% 98% |
| PaleGoldenrod | EEE8AA | 238 232 170 | 55° 67% 80% | 55° 29% 93% |
| khaki | F0E68C | 240 230 140 | 54. 77% 75% | 54. 41% 94% |
| Żółty | FFFF00 | 255 255 0 | 60° 100% 50% | 60° 100% 100% |
| Złoto | FFD700 | 255 215 0 | 51° 100% 50% | 51° 100% 100% |
| DarkKhaki | BDB76B | 189 183 107 | 56° 38% 58% | 56° 43% 74% |
| żółtawo-zielone kolory | ||||
| Zielony żółty | ADFF2F | 173 255 47 | 84° 100% 59% | 84° 82% 100% |
| Chartreuse | 7FFF00 | 127 255 0 | 90° 100% 50% | 90° 100% 100% |
| TrawnikZielony | 7CFC00 | 124 252 0 | 90° 100% 49% | 90° 100% 98% |
| Żółty zielony | 9ACD32 | 154 205 50 | 80° 61% 50% | 80° 76% 81% |
| OliwkowyDrab | 6B8E23 | 107 142 35 | 80° 60% 35% | 80° 75% 56% |
| Oliwa | 808000 | 128 128 0 | 60° 100% 25% | 60° 100% 50% |
| CiemnooliwkowyZielony | 556B2F | 85 107 47 | 82° 39% 30% | 82. 56% 42% |
| zielone kolory | ||||
| Bladozielony | 98FB98 | 152 251 152 | 120° 93% 79% | 120° 40% 99% |
| Jasnozielony | 90EE90 | 144 238 144 | 120° 73% 75% | 120° 39% 93% |
| MediumSpringGreen | 00FA9A | 0 250 154 | 157° 100% 49% | 157° 100% 98% |
| Wiosenna zieleń | 00FF7F | 0 255 127 | 150° 100% 50% | 150° 100% 100% |
| Limonka | 00FF00 | 0 255 0 | 120° 100% 50% | 120° 100% 100% |
| DarkSeaGreen | 8FBC8F | 143 188 143 | 120° 25% 65% | 120° 24% 74% |
| Limonkowy | 32CD32 | 50 205 50 | 120° 61% 50% | 120° 76% 81% |
| MediumSeaGreen | 3CB371 | 60 179 113 | 147° 50% 47% | 147. 67% 71% |
| Zielone morze | 2E8B57 | 46 139 87 | 146° 50% 36% | 146° 67% 54% |
| Zielony las | 228B22 | 34 139 34 | 120° 61% 34% | 120° 76% 55% |
| Zielony | 008000 | 0 128 0 | 120° 100% 25% | 120° 100% 50% |
| Ciemnozielony | 006400 | 0 100 0 | 120° 100% 20% | 120° 100% 40% |
| Niebiesko-zielone kolory | ||||
| Jasnoniebieski | E0FFFF | 224 255 255 | 180° 100% 94% | 180° 12% 100% |
| PaleTurkusowy | AFEEEE | 175 238 238 | 180° 65% 81% | 180° 26% 93% |
| akwamaryn | 7FFFD4 | 127 255 212 | 160° 100% 75% | 160° 50% 100% |
| Aqua / Cyjan | 00FFFF | 0 255 255 | 180° 100% 50% | 180° 100% 100% |
| Turkus | 40E0D0 | 64 224 208 | 174° 72% 56% | 174° 72% 88% |
| Średni turkusowy | 48D1CC | 72 209 204 | 178° 60% 55% | 178° 66% 82% |
| Ciemnoturkusowy | 00CED1 | 0 206 209 | 181° 100% 82% | 181° 36% 100% |
| ŚredniAkwamaryn | 66CDAA | 102 205 170 | 160° 51% 60% | 160° 51% 80% |
| JasnomorskiZielony | 20B2AA | 32 178 170 | 177° 70% 41% | 177° 82% 70% |
| KadetNiebieski | 5F9EA0 | 95 158 160 | 182° 41% 63% | 182° 39% 78% |
| DarkCyan | 008B8B | 0 139 139 | 180° 100% 27% | 180° 100% 54% |
| cyraneczka | 008080 | 0 128 128 | 180° 100% 25% | 180° 100% 50% |
| niebieskie kolory | ||||
| lawenda | E6E6FA | 230 230 250 | 240° 67% 94% | 240° 8% 98% |
| niebieska sieć | CEE7FF | 206 231 255 | 209° 100% 90% | 209° 20% 100% |
| Pudrowy Niebieski | B0E0E6 | 176 224 230 | 187° 52% 80% | 187° 23% 90% |
| Jasny niebieski | ADD8E6 | 173 216 230 | 195° 53% 79% | 195° 25% 90% |
| JasnoNiebieski | 87CEFA | 135 206 250 | 203. 92% 75% | 203 47% 98% |
| niebieskie niebo | 87CEEB | 135 206 235 | 197. 71% 73% | 197. 42% 92% |
| LightSteelNiebieski | B0C4DE | 176 196 222 | 214. 41% 78% | 214. 21% 87% |
| DeepSkyBlue | 00BFFF | 0 191 255 | 195° 100% 50% | 195° 100% 100% |
| Chabrowy | 6495ED | 100 149 237 | 219. 79% 66% | 219. 58% 93% |
| DodgerNiebieski | 1E90FF | 30 144 255 | 210° 88% 100% | 210° 0% 100% |
| Stalowo - niebieski | 4682B4 | 70 130 180 | 207. 61% 71% | 207. 40% 89% |
| Królewski niebieski | 4169E1 | 65 105 225 | 225° 73% 57% | 225° 71% 88% |
| Niebieski | 0000FF | 0 0 255 | 240° 100% 100% | 240° 0% 100% |
| Średni niebieski | 0000CD | 0 0 205 | 240° 100% 80% | 240° 40% 100% |
| Ciemny niebieski | 00008B | 0 0 139 | 240° 100% 55% | 240° 90% 100% |
| Marynarka wojenna | 000080 | 0 0 128 | 240° 100% 50% | 240° 100% 100% |
| Niebieska północ | 191970 | 25 25 112 | 240° 78% 44% | 240° 88% 78% |
| Kolory fioletowy i fioletowy | ||||
| Oset | D8BFD8 | 216 191 216 | 300° 24% 80% | 300° 11% 85% |
| Śliwka | DDA0DD | 221 160 221 | 300° 47% 75% | 300° 27% 87% |
| fioletowy | EE82EE | 238 130 238 | 300° 76% 72% | 300° 46% 93% |
| orchidea | DA70D6 | 218 112 214 | 302. 59% 65% | 302. 48% 86% |
| Fuksja / Magenta | FF00FF | 255 0 255 | 300° 100% 50% | 300° 100% 100% |
| ŚredniFioletowy | 9370DB | 147 112 219 | 260° 60% 65% | 260° 49% 86% |
| Średnia Orchidea | BA55D3 | 186 85 211 | 288° 59% 58% | 288° 60% 83% |
| MediumSlateBlue | 7B68EE | 123 104 238 | 249° 80% 67% | 249. 57% 93% |
| Odcień niebieskiego | 6A5ACD | 106 90 205 | 248° 53% 58% | 248° 55% 80% |
| Niebieski Fioletowy | 8A2BE2 | 138 43 226 | 271. 76% 53% | 271. 81% 89% |
| Ciemnofioletowy | 9400D3 | 148 0 211 | 282° 100% 41% | 282° 100% 82% |
| DarkOrchid | 9932CC | 153 50 204 | 280° 61% 50% | 280° 76% 81% |
| DarkMagenta | 8B008B | 139 0 139 | 300° 100% 27% | 300° 100% 54% |
| Fioletowy | 800080 | 128 0 128 | 300° 100% 25% | 300° 100% 50% |
| DarkSlateBlue | 483D8B | 72 61 139 | 248° 39% 39% | 248° 56% 54% |
| Indygo | 4B0082 | 75 0 130 | 275° 100% 25% | 275° 100% 50% |
| białe kolory | ||||
| Biały | FFFFFF | 255 255 255 | —° 0% 100% | —° 0% 100% |
| Biały dym | F5F5F5 | 245 245 245 | —° 0% 96% | —° 0% 96% |
| Śnieg | FFFAFA | 255 250 250 | 0° 2% 100% | 0° 0% 100% |
| muszla morska | FFF5EE | 255 245 238 | 25° 100% 97% | 25° 6% 100% |
| Bielizna | FAF0E6 | 250 240 230 | 30° 67% 94% | 30° 8% 98% |
| Antyczna biel | FAEBD7 | 250 235 215 | 34° 78% 91% | 34° 14% 98% |
| staruszek | FDF5E6 | 253 245 230 | 39° 85% 95% | 39° 9% 99% |
| KwiatowyBiały | FFFAF0 | 255 250 240 | 40° 100% 97% | 40° 6% 100% |
| kość słoniowa | FFFFF0 | 255 255 240 | 60° 100% 97% | 60° 6% 100% |
| Beżowy | F5F5DC | 245 245 220 | 60° 56% 91% | 60° 10% 96% |
| spadzi | F0FFF0 | 240 255 240 | 120° 6% 100% | 120° 0% 100% |
| MiętowoKremowy | F5FFFA | 245 255 250 | 150° 4% 100% | 150° 0% 100% |
| Lazur | F0FFFF | 240 255 255 | 180° 6% 100% | 180° 0% 100% |
| AlicjaNiebieski | F0F8FF | 240 248 255 | 208° 100% 97% | 208° 6% 100% |
| GhostWhite | F8F8FF | 248 248 255 | 240° 100% 99% | 240° 2% 100% |
| LawendaRumień | FFF0F5 | 255 240 245 | 340° 100% 97% | 340° 6% 100% |
| szare kolory | ||||
| Gainsboro | DCDCDC | 220 220 220 | —° 0% 86% | —° 0% 86% |
| Jasnoszary | D3D3D3 | 211 211 211 | —° 0% 83% | —° 0% 83% |
| Srebro | C0C0C0 | 192 192 192 | —° 0% 75% | —° 0% 75% |
| Ciemny szary | A9A9A9 | 169 169 169 | —° 0% 66% | —° 0% 66% |
| Jasnoszary | 778899 | 119 136 153 | 210° 22% 60% | 210° 26% 69% |
| Popielaty | 708090 | 112 128 144 | 210° 22% 56% | 210° 29% 66% |
| Szary | 808080 | 128 128 128 | —° 0% 50% | —° 0% 50% |
| DimGray | 696969 | 105 105 105 | —° 0% 41% | —° 0% 41% |
| DarkSlateGray | 2F4F4F | 47 79 79 | 180° 25% 25% | 180° 40% 31% |
| Czarny | 000000 | 0 0 0 | —° 0% 0% | —° 0% 0% |
Zobacz także
Referencje
- ^ "Moduł kolorów CSS, poziom 4" . www.w3.org . Źródło 22 grudnia 2021 .
- ↑ CSS Color Module Poziom 3 Rekomendacja W3C 2011
- ↑ X11 Nazwy kolorów HTML Portal 2016
- ↑ Mozilla ColorNames.txt
- ↑ Skalowalna grafika wektorowa Nazwy kolorów 2015
- ↑ Kolory według nazwy dla Windows Internet Explorer 8, Microsoft 2016
Linki zewnętrzne
- Szesnastkowe kody kolorów (mikser).
- Kolory HTML (w języku angielskim) .
- Narzędzie do konwersji kodów kolorów: hex rgb hsl (w języku hiszpańskim) .
- Metodologia HTML.
- Selektor kolorów HTML
