H = hue, S = saturation, B = brightness
Základních 6 barev
grey | red | yellow | lime | aqua | blue | fuchsia |
---|---|---|---|---|---|---|
#333333 | #ff0000 | #ffff00 | #00ff00 | #00ffff | #0000ff | #ff00ff |
#808080 | #800000 | #808000 | #008000 | #008080 | #000080 | #800080 |
Barevné spektrum 12 barev
0 | 30 | 60 | 90 | 120 | 150 | 180 | 210 | 240 | 270 | 300 | 330 |
---|---|---|---|---|---|---|---|---|---|---|---|
#ff0000 | #ff8000 | #ffff00 | #80ff00 | #00ff00 | #00ff80 | #00ffff | #0080ff | #0000ff | #8000ff | #ff00ff | #ff0080 |
#800000 | #804000 | #808000 | #408000 | #008000 | #008040 | #008080 | #004080 | #000080 | #400080 | #800080 | #800040 |
6-koloráda
0 | 60 | 120 | 180 | 240 | 300 |
---|---|---|---|---|---|
#ff0000 | #ffff00 | #00ff00 | #00ffff | #0000ff | #ff00ff |
#800000 | #808000 | #008000 | #008080 | #000080 | #800080 |
30 | 90 | 150 | 210 | 270 | 330 |
---|---|---|---|---|---|
#ff8000 | #80ff00 | #00ff80 | #0080ff | #8000ff | #ff0080 |
#804000 | #408000 | #008040 | #004080 | #400080 | #800040 |
4-koloráda
0 | 90 | 180 | 270 |
---|---|---|---|
#ff0000 | #80ff00 | #00ffff | #8000ff |
#800000 | #408000 | #008080 | #400080 |
30 | 120 | 210 | 300 |
---|---|---|---|
#ff8000 | #00ff00 | #0080ff | #ff00ff |
#804000 | #008000 | #004080 | #800080 |
60 | 150 | 240 | 330 |
---|---|---|---|
#ffff00 | #00ff80 | #0000ff | #ff0080 |
#808000 | #008040 | #000080 | #800040 |
3-koloráda
0 | 120 | 240 |
---|---|---|
#ff0000 | #00ff00 | #0000ff |
#800000 | #008000 | #000080 |
30 | 150 | 270 |
---|---|---|
#ff8000 | #00ff80 | #8000ff |
#804000 | #008040 | #400080 |
60 | 180 | 300 |
---|---|---|
#ffff00 | #00ffff | #ff00ff |
#808000 | #008080 | #800080 |
90 | 210 | 330 |
---|---|---|
#80ff00 | #0080ff | #ff0080 |
#408000 | #004080 | #800040 |
2-koloráda – opozitní barvy
0 | 180 |
---|---|
#ff0000 | #00ffff |
#800000 | #008080 |
30 | 210 |
---|---|
#ff8000 | #0080ff |
#804000 | #004080 |
60 | 240 |
---|---|
#ffff00 | #0000ff |
#808000 | #000080 |
90 | 270 |
---|---|
#80ff00 | #8000ff |
#408000 | #400080 |
120 | 300 |
---|---|
#00ff00 | #ff00ff |
#008000 | #800080 |
150 | 330 |
---|---|
#00ff80 | #ff0080 |
#008040 | #800040 |
Odstíny šedi – grey
Hue: libovolné
S | B |
---|---|
0 | |
#ffffff HSB = 0, 0, 100 RGB = 255, 255, 255 |
100 |
#cccccc HSB = 0, 0, 80 RGB = 204, 204, 204 |
80 |
#999999 HSB = 0, 0, 60 RGB = 153, 153, 153 |
60 |
#666666 HSB = 0, 0, 40 RGB = 102, 102, 102 |
40 |
#333333 HSB = 0, 0, 20 RGB = 51, 51, 51 |
20 |
#000000 HSB = 0, 0, 0 RGB =0, 0, 0 |
0 |
Červená – red
#ff0000, hue: 0° = 360°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ffcccc HSB = 0, 20, 100 RGB = 255, 204, 204 |
#ffcccc HSB = 0, 40, 100 |
#ff6666 HSB = 0, 60, 100 |
#ff3333 HSB = 0, 80, 100 |
#ff0000 HSB = 0, 100, 100 |
100 | |||||
#cc9999 HSB = 0, 25, 80 RGB = 204, 153, 153 |
#cc6666 HSB = 0, 50, 80 |
#cc3333 HSB = 0, 75, 80 |
#cc0000 HSB = 0, 100, 80 |
80 | ||||||
#996666 HSB = 0, 33, 60 |
#993333 HSB = 0, 67, 60 |
#990000 HSB = 0, 100, 60 |
60 | |||||||
#663333 HSB = 0, 50, 40 |
#660000 HSB = 0, 100, 40 |
40 | ||||||||
#330000 HSB = 0, 100, 20 |
20 |
Oranžová
#ff8000, hue: 30°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ffe6cc HSB = 30, 20, 100 |
#ffcc99 HSB = 30, 40, 100 |
#ffb366 HSB = 30, 60, 100 |
#ff9933 HSB = 30, 80, 100 |
#ff8000 HSB = 30, 100, 100 |
100 | |||||
#ccb399 HSB = 30, 25, 80 |
#cc9966 HSB = 30, 50, 80 |
#cc8033 HSB = 30, 75, 80 |
#cc6600 HSB = 30, 100, 80 |
80 | ||||||
#998066 HSB = 30, 33, 60 |
#996633 HSB = 30, 67, 60 |
#994d00 HSB = 30, 100, 60 |
60 | |||||||
#664d33 HSB = 30, 50, 40 |
#663300 HSB = 30, 100, 40 |
40 | ||||||||
#331a00 HSB = 30, 100, 20 |
20 |
Žlutá – yellow
#ffff00, hue: 60°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ffffcc HSB = 60, 20, 100 |
#ffff99 HSB = 60, 40, 100 |
#ffff66 HSB = 60, 60, 100 |
#ffff33 HSB = 60, 80, 100 |
#ffff00 HSB = 60, 100, 100 |
100 | |||||
#cccc99 HSB = 60, 25, 80 |
#cccc66 HSB = 60, 50, 80 |
#cccc33 HSB = 60, 75, 80 |
#cccc00 HSB = 60, 100, 80 |
80 | ||||||
#999966 HSB = 60, 33, 60 |
#999933 HSB = 60, 67, 60 |
#999900 HSB = 60, 100, 60 |
60 | |||||||
#666633 HSB = 60, 50, 40 |
#666600 HSB = 60, 100, 40 |
40 | ||||||||
#333300 HSB = 60, 100, 20 |
20 |
Žluto-zelená
#80ff00, hue: 90°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#e6ffcc HSB = 90, 20, 100 |
#ccff99 HSB = 60, 40, 100 |
#b3ff66 HSB = 60, 60, 100 |
#99ff33 HSB = 60, 80, 100 |
#80ff00 HSB = 60, 100, 100 |
100 | |||||
#b3cc99 HSB = 60, 25, 80 |
#99cc66 HSB = 60, 50, 80 |
#80cc33 HSB = 60, 75, 80 |
#66cc00 HSB = 60, 100, 80 |
80 | ||||||
#809966 HSB = 60, 33, 60 |
#669933 HSB = 60, 67, 60 |
#4d9900 HSB = 60, 100, 60 |
60 | |||||||
#4d6633 HSB = 60, 50, 40 |
#336600 HSB = 60, 100, 40 |
40 | ||||||||
#1a3300 HSB = 60, 100, 20 |
20 |
Zelená – lime
#00ff00, hue: 120°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ccffcc HSB = 120, 20, 100 |
#99ff99 HSB = 120, 40, 100 |
#66ff66 HSB = 120, 60, 100 |
#33ff33 HSB = 120, 80, 100 |
#00ff00 HSB = 120, 100, 100 |
100 | |||||
#99cc99 HSB = 120, 25, 80 |
#66cc66 HSB = 120, 50, 80 |
#33cc33 HSB = 120, 75, 80 |
#00cc00 HSB = 120, 100, 80 |
80 | ||||||
#669966 HSB = 120, 33, 60 |
#339933 HSB = 120, 67, 60 |
#009900 HSB = 120, 100, 60 |
60 | |||||||
#336633 HSB = 120, 50, 40 |
#006600 HSB = 120, 100, 40/td> | 40 | ||||||||
#003300 HSB = 120, 100, 20 |
20 |
Zeleno-tyrkysová
#00ff80, hue: 150°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ccffe6 HSB = 150, 20, 100 |
#99ffcc HSB = 150, 40, 100 |
#66ffb3 HSB = 150, 60, 100 |
#33ff99 HSB = 150, 80, 100 |
#00ff80 HSB = 150, 100, 100 |
100 | |||||
#99ccb3 HSB = 150, 25, 80 |
#66cc99 HSB = 150, 50, 80 |
#33cc80 HSB = 150, 75, 80 |
#00cc66 HSB = 150, 100, 80 |
80 | ||||||
#669980 HSB = 150, 33, 60 |
#339966 HSB = 150, 67, 60 |
#00994d HSB = 150, 100, 60 |
60 | |||||||
#33664d HSB = 150, 50, 40 |
#006633 HSB = 150, 100, 40 |
40 | ||||||||
#00331a HSB = 150, 100, 20 |
20 |
Tyrkysová – aqua
#00ffff, hue: 180°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ccffff HSB = 180, 20, 100 |
#99ffff HSB = 180, 40, 100 |
#66ffff HSB = 180, 60, 100 |
#33ffff HSB = 180, 80, 100 |
#00ffff HSB = 180, 100, 100 |
100 | |||||
#99cccc HSB = 180, 25, 80 |
#66cccc HSB = 180, 50, 80 |
#33cccc HSB = 180, 75, 80 |
#00cccc HSB = 180, 100, 80 |
80 | ||||||
#669999 HSB = 180, 33, 60 |
#339999 HSB = 180, 67, 60 |
#009999 HSB = 180, 100, 60 |
60 | |||||||
#336666 HSB = 180, 50, 40 |
#006666 HSB = 180, 100, 40 |
40 | ||||||||
#003333 HSB = 180, 100, 20 |
20 |
Tyrkysovo-modrá
#0080ff, hue: 210°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#cce6ff HSB = 210, 20, 100 |
#99ccff HSB = 210, 40, 100 |
#66b3ff HSB = 210, 60, 100 |
#3399ff HSB = 210, 80, 100 |
#0080ff HSB = 210, 100, 100 |
100 | |||||
#99b3cc HSB = 210, 25, 80 |
#6699cc HSB = 210, 50, 80 |
#3380cc HSB = 210, 75, 80 |
#0066cc HSB = 210, 100, 80 |
80 | ||||||
#668099 HSB = 210, 33, 60 |
#336699 HSB = 210, 67, 60 |
#004d99 HSB = 210, 100, 60 |
60 | |||||||
#334d66 HSB = 210, 50, 40 |
#003366 HSB = 210, 100, 40 |
40 | ||||||||
#001a33 HSB = 210, 100, 20 |
20 |
Modrá – blue
#0000ff, hue: 240°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ccccff HSB = 240, 20, 100 |
#9999ff HSB = 240, 40, 100 |
#6666ff HSB = 240, 60, 100 |
#3333ff HSB = 240, 80, 100 |
#0000ff HSB = 240, 100, 100 |
100 | |||||
#9999cc HSB = 240, 25, 80 |
#6666cc HSB = 240, 50, 80 |
#3333cc HSB = 240, 75, 80 |
#0000cc HSB = 240, 100, 80 |
80 | ||||||
#666699 HSB = 240, 33, 60 |
#333399 HSB = 240, 67, 60 |
#000099 HSB = 240, 100, 60 |
60 | |||||||
#333366 HSB = 240, 50, 40 |
#000066 HSB = 240, 100, 40 |
40 | ||||||||
#000033 HSB = 240, 100, 20 |
20 |
Fialová
#8000ff, hue: 270°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#e6ccff HSB = 270, 20, 100 |
#cc99ff HSB = 270, 40, 100 |
#b366ff HSB = 270, 60, 100 |
#9933ff HSB = 270, 80, 100 |
#8000ff HSB = 270, 100, 100 |
100 | |||||
#b399cc HSB = 270, 25, 80 |
#9966cc HSB = 270, 50, 80 |
#8033cc HSB = 270, 75, 80 |
#6600cc HSB = 270, 100, 80 |
80 | ||||||
#806699 HSB = 270, 33, 60 |
#663399 HSB = 270, 67, 60 |
#4d0099 HSB = 270, 100, 60 |
60 | |||||||
#4d3366 HSB = 270, 50, 40 |
#330066 HSB = 270, 100, 40 |
40 | ||||||||
#1a0033 HSB = 270, 100, 20 |
20 |
Purpurová – fuchsia
#ff00ff, hue: 300°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ffccff HSB = 300, 20, 100 |
#ff99ff HSB = 300, 40, 100 |
#ff66ff HSB = 300, 60, 100 |
#ff33ff HSB = 300, 80, 100 |
#ff00ff HSB = 300, 100, 100 |
100 | |||||
#cc99cc HSB = 300, 25, 80/td> | #cc66cc HSB = 300, 50, 80 |
#cc33cc HSB = 300, 75, 80 |
#cc00cc HSB = 300, 100, 80 |
80 | ||||||
#996699 HSB = 300, 33, 60 |
#993399 HSB = 300, 67, 60 |
#990099 HSB = 300, 100, 60 |
60 | |||||||
#663366 HSB = 300, 50, 40 |
#660066 HSB = 300, 100, 40 |
40 | ||||||||
#330033 HSB = 300, 100, 20 |
20 |
Purpurovo–červená
#ff0080, hue: 330°
S | B | |||||||||
---|---|---|---|---|---|---|---|---|---|---|
20 | 25 | 33 | 40 | 50 | 60 | 67 | 75 | 80 | 100 | |
#ffcce6 HSB = 330, 20, 100 |
#ff99cc HSB = 330, 40, 100 |
#ff66b3 HSB = 330, 60, 100 |
#ff3399 HSB = 330, 80, 100 |
#ff0080 HSB = 330, 100, 100 |
100 | |||||
#cc99b3 HSB = 330, 25, 80/td> | #cc6699 HSB = 330, 50, 80 |
#cc3380 HSB = 330, 75, 80 |
#cc0066 HSB = 330, 100, 80 |
80 | ||||||
#996680 HSB = 330, 33, 60 |
#993366 HSB = 330, 67, 60 |
#99004d HSB = 330, 100, 60 |
60 | |||||||
#66334d HSB = 330, 50, 40 |
#660033 HSB = 330, 100, 40 |
40 | ||||||||
#33001a HSB = 330, 100, 20 |
20 |
Nejsou zde uvedeny veškeré webové barvy. Šlo mi hlavně o základní barevné odstíny a jejich varianty, které vzniknou po přidání černé či bílé, a to vše v rámci bezpečných webových barev. Nicméně nakonec jsem přidala i odstíny mezi (posun HUE po 30 stupních). Ráda tyto kombinace využívám. Barevné varianty se dostatečně od sebe liší.
Photoshop tyto barvy umí pěkně zobrazit při zaškrtnutí volby webových barev, Gimp bohužel ne…
Související články
Další informace
- Bezpečné barvy – jakpsatweb.cz
- HTML Color Names – w3schools.com
- Color Hex Color Codes – color-hex.com