SyX.cz - Tvorba www a webových aplikací
27.1.2012 0:51 | Autor: SyX
Přehled barev pro použití v HTML nebo CSS. Jmenné barvy, HEX barvy, RGB barvy.
Barev je ohromné množství. Když si vezmeme v úvahu to, že třeba v RGB zápisu se udává odstín tří barev, a to každá z nich má hodnotu 0 až 255. Z toho nám vyplývá příklad (256 proto, že i nula je barevná hodnota): 256 * 256 * 256 = 16 777 216 kombinací barev.
V HTML a CSS jsou některé běžně používané barvy pojmenované a jdou používat pouhým zápisem názvu, bez zbytečného přemýšlení HEX zápisu nebo dokonce RGB hodnot.
| Název barvy | HEX | RGB | Ukázka |
|---|---|---|---|
| AliceBlue | #F0F8FF | rgb(240, 248, 255) | |
| AntiqueWhite | #FAEBD7 | rgb(250, 235, 215) | |
| Aqua | #00FFFF | rgb(0, 255, 255) | |
| Aquamarine | #7FFFD4 | rgb(127, 255, 212) | |
| Azure | #F0FFFF | rgb(240, 255, 255) | |
| Beige | #F5F5DC | rgb(245, 245, 220) | |
| Bisque | #FFE4C4 | rgb(255, 228, 196) | |
| Black | #000000 | rgb(0, 0, 0) | |
| BlanchedAlmond | #FFEBCD | rgb(255, 235, 205) | |
| Blue | #0000FF | rgb(0, 0, 255) | |
| BlueViolet | #8A2BE2 | rgb(138, 43, 226) | |
| Brown | #A52A2A | rgb(165, 42, 42) | |
| BurlyWood | #DEB887 | rgb(222, 184, 135) | |
| CadetBlue | #5F9EA0 | rgb(95, 158, 160) | |
| Chartreuse | #7FFF00 | rgb(127, 255, 0) | |
| Chocolate | #D2691E | rgb(210, 105, 30) | |
| Coral | #FF7F50 | rgb(255, 127, 80) | |
| CornflowerBlue | #6495ED | rgb(100, 149, 237) | |
| Cornsilk | #FFF8DC | rgb(255, 248, 220) | |
| Crimson | #DC143C | rgb(220, 20, 60) | |
| Cyan | #00FFFF | rgb(0, 255, 255) | |
| DarkBlue | #00008B | rgb(0, 0, 139) | |
| DarkCyan | #008B8B | rgb(0, 139, 139) | |
| DarkGoldenRod | #B8860B | rgb(184, 134, 11) | |
| DarkGray | #A9A9A9 | rgb(169, 169, 169) | |
| DarkGrey | #A9A9A9 | rgb(169, 169, 169) | |
| DarkGreen | #006400 | rgb(0, 100, 0) | |
| DarkKhaki | #BDB76B | rgb(189, 183, 107) | |
| DarkMagenta | #8B008B | rgb(139, 0, 139) | |
| DarkOliveGreen | #556B2F | rgb(85, 107, 47) | |
| Darkorange | #FF8C00 | rgb(255, 140, 0) | |
| DarkOrchid | #9932CC | rgb(153, 50, 204) | |
| DarkRed | #8B0000 | rgb(139, 0, 0) | |
| DarkSalmon | #E9967A | rgb(233, 150, 122) | |
| DarkSeaGreen | #8FBC8F | rgb(143, 188, 143) | |
| DarkSlateBlue | #483D8B | rgb(72, 61, 139) | |
| DarkSlateGray | #2F4F4F | rgb(47, 79, 79) | |
| DarkSlateGrey | #2F4F4F | rgb(47, 79, 79) | |
| DarkTurquoise | #00CED1 | rgb(0, 206, 209) | |
| DarkViolet | #9400D3 | rgb(148, 0, 211) | |
| DeepPink | #FF1493 | rgb(255, 20, 147) | |
| DeepSkyBlue | #00BFFF | rgb(0, 191, 255) | |
| DimGray | #696969 | rgb(105, 105, 105) | |
| DimGrey | #696969 | rgb(105, 105, 105) | |
| DodgerBlue | #1E90FF | rgb(30, 144, 255) | |
| FireBrick | #B22222 | rgb(178, 34, 34) | |
| FloralWhite | #FFFAF0 | rgb(255, 250, 240) | |
| ForestGreen | #228B22 | rgb(34, 139, 34) | |
| Fuchsia | #FF00FF | rgb(255, 0, 255) | |
| Gainsboro | #DCDCDC | rgb(220, 220, 220) | |
| GhostWhite | #F8F8FF | rgb(248, 248, 255) | |
| Gold | #FFD700 | rgb(255, 215, 0) | |
| GoldenRod | #DAA520 | rgb(218, 165, 32) | |
| Gray | #808080 | rgb(128, 128, 128) | |
| Grey | #808080 | rgb(128, 128, 128) | |
| Green | #008000 | rgb(0, 128, 0) | |
| GreenYellow | #ADFF2F | rgb(173, 255, 47) | |
| HoneyDew | #F0FFF0 | rgb(240, 255, 240) | |
| HotPink | #FF69B4 | rgb(255, 105, 180) | |
| IndianRed | #CD5C5C | rgb(205, 92, 92) | |
| Indigo | #4B0082 | rgb(75, 0, 130) | |
| Ivory | #FFFFF0 | rgb(255, 255, 240) | |
| Khaki | #F0E68C | rgb(240, 230, 140) | |
| Lavender | #E6E6FA | rgb(230, 230, 250) | |
| LavenderBlush | #FFF0F5 | rgb(255, 240, 245) | |
| LawnGreen | #7CFC00 | rgb(124, 252, 0) | |
| LemonChiffon | #FFFACD | rgb(255, 250, 205) | |
| LightBlue | #ADD8E6 | rgb(173, 216, 230) | |
| LightCoral | #F08080 | rgb(240, 128, 128) | |
| LightCyan | #E0FFFF | rgb(224, 255, 255) | |
| LightGoldenRodYellow | #FAFAD2 | rgb(250, 250, 210) | |
| LightGray | #D3D3D3 | rgb(211, 211, 211) | |
| LightGrey | #D3D3D3 | rgb(211, 211, 211) | |
| LightGreen | #90EE90 | rgb(144, 238, 144) | |
| LightPink | #FFB6C1 | rgb(255, 182, 193) | |
| LightSalmon | #FFA07A | rgb(255, 160, 122) | |
| LightSeaGreen | #20B2AA | rgb(32, 178, 170) | |
| LightSkyBlue | #87CEFA | rgb(135, 206, 250) | |
| LightSlateGray | #778899 | rgb(119, 136, 153) | |
| LightSlateGrey | #778899 | rgb(119, 136, 153) | |
| LightSteelBlue | #B0C4DE | rgb(176, 196, 222) | |
| LightYellow | #FFFFE0 | rgb(255, 255, 224) | |
| Lime | #00FF00 | rgb(0, 255, 0) | |
| LimeGreen | #32CD32 | rgb(50, 205, 50) | |
| Linen | #FAF0E6 | rgb(250, 240, 230) | |
| Magenta | #FF00FF | rgb(255, 0, 255) | |
| Maroon | #800000 | rgb(128, 0, 0) | |
| MediumAquaMarine | #66CDAA | rgb(102, 205, 170) | |
| MediumBlue | #0000CD | rgb(0, 0, 205) | |
| MediumOrchid | #BA55D3 | rgb(186, 85, 211) | |
| MediumPurple | #9370D8 | rgb(147, 112, 216) | |
| MediumSeaGreen | #3CB371 | rgb(60, 179, 113) | |
| MediumSlateBlue | #7B68EE | rgb(123, 104, 238) | |
| MediumSpringGreen | #00FA9A | rgb(0, 250, 154) | |
| MediumTurquoise | #48D1CC | rgb(72, 209, 204) | |
| MediumVioletRed | #C71585 | rgb(199, 21, 133) | |
| MidnightBlue | #191970 | rgb(25, 25, 112) | |
| MintCream | #F5FFFA | rgb(245, 255, 250) | |
| MistyRose | #FFE4E1 | rgb(255, 228, 225) | |
| Moccasin | #FFE4B5 | rgb(255, 228, 181) | |
| NavajoWhite | #FFDEAD | rgb(255, 222, 173) | |
| Navy | #000080 | rgb(0, 0, 128) | |
| OldLace | #FDF5E6 | rgb(253, 245, 230) | |
| Olive | #808000 | rgb(128, 128, 0) | |
| OliveDrab | #6B8E23 | rgb(107, 142, 35) | |
| Orange | #FFA500 | rgb(255, 165, 0) | |
| OrangeRed | #FF4500 | rgb(255, 69, 0) | |
| Orchid | #DA70D6 | rgb(218, 112, 214) | |
| PaleGoldenRod | #EEE8AA | rgb(238, 232, 170) | |
| PaleGreen | #98FB98 | rgb(152, 251, 152) | |
| PaleTurquoise | #AFEEEE | rgb(175, 238, 238) | |
| PaleVioletRed | #D87093 | rgb(216, 112, 147) | |
| PapayaWhip | #FFEFD5 | rgb(255, 239, 213) | |
| PeachPuff | #FFDAB9 | rgb(255, 218, 185) | |
| Peru | #CD853F | rgb(205, 133, 63) | |
| Pink | #FFC0CB | rgb(255, 192, 203) | |
| Plum | #DDA0DD | rgb(221, 160, 221) | |
| PowderBlue | #B0E0E6 | rgb(176, 224, 230) | |
| Purple | #800080 | rgb(128, 0, 128) | |
| Red | #FF0000 | rgb(255, 0, 0) | |
| RosyBrown | #BC8F8F | rgb(188, 143, 143) | |
| RoyalBlue | #4169E1 | rgb(65, 105, 225) | |
| SaddleBrown | #8B4513 | rgb(139, 69, 19) | |
| Salmon | #FA8072 | rgb(250, 128, 114) | |
| SandyBrown | #F4A460 | rgb(244, 164, 96) | |
| SeaGreen | #2E8B57 | rgb(46, 139, 87) | |
| SeaShell | #FFF5EE | rgb(255, 245, 238) | |
| Sienna | #A0522D | rgb(160, 82, 45) | |
| Silver | #C0C0C0 | rgb(192, 192, 192) | |
| SkyBlue | #87CEEB | rgb(135, 206, 235) | |
| SlateBlue | #6A5ACD | rgb(106, 90, 205) | |
| SlateGray | #708090 | rgb(112, 128, 144) | |
| SlateGrey | #708090 | rgb(112, 128, 144) | |
| Snow | #FFFAFA | rgb(255, 250, 250) | |
| SpringGreen | #00FF7F | rgb(0, 255, 127) | |
| SteelBlue | #4682B4 | rgb(70, 130, 180) | |
| Tan | #D2B48C | rgb(210, 180, 140) | |
| Teal | #008080 | rgb(0, 128, 128) | |
| Thistle | #D8BFD8 | rgb(216, 191, 216) | |
| Tomato | #FF6347 | rgb(255, 99, 71) | |
| Turquoise | #40E0D0 | rgb(64, 224, 208) | |
| Violet | #EE82EE | rgb(238, 130, 238) | |
| Wheat | #F5DEB3 | rgb(245, 222, 179) | |
| White | #FFFFFF | rgb(255, 255, 255) | |
| WhiteSmoke | #F5F5F5 | rgb(245, 245, 245) | |
| Yellow | #FFFF00 | rgb(255, 255, 0) | |
| YellowGreen | #9ACD32 | rgb(154, 205, 50) |
Přidržením kurzoru nad narvou se Vám zobrazí kód barvy pod Vaším kurzorem.
Následující barvy jsou podle standardu W3C bezpečné. Jen podotýkám, že většinu pojmenovaných barev níže zde nenajdete, což sám také nechápu.
| #000000 | #000033 | #000066 | #000099 | #0000CC | #0000FF |
| #003300 | #003333 | #003366 | #003399 | #0033CC | #0033FF |
| #006600 | #006633 | #006666 | #006699 | #0066CC | #0066FF |
| #009900 | #009933 | #009966 | #009999 | #0099CC | #0099FF |
| #00CC00 | #00CC33 | #00CC66 | #00CC99 | #00CCCC | #00CCFF |
| #00FF00 | #00FF33 | #00FF66 | #00FF99 | #00FFCC | #00FFFF |
| #330000 | #330033 | #330066 | #330099 | #3300CC | #3300FF |
| #333300 | #333333 | #333366 | #333399 | #3333CC | #3333FF |
| #336600 | #336633 | #336666 | #336699 | #3366CC | #3366FF |
| #339900 | #339933 | #339966 | #339999 | #3399CC | #3399FF |
| #33CC00 | #33CC33 | #33CC66 | #33CC99 | #33CCCC | #33CCFF |
| #33FF00 | #33FF33 | #33FF66 | #33FF99 | #33FFCC | #33FFFF |
| #660000 | #660033 | #660066 | #660099 | #6600CC | #6600FF |
| #663300 | #663333 | #663366 | #663399 | #6633CC | #6633FF |
| #666600 | #666633 | #666666 | #666699 | #6666CC | #6666FF |
| #669900 | #669933 | #669966 | #669999 | #6699CC | #6699FF |
| #66CC00 | #66CC33 | #66CC66 | #66CC99 | #66CCCC | #66CCFF |
| #66FF00 | #66FF33 | #66FF66 | #66FF99 | #66FFCC | #66FFFF |
| #990000 | #990033 | #990066 | #990099 | #9900CC | #9900FF |
| #993300 | #993333 | #993366 | #993399 | #9933CC | #9933FF |
| #996600 | #996633 | #996666 | #996699 | #9966CC | #9966FF |
| #999900 | #999933 | #999966 | #999999 | #9999CC | #9999FF |
| #99CC00 | #99CC33 | #99CC66 | #99CC99 | #99CCCC | #99CCFF |
| #99FF00 | #99FF33 | #99FF66 | #99FF99 | #99FFCC | #99FFFF |
| #CC0000 | #CC0033 | #CC0066 | #CC0099 | #CC00CC | #CC00FF |
| #CC3300 | #CC3333 | #CC3366 | #CC3399 | #CC33CC | #CC33FF |
| #CC6600 | #CC6633 | #CC6666 | #CC6699 | #CC66CC | #CC66FF |
| #CC9900 | #CC9933 | #CC9966 | #CC9999 | #CC99CC | #CC99FF |
| #CCCC00 | #CCCC33 | #CCCC66 | #CCCC99 | #CCCCCC | #CCCCFF |
| #CCFF00 | #CCFF33 | #CCFF66 | #CCFF99 | #CCFFCC | #CCFFFF |
| #FF0000 | #FF0033 | #FF0066 | #FF0099 | #FF00CC | #FF00FF |
| #FF3300 | #FF3333 | #FF3366 | #FF3399 | #FF33CC | #FF33FF |
| #FF6600 | #FF6633 | #FF6666 | #FF6699 | #FF66CC | #FF66FF |
| #FF9900 | #FF9933 | #FF9966 | #FF9999 | #FF99CC | #FF99FF |
| #FFCC00 | #FFCC33 | #FFCC66 | #FFCC99 | #FFCCCC | #FFCCFF |
| #FFFF00 | #FFFF33 | #FFFF66 | #FFFF99 | #FFFFCC | #FFFFFF |
Chcete mít vlastní web? Vytvořím Vám Vaši vlastní www stránku či webovou aplikaci dle Vašich představ. Časově přívětivě, cenově dostupně.
KontaktJste firma nebo živnostník pracující v oblasti tvorby www? Nebráním se žádné spolupráci jak s grafickými studii, tak ani s jinými firmami či živnostníky. Pracuji externě ze svého domova, ale osobní setkání není problém.
podtržený text, ale tečkovaný
˜ PsYcHo, 22.1.2012 21:43
Jak změnit barvu pozadí? (testovací téma)
˜ Neregistrovaný, 19.12.2011 11:49
Jak změnit barvu pozadí? (testovací téma)
˜ SyX, 17.12.2011 17:10
První pokus
˜ Neregistrovaný, 28.1.2012 9:22
První pokus
˜ SyX, 17.12.2011 15:11
