CSS Colors

CSS Colors

Color name	HEX	RGB	COLOR
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)
blanchedalmond	#FFEBCD	rgb(255,235,205)
blue	#0000FF	rgb(0,0,255)
blueviolet	#8A2BE2	rgb(138,43,226)
black	#000000	rgb(0.0.0)
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)
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)
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)
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)
grey	#808080	rgb(128,128,128)
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)
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)
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	#9370DB	rgb(147,112,219)
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)
olivedrad	#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	#DB7093	rgb(219,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)
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)

hojas de estilo CSS. Que significa en cascada

Concepto de cascada en hojas de estilo CSS

El concepto de cascada se refiere al proceso o algoritmo que establece el procesador CSS para determinar el valor de una propiedad cuando existe un conflicto de declaraciones CSS para un elemento dado.

Por ejemplo:

body { color: white; }
body { color: black; }

El texto del documento debe ser de color blanco o negro?
Cuál de las declaraciones tiene más peso o importáncia?Qué valor será finalmente asignado a la propiedad de color de texto?

Aunque resolver este dilema parece sencillo y trivial teniendo en cuenta el ejemplo anterior (y en este caso concreto realmente lo es), el procesador recurre a "una cascada" de procesamiento para resolver estos conflictos. Para un elemento dado:

1. encuentra todas las propiedades declaradas para dicho elemento: tanto las declaradas explícitamente como las heredadas.( recuerda que provienen de distintas fuentes: hojas externas, estilo embebido en el documento, estilo en linea como atributo de los elementos del documento, Y de distinto origen: El autor de la hoja, el lector o usuario de la página, y el cliente o agente usuario (normalmente el navegador web)
2. Configura dos listas según el peso o importancia explícito que tengan. Esto es, separa las declaraciones que terminan en !important del resto, siendo estas últimas las que prevalecen en la resolución del conflicto.
3. Si aún no está resuelto el conflicto, toma en consideración el origen de la propiedad conflictiva: Para declaraciones normales, las de Autor prevalecen sobre las de Lector, y éstas a su vez, sobre las definidas por el agente usuario. Para declaraciones !important, las de lector prevalecen sobre las demás.
4. En este punto se tiene en cuenta la especifidad de la declaración, (cómputo que se realiza en función de cómo se ha especificado el elemento en el selector de la regla CSS).

   Según el siguiente formato, (0,0,0,0), y leyéndose de izquiera a derecha por orden de importáncia o especifidad, el procesador añade puntos en cada "columna" según las siguientes directrices:

   • -- Una propiedad en un estilo en línea, (por ejemplo: <h1 style="color: white;">...) obtiene la puntuación (1,0,0,0).
   • -- Se añade un punto (0,1,0,0) para cada atributo ID que se encuentre en el selector
   • -- Se añade un punto (0,0,1,0) para cada atributo class, atributo cualquiera, o pseudo clase, que se encuentre en el selector
   • -- Se añade un punto (0,0,0,1) para cada elemento o pseudo elemento que se encuentre en el selector.

   El selector universal (*) obtiene cero puntos, (0,0,0,0). Y los simbolos combinadores (como >, +, etc...) y las propiedades heredadas no obtienen ninguna puntuación.

5. Finalmente, y si el conflicto aún no se ha resuelto, se comprueba el orden en el que aparece la declaración, teniendo en cuenta que una declaración posterior sobreescribe una declaración anterior.
   Y que los documentos importados "se pegan" al comienza de la hoja de estilo que los importa; y que los estilos definidos por etiquetas obsoletas de presentacion ( como font, etc...), son consideradas como si fueran proporcionadas por el agente usuario

Ejemplos:

             p { color:gray; }   /* (0,0,0,1) */
         div p { color:gray; }   /* (0,0,0,2) */
  div.main > p { color:gray; }   /* (0,0,1,2) */
  div#tags section[lower] > p:first-child strong > em { color:gray; }    /*(0,1,2,5) */

Cualquier duda enviar mensaje...