Wikipedia

Pomoc:Kolory

Skocz poniżej nawigacji.

Dla zaawansowanych
Te informacje dotyczą edytora wikikodu. Brak analogicznych dotyczących edytora wizualnego (Czym to się różni?)

Kolory w Wikipedii są wykorzystywane głównie w szablonach i innych metastronach. Kolorowanie wprost w artykułach spotyka się bardzo rzadko, dlatego umiejętność ustawiania kolorów w kodzie źródłowym jest uznawana za umiejętności zaawansowane i nie jest wymagana od każdego autora Wikipedii.

Subiektywność postrzegania

edytuj

Wiele zmiennych zadecyduje o postrzeganym kolorze, samym wyborze barwy i rzeczywistym oddaniu jej na rozmaitych ekranach, w tym natężenie światła w pomieszczeniu czy światła okolicznego na zewnątrz, w przypadku użytkowania telefonu, urządzenia kieszonkowego czy laptopa.

Niezależnie od tego ludzie różnią się w zdolności postrzegania barw. Zasadniczo duża część osób jest kolorystycznie mniej czuła na różnice kolorów od normy dla ogółu, a nawet nie odbiera różnic w przypadku postrzeganych odcieni.

Tabele kolorów

edytuj

Kolory Wikipedii

edytuj

Istnieją kolory o specjalnym znaczeniu, które są wbudowane w oprogramowanie MediaWiki. Zdefiniowane nazwy kolorów mają znaczenie semantyczne np. var(--color-error) powinien być używany do błędów, a var(--border-color-base) do kolorów ogólnych ramek. Wartości te zmieniają się w zależności od wybranego przez użytkownika motywu (tryb nocny lub dzienny) i mogą się z czasem dostosowywać się do zmian w oprogramowaniu Wikipedii. To dlatego używanie tych kolorów jest zalecane do konstruowania szablonów, gadżetów itp.

Listę wbudowanych kolorów znajdziesz na stronie: Pomoc:Tryb ciemny#Korzystanie ze zmiennych CSS

Kolory nazywane

edytuj

Zestawienie nazw barw[1]

