Colores web para niños
Los colores web son los colores que ves en las páginas web. Estos colores se crean usando sistemas especiales, como el modelo de color RGB o el HSL. En el código de las páginas, como en CSS (y antes en HTML), los colores se escriben con números. También se pueden usar algunos nombres en inglés para los colores.
Contenido
Colores Web: ¿Cómo Funcionan?
Los colores en las pantallas de computadoras y celulares se forman mezclando luces de diferentes colores. Esto es diferente a cómo se mezclan las pinturas.
El Sistema de Colores RGB: Luz y Números
El sistema RGB es uno de los más usados para los colores en la web. RGB significa Rojo, Gverde y Bazul. Estos son los tres colores de luz principales que, al mezclarse, pueden crear casi cualquier otro color.
¿Qué son los Colores Primarios Aditivos?
Los colores primarios aditivos son:
- Rojo
- Verde
- Azul
Cuando hablamos de colores web, cada uno de estos colores (rojo, verde, azul) se representa con un número en hexadecimal. Este número tiene seis dígitos, como #FF0000 para el rojo puro. Los dos primeros dígitos son para el rojo, los dos siguientes para el verde y los últimos dos para el azul.
Cada par de dígitos hexadecimales puede ir desde "00" (que significa nada de ese color) hasta "FF" (que significa la máxima cantidad de ese color). Por ejemplo, "FF" es como 255 en nuestro sistema de números normal.
¿Cómo se Forman Otros Colores con RGB?
- Si mezclas los tres colores primarios (rojo, verde y azul) al máximo (FF FF FF), obtienes el blanco.
- Si no pones nada de ninguno de los tres colores (00 00 00), obtienes el negro.
- Si mezclas los tres colores en una cantidad media (como 80 80 80), obtienes un gris medio.
También existen otros colores importantes que se forman mezclando los primarios:
- Cian (Verde + Azul)
- Magenta (Azul + Rojo)
- Amarillo (Rojo + Verde)
Estos son los colores que se usan en las impresoras, por ejemplo.
¿Cuántos Colores RGB Existen?
Con el sistema RGB de 24 bits, se pueden crear más de 16 millones de colores diferentes. Esto es porque hay 256 niveles para el rojo, 256 para el verde y 256 para el azul (256 x 256 x 256 = 16,777,216). ¡Es una cantidad enorme de colores!
El Sistema de Colores HSL: Tono, Saturación y Luminosidad
El sistema HSL es otra forma de describir los colores. Se basa en tres cosas:
- Hue (Tono): Es el color en sí, como rojo, azul o verde. Se mide en grados, como en un círculo de colores (0° es rojo, 120° es verde, 240° es azul).
- Saturation (Saturación): Indica qué tan puro o intenso es un color. Un color con mucha saturación es muy vivo, mientras que uno con poca saturación se ve más grisáceo.
- Lightness (Luminosidad): Dice qué tan claro u oscuro es un color. Una luminosidad del 0% es negro, y una del 100% es blanco.
El Parámetro Alfa: Colores Transparentes
Además de RGB o HSL, los colores web pueden tener un valor "alfa". Este valor controla la opacidad del color. Si un color tiene un valor alfa bajo, será más transparente y podrás ver lo que hay detrás. Si tiene un valor alfa alto, será completamente sólido.
Nombres y Códigos de Colores: ¡Cuidado con las Diferencias!
A veces, un mismo nombre de color puede tener un código diferente, o un mismo código puede tener varios nombres. Esto puede pasar entre distintos sistemas o programas. Por ejemplo:
| Nombre | Colores X11 | W3C / CSS / HTML / VGA |
||
|---|---|---|---|---|
| Código hex | Muestra | Muestra | Código hex | |
| Gray - Gris | #BEBEBE | #808080 | ||
| Green - Verde | #00FF00 | #008000 | ||
| Nombre X11 | Color | Nombre W3C / CSS / HTML / VGA |
|
|---|---|---|---|
| Código hex | Muestra | ||
| Gray - Gris | #C0C0C0 | Silver - Plateado | |
| Fuchsia - Fucsia | #FF00FF | Magenta | |
Tabla de Colores Web Comunes
Aquí tienes una tabla con algunos de los colores web más usados, con sus nombres y códigos en diferentes sistemas:
| Nombre HTML | Código hex | Valores RGB |
Valores HSL |
Valores HSV |
|---|---|---|---|---|
| Colores rojos | ||||
| LightCoral | F08080 | 240 128 128 | 0° 79% 72% | 0° 47% 94% |
| Salmon | FA8072 | 250 128 114 | 6° 93% 71% | 6° 55% 98% |
| IndianRed | CD5C5C | 205 92 92 | 0° 53% 58% | 0° 55% 80% |
| Red | FF0000 | 255 0 0 | 0° 100% 50% | 0° 100% 100% |
| Crimson | DC143C | 220 20 60 | 348° 83% 47% | 348° 91% 86% |
| FireBrick | B22222 | 178 34 34 | 0° 68% 42% | 0° 81% 71% |
| Brown | A52A2A | 165 42 42 | 0° 75% 65% | 0° 58% 91% |
| DarkRed | 8B0000 | 139 0 0 | 0° 100% 27% | 0° 100% 54% |
| Maroon | 800000 | 128 0 0 | 0° 100% 25% | 0° 100% 50% |
| Colores naranjas | ||||
| PapayaWhip | FFEFD5 | 255 239 213 | 37° 100% 92% | 37° 16% 100% |
| BlanchedAlmond | FFEBCD | 255 235 205 | 36° 100% 90% | 36° 20% 100% |
| Bisque | FFE4C4 | 255 228 196 | 33° 100% 88% | 33° 24% 100% |
| Moccasin | FFE4B5 | 255 228 181 | 38° 100% 85% | 38° 30% 100% |
| PeachPuff | FFDAB9 | 255 218 185 | 28° 100% 86% | 28° 28% 100% |
| NavajoWhite | FFDEAD | 255 222 173 | 36° 100% 84% | 36° 32% 100% |
| LightSalmon | FFA07A | 255 160 122 | 17° 100% 74% | 17° 52% 100% |
| DarkSalmon | E9967A | 233 150 122 | 15° 72% 70% | 15° 47% 92% |
| Orange | FFA500 | 255 165 0 | 39° 100% 50% | 39° 100% 100% |
| DarkOrange | FF8C00 | 255 140 0 | 33° 100% 50% | 33° 100% 100% |
| Coral | FF7F50 | 255 127 80 | 16° 100% 66% | 16° 68% 100% |
| Tomato | FF6347 | 255 99 71 | 9° 100% 64% | 9° 72% 100% |
| OrangeRed | FF4500 | 255 69 0 | 16° 100% 50% | 16° 100% 100% |
| Colores marrones | ||||
| Wheat | F5DEB3 | 245 222 179 | 39° 77% 83% | 39° 27% 96% |
| BurlyWood | DEB887 | 222 184 135 | 34° 57% 70% | 34° 39% 87% |
| Tan | D2B48C | 210 180 140 | 34° 44% 69% | 34° 33% 83% |
| SandyBrown | F4A460 | 244 164 96 | 28° 87% 67% | 28° 60% 96% |
| Goldenrod | 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% |
| Chocolate | D2691E | 210 105 30 | 25° 75% 47% | 25° 86% 82% |
| Sienna | A0522D | 160 82 45 | 19° 56% 40% | 19° 72% 62% |
| SaddleBrown | 8B4513 | 139 69 19 | 25° 76% 31% | 25° 86% 55% |
| Colores amarillos | ||||
| LightYellow | FFFFE0 | 255 255 224 | 60° 100% 94% | 60° 12% 100% |
| Cornsilk | FFF8DC | 255 248 220 | 48° 100% 93% | 48° 14% 100% |
| LemonChiffon | FFFACD | 255 250 205 | 54° 100% 90% | 54° 20% 100% |
| LightGoldenrodYellow | 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% |
| Yellow | FFFF00 | 255 255 0 | 60° 100% 50% | 60° 100% 100% |
| Gold | FFD700 | 255 215 0 | 51° 100% 50% | 51° 100% 100% |
| DarkKhaki | BDB76B | 189 183 107 | 56° 38% 58% | 56° 43% 74% |
| Olive | 808000 | 128 128 0 | 60° 100% 25% | 60° 100% 50% |
| Colores verdes amarillos | ||||
| GreenYellow | ADFF2F | 173 255 47 | 84° 100% 59% | 84° 82% 100% |
| Chartreuse | 7FFF00 | 127 255 0 | 90° 100% 50% | 90° 100% 100% |
| LawnGreen | 7CFC00 | 124 252 0 | 90° 100% 49% | 90° 100% 98% |
| YellowGreen | 9ACD32 | 154 205 50 | 80° 61% 50% | 80° 76% 81% |
| OliveDrab | 6B8E23 | 107 142 35 | 80° 60% 35% | 80° 75% 56% |
| DarkOliveGreen | 556B2F | 85 107 47 | 82° 39% 30% | 82° 56% 42% |
| Colores verdes | ||||
| PaleGreen | 98FB98 | 152 251 152 | 120° 93% 79% | 120° 40% 99% |
| LightGreen | 90EE90 | 144 238 144 | 120° 73% 75% | 120° 39% 93% |
| MediumSpringGreen | 00FA9A | 0 250 154 | 157° 100% 49% | 157° 100% 98% |
| SpringGreen | 00FF7F | 0 255 127 | 150° 100% 50% | 150° 100% 100% |
| Lime | 00FF00 | 0 255 0 | 120° 100% 50% | 120° 100% 100% |
| DarkSeaGreen | 8FBC8F | 143 188 143 | 120° 25% 65% | 120° 24% 74% |
| LimeGreen | 32CD32 | 50 205 50 | 120° 61% 50% | 120° 76% 81% |
| MediumSeaGreen | 3CB371 | 60 179 113 | 147° 50% 47% | 147° 67% 71% |
| SeaGreen | 2E8B57 | 46 139 87 | 146° 50% 36% | 146° 67% 54% |
| ForestGreen | 228B22 | 34 139 34 | 120° 61% 34% | 120° 76% 55% |
| Green | 008000 | 0 128 0 | 120° 100% 25% | 120° 100% 50% |
| DarkGreen | 006400 | 0 100 0 | 120° 100% 20% | 120° 100% 40% |
| Colores acianos (azul verdes) | ||||
| LightCyan | E0FFFF | 224 255 255 | 180° 100% 94% | 180° 12% 100% |
| PaleTurquoise | AFEEEE | 175 238 238 | 180° 65% 81% | 180° 26% 93% |
| Aquamarine | 7FFFD4 | 127 255 212 | 160° 100% 75% | 160° 50% 100% |
| Aqua / Cyan | 00FFFF | 0 255 255 | 180° 100% 50% | 180° 100% 100% |
| Turquoise | 40E0D0 | 64 224 208 | 174° 72% 56% | 174° 72% 88% |
| MediumTurquoise | 48D1CC | 72 209 204 | 178° 60% 55% | 178° 66% 82% |
| DarkTurquoise | 00CED1 | 0 206 209 | 181° 100% 82% | 181° 36% 100% |
| MediumAquamarine | 66CDAA | 102 205 170 | 160° 51% 60% | 160° 51% 80% |
| LightSeaGreen | 20B2AA | 32 178 170 | 177° 70% 41% | 177° 82% 70% |
| CadetBlue | 5F9EA0 | 95 158 160 | 182° 41% 63% | 182° 39% 78% |
| DarkCyan | 008B8B | 0 139 139 | 180° 100% 27% | 180° 100% 54% |
| Teal | 008080 | 0 128 128 | 180° 100% 25% | 180° 100% 50% |
| Colores azules | ||||
| Lavender | E6E6FA | 230 230 250 | 240° 67% 94% | 240° 8% 98% |
| BlueWeb | CEE7FF | 206 231 255 | 209° 100% 90% | 209° 20% 100% |
| PowderBlue | B0E0E6 | 176 224 230 | 187° 52% 80% | 187° 23% 90% |
| LightBlue | ADD8E6 | 173 216 230 | 195° 53% 79% | 195° 25% 90% |
| LightSkyBlue | 87CEFA | 135 206 250 | 203° 92% 75% | 203° 47% 98% |
| SkyBlue | 87CEEB | 135 206 235 | 197° 71% 73% | 197° 42% 92% |
| LightSteelBlue | B0C4DE | 176 196 222 | 214° 41% 78% | 214° 21% 87% |
| DeepSkyBlue | 00BFFF | 0 191 255 | 195° 100% 50% | 195° 100% 100% |
| CornflowerBlue | 6495ED | 100 149 237 | 219° 79% 66% | 219° 58% 93% |
| DodgerBlue | 1E90FF | 30 144 255 | 210° 88% 100% | 210° 0% 100% |
| SteelBlue | 4682B4 | 70 130 180 | 207° 61% 71% | 207° 40% 89% |
| RoyalBlue | 4169E1 | 65 105 225 | 225° 73% 57% | 225° 71% 88% |
| Blue | 0000FF | 0 0 255 | 240° 100% 100% | 240° 0% 100% |
| MediumBlue | 0000CD | 0 0 205 | 240° 100% 80% | 240° 40% 100% |
| DarkBlue | 00008B | 0 0 139 | 240° 100% 55% | 240° 90% 100% |
| Navy | 000080 | 0 0 128 | 240° 100% 50% | 240° 100% 100% |
| MidnightBlue | 191970 | 25 25 112 | 240° 78% 44% | 240° 88% 78% |
| DarkSlateBlue | 483D8B | 72 61 139 | 248° 39% 39% | 248° 56% 54% |
| Colores violetas y púrpuras | ||||
| Thistle | D8BFD8 | 216 191 216 | 300° 24% 80% | 300° 11% 85% |
| Plum | DDA0DD | 221 160 221 | 300° 47% 75% | 300° 27% 87% |
| Violet | EE82EE | 238 130 238 | 300° 76% 72% | 300° 46% 93% |
| Orchid | DA70D6 | 218 112 214 | 302° 59% 65% | 302° 48% 86% |
| Fuchsia / Magenta | FF00FF | 255 0 255 | 300° 100% 50% | 300° 100% 100% |
| MediumPurple | 9370DB | 147 112 219 | 260° 60% 65% | 260° 49% 86% |
| MediumOrchid | BA55D3 | 186 85 211 | 288° 59% 58% | 288° 60% 83% |
| MediumSlateBlue | 7B68EE | 123 104 238 | 249° 80% 67% | 249° 57% 93% |
| SlateBlue | 6A5ACD | 106 90 205 | 248° 53% 58% | 248° 55% 80% |
| BlueViolet | 8A2BE2 | 138 43 226 | 271° 76% 53% | 271° 81% 89% |
| DarkViolet | 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% |
| Purple | 800080 | 128 0 128 | 300° 100% 25% | 300° 100% 50% |
| Indigo | 4B0082 | 75 0 130 | 275° 100% 25% | 275° 100% 50% |
| Colores rosas | ||||
| MistyRose | FFE4E1 | 255 228 225 | 6° 100% 94% | 6° 12% 100% |
| Pink | FFC0CB | 255 192 203 | 350° 100% 88% | 350° 24% 100% |
| LightPink | FFB6C1 | 255 182 193 | 351° 100% 86% | 351° 28% 100% |
| HotPink | FF69B4 | 255 105 180 | 330° 100% 71% | 330° 58% 100% |
| RosyBrown | BC8F8F | 188 143 143 | 0° 25% 65% | 0° 24% 74% |
| PaleVioletRed | DB7093 | 219 112 147 | 340° 60% 65% | 340° 49% 86% |
| DeepPink | FF1493 | 255 20 147 | 328° 100% 54% | 328° 92% 100% |
| MediumVioletRed | C71585 | 199 21 133 | 322° 81% 43% | 322° 90% 78% |
| Colores blancos | ||||
| White | FFFFFF | 255 255 255 | —° —% 100% | —° 0% 100% |
| WhiteSmoke | F5F5F5 | 245 245 245 | —° 0% 96% | —° 0% 96% |
| Snow | FFFAFA | 255 250 250 | 0° 2% 100% | 0° 0% 100% |
| Seashell | FFF5EE | 255 245 238 | 25° 100% 97% | 25° 6% 100% |
| Linen | FAF0E6 | 250 240 230 | 30° 67% 94% | 30° 8% 98% |
| AntiqueWhite | FAEBD7 | 250 235 215 | 34° 78% 91% | 34° 14% 98% |
| OldLace | FDF5E6 | 253 245 230 | 39° 85% 95% | 39° 9% 99% |
| FloralWhite | FFFAF0 | 255 250 240 | 40° 100% 97% | 40° 6% 100% |
| Ivory | FFFFF0 | 255 255 240 | 60° 100% 97% | 60° 6% 100% |
| Beige | F5F5DC | 245 245 220 | 60° 56% 91% | 60° 10% 96% |
| Honeydew | F0FFF0 | 240 255 240 | 120° 6% 100% | 120° 0% 100% |
| MintCream | F5FFFA | 245 255 250 | 150° 4% 100% | 150° 0% 100% |
| Azure | F0FFFF | 240 255 255 | 180° 6% 100% | 180° 0% 100% |
| AliceBlue | F0F8FF | 240 248 255 | 208° 100% 97% | 208° 6% 100% |
| GhostWhite | F8F8FF | 248 248 255 | 240° 100% 99% | 240° 2% 100% |
| LavenderBlush | FFF0F5 | 255 240 245 | 340° 100% 97% | 340° 6% 100% |
| Colores grises | ||||
| Gainsboro | DCDCDC | 220 220 220 | —° 0% 86% | —° 0% 86% |
| LightGrey | D3D3D3 | 211 211 211 | —° 0% 83% | —° 0% 83% |
| Silver | C0C0C0 | 192 192 192 | —° 0% 75% | —° 0% 75% |
| DarkGray | A9A9A9 | 169 169 169 | —° 0% 66% | —° 0% 66% |
| LightSlateGray | 778899 | 119 136 153 | 210° 22% 60% | 210° 26% 69% |
| SlateGray | 708090 | 112 128 144 | 210° 22% 56% | 210° 29% 66% |
| Gray | 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% |
| Black | 000000 | 0 0 0 | —° —% 0% | —° —% 0% |
Véase también
Todo el contenido de los artículos de la Enciclopedia Kiddle (incluidas las imágenes) se puede utilizar libremente para fines personales y educativos bajo la licencia Atribución-CompartirIgual a menos que se indique lo contrario. Citar este artículo:
Colores web para Niños. Enciclopedia Kiddle.