CSS color palettes

First of all, I'd like to say hi to the list members, since this is my 
first message.
My name is Damian Vila, I'm a graphic & web designer from Buenos Aires, 
Argentina, but I live in Madrid, Spain.
I'd like to show the community an idea for CSS color palettes.
A small example with some explanations is included in this email.
If you want to read an argument for its use you can browse to my blog: 
http://damianvila.wordpress.com/2006/10/23/css-color-palettes-2/
I hope you like the idea.
Thanks,

Damian
-------------

/* CSS Color Palettes definition - CCP
by Damian Vila (damianvila@gmail.com)
If no name is specified for the palette the array number is used. The 
"default" palette is the first user defined palette (01). Palette number 
00 is the internal agent palette.
Maximum number of colors and sub-palettes is 255 (ff).
Sub-palettes and colors can be referenced either by its keyword (red, 
bright-green) or by id-number (!00, !0a, !ff, !127).
If no palette is specified or the wrong name for palette or color is 
given, the agent internal palette or color for that object is used.
If color number is used, by changing the sub-palette name the color 
scheme will cascade. If color definition is changed, all elements using 
that color keyword will cascade.
The scheme for the color definition is as follows: colornn: color-def 
"keyword", where nn is the color array number, color-def is the color 
definition in any standard CSS notation and "keyword" is a string to 
reference the color in an easy way.
Color array number can be specified either in decimal or hexadecimal. 
Keyword must contain no white space.
*/

!color-palette { /* "default" color palette */
color00: #800000 "maroon";
color01: #ff0000 "red";
color02: #ffA500 "orange";
color03: #ffff00 "yellow";
color04: #808000 "olive";
color05: #800080 "purple";
color06: #ff00ff "fuchsia";
color07: #ffffff "white";
color08: #00ff00 "lime";
color09: #008000 "green";
color10: #000080 "navy";
color11: #0000ff "blue";
color12: #00ffff "aqua";
color13: #008080 "teal";
color14: #000000 "black";
color15: #c0c0c0 "silver";
color16: #808080 "gray";
}

!color-palette "green" {
color00: #0f0 "bright-green"; /* text */
color01: #fff "white"; /* background */
color02: rgb(0,192,0) "green"; /* titles */
....
}

!color-palette high-contrast {
color00: #000 "black"; /* text */
color01: #ffc "light-yellow"; /* background */
color02: #00f "blue"; /* titles */
....
}

body{
color-palette: "green";
background-color: !01;
}

a {
color: bright-green;
}

h1 {
color: !02;
}

Received on Monday, 30 October 2006 02:35:08 UTC