Nazwa barwy
(HTML/CSS) 		Wartość barwy
(jasność składowych R G B)
szesnastkowo dziesiętnie
Barwy czerwone
IndianRed CD5C5C 205 92 92
LightCoral F08080 240 128 128
Salmon FA8072 250 128 114
DarkSalmon E9967A 233 150 122
LightSalmon FFA07A 255 160 122
Crimson DC143C 220 20 60
Red FF0000 255 0 0
FireBrick B22222 178 34 34
DarkRed 8B0000 139 0 0
Barwy różowe
Pink FFC0CB 255 192 203
LightPink FFB6C1 255 182 193
HotPink FF69B4 255 105 180
DeepPink FF1493 255 20 147
MediumVioletRed C71585 199 21 133
PaleVioletRed DB7093 219 112 147
Barwy pomarańczowe
LightSalmon FFA07A 255 160 122
Coral FF7F50 255 127 80
Tomato FF6347 255 99 71
OrangeRed FF4500 255 69 0
DarkOrange FF8C00 255 140 0
Orange FFA500 255 165 0
Barwy żółte
Gold FFD700 255 215 0
Yellow FFFF00 255 255 0
LightYellow FFFFE0 255 255 224
LemonChiffon FFFACD 255 250 205
LightGoldenrodYellow FAFAD2 250 250 210
PapayaWhip FFEFD5 255 239 213
Moccasin FFE4B5 255 228 181
PeachPuff FFDAB9 255 218 185
PaleGoldenrod EEE8AA 238 232 170
Khaki F0E68C 240 230 140
DarkKhaki BDB76B 189 183 107
Odcienie fioletu i purpury
Lavender E6E6FA 230 230 250
Thistle D8BFD8 216 191 216
Plum DDA0DD 221 160 221
Violet EE82EE 238 130 238
Orchid DA70D6 218 112 214
Fuchsia FF00FF 255 0 255
Magenta FF00FF 255 0 255
MediumOrchid BA55D3 186 85 211
MediumPurple 9370DB 147 112 219
BlueViolet 8A2BE2 138 43 226
DarkViolet 9400D3 148 0 211
DarkOrchid 9932CC 153 50 204
DarkMagenta 8B008B 139 0 139
Purple 800080 128 0 128
Indigo 4B0082 75 0 130
SlateBlue 6A5ACD 106 90 205
DarkSlateBlue 483D8B 72 61 139
MediumSlateBlue 7B68EE 123 104 238
Nazwa barwy
(HTML/CSS) 		Wartość barwy
(jasność składowych R G B)
szesnastkowo dziesiętnie
Barwy zielone
GreenYellow ADFF2F 173 255 47
Chartreuse 7FFF00 127 255 0
LawnGreen 7CFC00 124 252 0
Lime 00FF00 0 255 0
LimeGreen 32CD32 50 205 50
PaleGreen 98FB98 152 251 152
LightGreen 90EE90 144 238 144
MediumSpringGreen 00FA9A 0 250 154
SpringGreen 00FF7F 0 255 127
MediumSeaGreen 3CB371 60 179 113
SeaGreen 2E8B57 46 139 87
ForestGreen 228B22 34 139 34
Green 008000 0 128 0
DarkGreen 006400 0 100 0
YellowGreen 9ACD32 154 205 50
OliveDrab 6B8E23 107 142 35
Olive 808000 128 128 0
DarkOliveGreen 556B2F 85 107 47
MediumAquamarine 66CDAA 102 205 170
DarkSeaGreen 8FBC8F 143 188 143
LightSeaGreen 20B2AA 32 178 170
DarkCyan 008B8B 0 139 139
Teal 008080 0 128 128
Barwy niebieskie
Aqua 00FFFF 0 255 255
Cyan 00FFFF 0 255 255
LightCyan E0FFFF 224 255 255
PaleTurquoise AFEEEE 175 238 238
Aquamarine 7FFFD4 127 255 212
Turquoise 40E0D0 64 224 208
MediumTurquoise 48D1CC 72 209 204
DarkTurquoise 00CED1 0 206 209
CadetBlue 5F9EA0 95 158 160
SteelBlue 4682B4 70 130 180
LightSteelBlue B0C4DE 176 196 222
PowderBlue B0E0E6 176 224 230
LightBlue ADD8E6 173 216 230
SkyBlue 87CEEB 135 206 235
LightSkyBlue 87CEFA 135 206 250
DeepSkyBlue 00BFFF 0 191 255
DodgerBlue 1E90FF 30 144 255
CornflowerBlue 6495ED 100 149 237
MediumSlateBlue 7B68EE 123 104 238
RoyalBlue 4169E1 65 105 225
Blue 0000FF 0 0 255
MediumBlue 0000CD 0 0 205
DarkBlue 00008B 0 0 139
Navy 000080 0 0 128
MidnightBlue 191970 25 25 112
Nazwa barwy
(HTML/CSS) 		Wartość barwy
(jasność składowych R G B)
szesnastkowo dziesiętnie
Barwy brunatne
Cornsilk FFF8DC 255 248 220
BlanchedAlmond FFEBCD 255 235 205
Bisque FFE4C4 255 228 196
NavajoWhite FFDEAD 255 222 173
Wheat F5DEB3 245 222 179
BurlyWood DEB887 222 184 135
Tan D2B48C 210 180 140
RosyBrown BC8F8F 188 143 143
SandyBrown F4A460 244 164 96
Goldenrod DAA520 218 165 32
DarkGoldenrod B8860B 184 134 11
Peru CD853F 205 133 63
Chocolate D2691E 210 105 30
SaddleBrown 8B4513 139 69 19
Sienna A0522D 160 82 45
Brown A52A2A 165 42 42
Maroon 800000 128 0 0
Odcienie bieli
White FFFFFF 255 255 255
Snow FFFAFA 255 250 250
Honeydew F0FFF0 240 255 240
MintCream F5FFFA 245 255 250
Azure F0FFFF 240 255 255
AliceBlue F0F8FF 240 248 255
GhostWhite F8F8FF 248 248 255
WhiteSmoke F5F5F5 245 245 245
Seashell FFF5EE 255 245 238
Beige F5F5DC 245 245 220
OldLace FDF5E6 253 245 230
FloralWhite FFFAF0 255 250 240
Ivory FFFFF0 255 255 240
AntiqueWhite FAEBD7 250 235 215
Linen FAF0E6 250 240 230
LavenderBlush FFF0F5 255 240 245
MistyRose FFE4E1 255 228 225
Odcienie szarości
Gainsboro DCDCDC 220 220 220
LightGrey D3D3D3 211 211 211
Silver C0C0C0 192 192 192
DarkGray A9A9A9 169 169 169
Gray 808080 128 128 128
DimGray 696969 105 105 105
LightSlateGray 778899 119 136 153
SlateGray 708090 112 128 144
DarkSlateGray 2F4F4F 47 79 79
Black 000000 0 0 0


Gamma

edytuj

