Hoy te presento un clásico entre los clásicos de las extensiones de Chrome.
¿Qué es ColorZilla?
ColorZilla es una extensión de Google Chrome (también disponible en otros navegadores) que permite capturar los colores que aparecen en la página web mostrada en ese momento, es una herramienta súper útil.
Como instalar la extensión ColorZilla en Google Chrome paso a paso
- Accede a Web Chrome Store.
- Introduce «ColorZilla» en el buscador y selecciona la extensión de colorzilla.
- Haz clic en Instalar.
- Comprueba que te aparece al lado de la barra de navegación un icono de cuenta gotas y listo.
No me aparece el icono del cuentagotas de la extensión ColorZilla
Si no ves el icono del cuentagotas, es probable que sea porque no está anclado.
Solución
Para solucionarlo, simplemente haz clic en el icono con forma de pieza de puzzle que aparece en la barra de navegación, se te abrirá un listado y ahí podrás comprobar que colorzilla se encuentra desanclado. Pulsa la chincheta para dejarlo anclado y visible. Listo.
¿Cómo funciona la extensión de ColorZilla?
Una vez que la tienes instalada, sólo tienes que hacer clic sobre el icono en forma de cuentagotas y pulsar en “Pulse Color Picker Active». A partir de ese momento, te aparecerá un cursor en forma de cruz que irá variando de color en función de por dónde lo muevas, en el momento que hagas clic, automáticamente te guarda el color sobre el que has clicado.
¿Dónde se pueden ver los colores que seleccionado en colorzilla?
Para ver donde se han guardado los colores de los elementos sobre los que has clicado, pincha de nuevo en el cuentagotas que aparece en la barra de las extensiones y vete a “Color Picker”, ahí podrás encontrar todos los colores en el apartado de la derecha llamado “Color history”.
Una vez que los tengas localizados, selecciona el o los que necesites y copia el formato que necesites en ese momento.
ColorZilla te muestra los colores en HTML, rgb y hsv.
Extensiones similares a ColorZilla:
- ColorPick Eyedropper
- Eye Dropper
- Herramienta Cuentagotas de color
Tablas de Colores HTML
En el mundo online los colores que se usan para las páginas webs son HTML.
Esta entrada del blog la voy a aprovechar para tener a mano unas cuantas tablas clasificadas por colores principales y diferentes tonos en cada una de ellas.
COLORES HTML ROJOS PARA PÁGINAS WEB
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Rojo Indio |
IndianRed |
#CD5C5C |
205, 92, 205 |
|
|
Coral Suave |
LightCoral |
#F08080 |
240, 128, 128 |
|
|
Salmón |
Salmon |
#FA8072 |
250, 128, 114 |
|
|
Salmón oscuro |
DarkSalmon |
#E9967A |
233, 150, 122 |
|
|
Salmón Suave |
LightSalmon |
#FFA07A |
255, 160, 122 |
|
|
Carmesí |
Crimson |
#DC143C |
220, 20, 60 |
|
|
Rojo Puro |
Red |
#FF0000 |
255, 0, 0 |
|
|
Rojo Fuego |
FireBrick |
#B22222 |
178, 34, 34 |
|
|
Rojo Oscuro |
DarkRed |
#8B0000 |
139, 0, 0 |
COLORES ROSAS PARA PÁGINAS WEB
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Rosa |
Pink |
#FFC0CB |
255, 192, 203 |
|
|
Rosa Suave |
LightPink |
#FFB6C1 |
255, 182, 193 |
|
|
Rosa Cálido |
HotPink |
#FF69B4 |
255, 105, 180 |
|
|
Rosa Profundo |
DeepPink |
#FF1493 |
255, 20, 147 |
|
|
Medio Violeta Rojo |
MediumVioletRed |
#C71585 |
199, 21, 133 |
|
|
Rosa Pastel |
PaleVioletRed |
#DB7093 |
219, 112, 147 |
COLORES NARANJAS EN HTML
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Salmón Suave |
LightSalmon |
#FFA07A |
255, 160, 122 |
|
|
Naranja Coral |
Coral |
#FF7F50 |
255, 127, 80 |
|
|
Tomate |
Tomato |
#FF6347 |
255, 99, 71 |
|
|
Naranja Rojizo |
OrangeRed |
#FF4500 |
255, 69, 0 |
|
|
Naranja Oscuro |
DarkOrange |
#FF8C00 |
255, 140, 0 |
|
|
Naranja Puro |
Orange |
#FFA500 |
255, 165, 0 |
COLORES AMARILLOS PARA PÁGINAS WEB EN HTML
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Amarillo Oro |
Gold |
#FFD700 |
255, 215, 0 |
|
|
Amarillo Puro |
Yellow |
#FFFF00 |
255, 255, 0 |
|
|
Amarillo Suave |
LightYellow |
#FFFFE0 |
255, 255, 224 |
|
|
Amarillo Limón |
LemonChiffon |
#FFFACD |
255, 250, 205 |
|
|
Amarillo Manzana Suave |
LightGoldenrodYellow |
#FAFAD2 |
250, 250, 210 |
|
|
Amarillo Papaya |
PapayaWhip |
#FFEFD5 |
255, 239, 213 |
|
|
Amarillo Mocasín |
Moccasin |
#FFE4B5 |
255, 228, 181 |
|
|
Amarillo Melocotón |
PeachPuff |
#FFDAB9 |
255, 218, 185 |
|
|
Amarillo Oro Pálido |
PaleGoldenrod |
#EEE8AA |
238, 232, 170 |
|
|
Amarillo Caqui |
Khaki |
#F0E68C |
240, 230, 140 |
|
|
Amarillo Caqui Oscuro |
DarkKhaki |
#BDB76B |
189, 183, 107 |
COLORES HTML PÚRPURAS
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Espliego |
Lavender |
#E6E6FA |
230, 230, 250 |
|
|
Cardo |
Thistle |
#D8BFD8 |
216, 191, 216 |
|
|
Ciruela |
Plum |
#DDA0DD |
221, 160, 221 |
|
|
Violeta |
Violet |
#EE82EE |
238, 130, 238 |
|
|
Orquídea |
Orchid |
#DA70D6 |
218, 112, 214 |
|
|
Fucsia |
Fuchsia |
#FF00FF |
255, 0, 255 |
|
|
Magenta |
Magenta |
#FF00FF |
255, 0, 255 |
|
|
Orquídea Medio |
MediumOrchid |
#BA55D3 |
186, 85, 211 |
|
|
Púrpura Medio |
MediumPurple |
#9370DB |
147, 112, 219 |
|
|
Amatista |
Amethyst |
#9966CC |
153, 102, 204 |
|
|
Azul Violeta |
BlueViolet |
#8A2BE2 |
138, 43, 226 |
|
|
Violeta Oscuro |
DarkViolet |
#9400D3 |
148, 0, 211 |
|
|
Orquídea Oscuro |
DarkOrchid |
#9932CC |
153, 50, 204 |
|
|
Magenta Oscuro |
DarkMagenta |
#8B008B |
139, 0, 139 |
|
|
Púrpura |
Purple |
#800080 |
128, 0, 128 |
|
|
Índigo |
Indigo |
#4B0082 |
75, 0, 130 |
|
|
Azul Pizarra |
SlateBlue |
#6A5ACD |
106, 90, 205 |
|
|
Azul Pizarra Medio |
MediumSlateBlue |
#7B68EE |
123, 104, 238 |
|
|
Azul Pizarra Oscuro |
DarkSlateBlue |
#483D8B |
72, 61, 139 |
COLORES VERDES
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Verde Amarillento |
GreenYellow |
#ADFF2F |
173, 255, 47 |
|
|
Verde Cartujano |
Chartreuse |
#7FFF00 |
127, 255, 0 |
|
|
Verde Césped |
LawnGreen |
#7CFC00 |
124, 253, 0 |
|
|
Lima |
Lime |
#00FF00 |
0, 255, 0 |
|
|
Verde Lima |
LimeGreen |
#32CD32 |
50, 205, 50 |
|
|
Verde Pálido |
PaleGreen |
#98FB98 |
152, 251, 152 |
|
|
Verde Claro |
LightGreen |
#90EE90 |
144, 238, 144 |
|
|
Verde Primavera Medio |
MediumSpringGreen |
#00FA9A |
0, 250, 154 |
|
|
Verde Primavera |
SpringGreen |
#00FF7F |
0, 255, 127 |
|
|
Verde Mar Medio |
MediumSeaGreen |
#3CB371 |
60, 179, 113 |
|
|
Verde Mar |
SeaGreen |
#2E8B57 |
46, 139, 87 |
|
|
Verde Bosque |
ForestGreen |
#228B22 |
34, 139, 34 |
|
|
Verde |
Green |
#008000 |
0, 128, 0 |
|
|
Verde Oscuro |
DarkGreen |
#006400 |
0, 100, 0 |
|
|
Amarillo Verdoso |
YellowGreen |
#9ACD32 |
154, 205, 50 |
|
|
Verde Oliva |
OliveDrab |
#6B8E23 |
107, 142, 35 |
|
|
Oliva |
Olive |
#808000 |
128, 128, 0 |
|
|
Verde Oliva Oscuro |
DarkOliveGreen |
#556B2F |
85, 107, 47 |
|
|
Aguamarina Medio |
MediumAquamarine |
#66CDAA |
102, 205, 170 |
|
|
Verde Mar Oscuro |
DarkSeaGreen |
#8FBC8F |
143, 188, 143 |
|
|
Verde Mar Claro |
LightSeaGreen |
#20B2AA |
32, 178, 170 |
|
|
Cyan Oscuro |
DarkCyan |
#008B8B |
0, 139, 139 |
|
|
Carcel |
Teal |
#008080 |
0, 128, 128 |
COLORES AZULES EN HTML
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Agua |
Aqua |
#00FFFF |
0, 255, 255 |
|
|
Cyan |
Cyan |
#00FFFF |
0, 255, 255 |
|
|
Cyan Suave |
LightCyan |
#E0FFFF |
224, 255, 255 |
|
|
Turquesa Pastel |
PaleTurquoise |
#AFEEEE |
175, 238, 238 |
|
|
Aguamarina |
Aquamarine |
#7FFFD4 |
127, 255, 212 |
|
|
Turquesa |
Turquoise |
#40E0D0 |
64, 224, 208 |
|
|
Turquesa Medio |
MediumTurquoise |
#48D1CC |
72, 209, 204 |
|
|
Turquesa Oscuro |
DarkTurquoise |
#00CED1 |
0, 206, 209 |
|
|
Azul Cadete |
CadetBlue |
#5F9EA0 |
95, 158, 160 |
|
|
Azul Acero |
SteelBlue |
#4682B4 |
70, 130, 180 |
|
|
Azul Acero Claro |
LightSteelBlue |
#B0C4DE |
176, 196, 222 |
|
|
Azul Pálido |
PowderBlue |
#B0E0E6 |
176, 224, 230 |
|
|
Azul Claro |
LightBlue |
#ADD8E6 |
173, 216, 230 |
|
|
Azul Cielo |
SkyBlue |
#87CEEB |
135, 206, 235 |
|
|
Azul Cielo Claro |
LightSkyBlue |
#87CEFA |
135, 206, 250 |
|
|
Azul Cielo Profundo |
DeepSkyBlue |
#00BFFF |
0, 191, 255 |
|
|
Azul Capota |
DodgerBlue |
#1E90FF |
30, 144, 255 |
|
|
Azul Añil |
CornflowerBlue |
#6495ED |
100, 149, 237 |
|
|
Azul Pizarra Medio |
MediumSlateBlue |
#7B68EE |
123, 104, 238 |
|
|
Azul Real |
RoyalBlue |
#4169E1 |
65, 105, 255 |
|
|
Azul |
Blue |
#0000FF |
0, 0, 255 |
|
|
Azul Medio |
MediumBlue |
#0000CD |
0, 0, 205 |
|
|
Azul Oscuro |
DarkBlue |
#00008B |
0, 0, 139 |
|
|
Azul Naval |
Navy |
#000080 |
0, 0, 128 |
|
|
Azul Media Noche |
MidnightBlue |
#191970 |
25, 25, 112 |
COLORES MARRONES HTML
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Seda de Maiz |
Cornsilk |
#FFF8DC |
255, 248, 220 |
|
|
Almendra |
BlanchedAlmond |
#FFEBCD |
255, 235, 205 |
|
|
Bizcocho |
Bisque |
#FFE4C4 |
255, 228, 196 |
|
|
Marrón Navaja |
NavajoWhite |
#FFDEAD |
255, 222, 173 |
|
|
Marrón Trigo |
Wheat |
#F5DEB3 |
245, 222, 179 |
|
|
Madera Fuerte |
BurlyWood |
#DEB887 |
222, 184, 135 |
|
|
Marrón bronceado |
Tan |
#D2B48C |
210, 180, 140 |
|
|
Marrón Atractivo |
RosyBrown |
#BC8F8F |
188, 143, 143 |
|
|
Marrón Arenoso |
SandyBrown |
#F4A460 |
224, 164, 96 |
|
|
Vara de Oro |
Goldenrod |
#DAA520 |
218, 165, 32 |
|
|
Vara de Oro Oscura |
DarkGoldenrod |
#B8860B |
184, 134, 11 |
|
|
Marrón Perú |
Peru |
#CD853F |
205, 133, 63 |
|
|
Marrón Chocolate |
Chocolate |
#D2691E |
210, 105, 30 |
|
|
Marrón Silla |
SaddleBrown |
#8B4513 |
139, 69, 19 |
|
|
Marrón Siena |
Sienna |
#A0522D |
160, 82, 45 |
|
|
Marrón |
Brown |
#A52A2A |
165, 42, 42 |
|
|
Castaño |
Maroon |
#800000 |
128, 0, 0 |
COLORES BLANCOS PARA PÁGINAS WEB
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Blanco |
White |
#FFFFFF |
255, 255, 255 |
|
|
Blanco Nieve |
Snow |
#FFFAFA |
255, 250, 250 |
|
|
Miel Crema |
Honeydew |
#F0FFF0 |
240, 255, 240 |
|
|
Menta Crema |
MintCream |
#F5FFFA |
245, 255, 250 |
|
|
Azul Celeste |
Azure |
#F0FFFF |
240, 255, 255 |
|
|
Azul Alicia |
AliceBlue |
#F0F8FF |
240, 248, 255 |
|
|
Blanco Fantasma |
GhostWhite |
#F8F8FF |
248, 248, 255 |
|
|
Blanco Humo |
WhiteSmoke |
#F5F5F5 |
245, 245, 245 |
|
|
Concha de Mar |
Seashell |
#FFF5EE |
255, 245, 238 |
|
|
Beige |
Beige |
#F5F5DC |
245, 245, 220 |
|
|
Blanco Cordón Viejo |
OldLace |
#FDF5E6 |
253, 245, 230 |
|
|
Blanco Floral |
FloralWhite |
#FFFAF0 |
255, 250, 240 |
|
|
Blanco Marfil |
Ivory |
#FFFFF0 |
255, 255, 240 |
|
|
Blanco Antigüo |
AntiqueWhite |
#FAEBD7 |
250, 235, 215 |
|
|
Blanco Lino |
Linen |
#FAF0E6 |
250, 240, 230 |
|
|
Lavanda |
LavenderBlush |
#FFF0F5 |
255, 240, 245 |
|
|
Rosa Palo |
MistyRose |
#FFE4E1 |
255, 228, 225 |
COLORES GRISES HTML PARA PÁGINAS WEB
|
Color |
Nombre castellano |
Nombre HTML |
Hexadecimal |
RGB |
|
|
Gainsboro |
Gainsboro |
#DCDCDC |
220, 220, 220 |
|
|
Gris Claro |
LightGrey |
#D3D3D3 |
211, 211, 211 |
|
|
Gris Plata |
Silver |
#C0C0C0 |
192, 192, 192 |
|
|
Gris Oscuro |
DarkGray |
#A9A9A9 |
169, 169, 169 |
|
|
Gris |
Gray |
#808080 |
128, 128, 128 |
|
|
Gris Ténue |
DimGray |
#696969 |
105, 105, 105 |
|
|
Gris Pizarra Claro |
LightSlateGray |
#778899 |
119, 136, 153 |
|
|
Gris Pizarra |
SlateGray |
#708090 |
112, 128, 144 |
|
|
Gris Pizarra Oscuro |
DarkSlateGray |
#2F4F4F |
47, 79, 79 |
|
|
Negro |
Black |
#000000 |
0, 0, 0 |
0 comentarios