Podstawowym kalibracyjnym pojęciem jest korekcja gamma[2] Zmiany w gammie powodują, czy treść graficzna wygląda na zaciemnioną czy inaczej niedobrana kolorystycznie. Rożne systemy komputerowe czy wyświetlacze operują na innej wartości gammy, lub właściwości korekcji gammy są zakodowane w ustawieniach kalibracji przestrzeni barw czy kalibracji koloru urządzenia. Kolorystycznie wykalibrowana grafika wymaga zmiany gamma przy przenoszeniu jej do wyświetlenia na kolejne nośniki komputerowe czy w kolejnych wyświetlaczach precyzyjnie.

Składowe koloru

edytuj

Oprócz gammy, rozmaite metody przekazują numerycznie kolor danej barwy. Istnieje także możliwość oddania stopnia przezroczystości grafiki czy koloru, czyli wartość tzw. kanału alfa.

Podstawowym systemem do wyrażania barw na komputerze jest absolutna przestrzeń barw o nazwie sRGB. Stanowi ona referencyjną przestrzeń dla HTML i CSS. Istnieją pokrewne, alternatywne, lepiej dostosowane do konkretnych zapotrzebowań graficznych np. Adobe RGB[3] ustalona przez grafików Adobe Systems. Szerzej, RGB to cały system wyrażania barwy trzema składowymi: czerwienią, zielenią i niebieskością. Tradycyjnie piksele ekranów składają się z fosforu świecącego mniej lub bardziej jasno w tylko jednej z tych trzech składowych.

W świecie drukarskim (poligrafii), podobna rolę odgrywa system CMYK, gdzie barwy są wyrażone składowymi cyjanu, magenty, żółci, i czerni.

Istnieją także inne metody specyfikacji barwy, np. HSL, czy znormalizowane przestrzenie mające na celu wyrażenie różnic pomiędzy barwami, czyli metryką delta E. Są to m.in. CIELUV czy CIELab, często stosowanych do porównania barw dla współrzędnych z kolei wyrażonych w przestrzeni CIE xyY, jak w przypadku ustawy o Barwach RP.

W pewnych nowych technologiach wyświetlaczy (OLED), światło jest emitowane za pośrednictwem diod elektroluminescencyjnych, a same wyświetlacze, drukowane niby gazety. Można przyjąć, że odmienne notacje kolorów pojawią się m.in. z powodu zaistnienia nowych metod wyświetlania barw.

Zestawienie kolorów

edytuj

Dane podstawowe

edytuj

Zazwyczaj kolory oddajemy w RGB. Jest to również najprostszy i najbardziej zwarty zapis barwy, np. #aaa czy LightGray. Poniżej podane są dwa osobne zestawienia „bezpiecznych” barw, które to zalecamy stosować m.in. do kolorowania tabel.

Pierwsza jest wynikiem zalecenia organizacji formułującej standardy sieciowe, utworzonej przez twórców sieci WWW i korporacje komputerowe: konsorcjum W3C.

Druga jest tradycyjnie używanym zdroworozsądkowym ograniczeniem do zaokrąglonych wartości barw[4]. Te zaokrąglenia to tradycyjnie uznawane „bezpieczne kolory w sieci”, heurystycznie stosowane tradycyjnie, na długo przed sformułowaniem w 1999 ustaleń w tym temacie przez W3C, przyjętych przy okazji sformułowania formalnej specyfikacji dla grafiki wektorowej, SVG, a następnej jej minimalistycznej zalecanej implementacji, SVG Tiny.

Jednak same te nazwy i wybór barw jest znacznie starszym dziejowo, bowiem wywodzi się z Projektu Athena, utworzony w 1983 na Massachusetts Institute of Technology, kiedy to skodyfikowano system interfejsu graficznego X Windows. Pomiędzy wtedy i teraźniejszością, systematyką barw „logicznych” opiekowali się oprócz społeczności X Windows przede wszystkim inżynierowie Microsoftu, wdrażając je żywcem jako pierwsi do przeglądarki Internet Explorer komercyjnie.

Specyfikacje SVG 1.1 i SVG Tiny 1.1 po prostu utrwalają te tradycje, nadając możliwość kombinowania i stosowania barw jako jednostek logicznych w nowoczesnych urządzeniach i oprogramowaniu.

Barwy według ustaleń dla SVG przez W3C rzekomo mają działać we wszystkich przeglądarkach, niezależnie od ustawień ekranu przez użytkownika czy limitacji sprzętowych.

Natomiast zaokrąglenia tradycyjne po prostu rozrzucają barwy wystarczająco daleko od siebie, aby były one zazwyczaj odróżniane. Jednak przestrzeń numeryczna RGB nie stanowi absolutnej przestrzeni barw. (Przykładem takowej jest sRGB.) Również, nie nadaje się ani ona ani np. sRGB czy Adobe RGB do porównywania odległości pomiędzy barwami, to jest ich różnic, jak to je postrzega ludzkie oko. Po prostu nie można porównać dowolnych dwóch wartości RGB czy ich różnic (nawet zaokrąglonych) jako różnic postrzeganych przez ludzi równomiernie.

W tym celu ustalono znormalizowane względem ludzkiej percepcji i oka przestrzenie CIELab i CIELUV oraz metrykę Delta E, oraz coraz to nowsze, dokładniejsze kolorymetryczne narzędzia.

Jednak zaistnienie i przetrwanie nazw dla barw dodatkowo pozwala na wskazanie ich zrozumiale, oraz na wykrycie literówki nie sposób do zauważenia gołym okiem w kodzie liczbowym. Nazwy kolorów także pozwalają na ich powielenie mnemonicznie, kiedy nie ma możliwości korzystania z kopiuj-wklej.

Inne metody (profesjonalne)

edytuj

Dla pełności opisu sprawy, nowoczesne metody wyszczególnienia barw wywodzą się ze środowisk technicznych grafików i drukarzy, oraz inżynierów od konstrukcji drukarek komputerowych w Adobe Systems (twórców PostScriptu) czy od telewizji analogowej/cyfrowej, czy nawet artystów w szkle, plakacie i fotografii, oraz techników od kolorymetrii, w przeciwieństwie do społeczności programistów i deweloperów przeglądarek sieciowych. Nie są to tylko numerki trzech składowych RGB, czy logiczne nazwy historycznego zbioru powstałego na MIT.

Np. specyfikacja HTML 5 ma zawierać, a obecne specyfikacje SVG 1.1 i SVG Tiny 1.1 już zawierają, możliwość określenia barwy składowymi dziesiętnymi, czy procentowo, czy arbitralnie precyzyjnymi wartościami liczb w przedziale 0..1. Notacje te są wykonane z uwzględnieniem kanału „alfa”, czyli stopnia przezroczystości. Przykładem tu będzie wektor lekko prześwitującej bieli wyrażonej składowymi dziesiętnymi:

  • rgba(255,255,255,0.8), alternatywnie to samo:
  • rgba(100%,100%,100%,0.8).

Inne ścisłe systemy opisu barwy, np. metodą HSL (ang. od Hue, Saturation, Luminance), są także zaimplementowane (także w MediaWiki, jak i przetwarzane poprawnie przez nowoczesne przeglądarki zgodnie ze specyfikacjami SVG czy SVG Tiny).

Korzyści wypływające z takiej metody barwienia to m.in. naprowadzanie na pożądaną barwę z pobliskiej w miarę intuicyjnie, przez wykonanie „suwakowych” zmian w natężeniu, jasności czy odcieniu, lub dwoma albo nawet wszystkimi trzema na raz. W praktyce bywa to skuteczniejszym od przesuwania sobie podobnych suwaków RGB po przestrzeniach barw, gdzie zazwyczaj występują nieliniowe „uskoki” percepcyjne w kolorze. Sprawy te są naświetlone w specyfikacjach W3C oraz komentarzach udzielonych tamże[5], jak i w artykule Wikipedii o HSL w wersji anglojęzycznej[6].

Zobacz też

edytuj

Przypisy

edytuj
  1. ↑ według specyfikacji W3C ('CSS3: Color Module, X11 color names
  2. ↑ Korekcja gamma opisana wyczerpująco w anglojęzycznej wersji artykułu, en:Gamma correction.
  3. ↑ W wersji angielskiej Wikipedii: en:Adobe RGB color space
  4. ↑ wartości wyrażone w notacji RGB w szesnastkowym systemie liczbowym (wyrażonym skrótowo 3 cyframi z domyślnymi powtórzeniami w co drugim miejscu, zamiast wszystkich 6 cyfr dla po kolei: R (czerwony), G (zielony), B (niebieski))
  5. ↑ Tantek Çelik (Microsoft) <tantekc@microsoft.com>: CSS3 Module: Color — Disposition of Comments. [w:] CSS3 Module [on-line]. W3C, 2003-04-14. [dostęp 2009-02-16]. (ang.).
  6. ↑ en:HSL
Źródło: „https://pl.wikipedia.org/w/index.php?title=Pomoc:Kolory&oldid=75619307”