W3C home > Mailing lists > Public > www-style@w3.org > May 2002

Re: Last call comments on CSS3 module: color; musing and a transparent question

From: Jonny Axelsson <jax@opera.no>
Date: Thu, 23 May 2002 19:25:12 +0200
To: www-style@w3.org
Cc: "HTML WG" <w3c-html-wg@w3.org>
Message-Id: <NE9D8TS517151TO3Z3XRMTOSQ53QPQ.3ced25f8@falcon>
22.05.02 14:45:41, "Steven Pemberton" <steven.pemberton@cwi.nl> wrote:

>    <color>::= [<saturation> || <lightness> || <transparency>]? <hue>
>    <lightness>::= [very|slightly]? [dark|light]
>    <saturation>::= [very|slightly]? weak
>    <transparency>::= [very|slightly]? transparent

I think I like this idea. The only thing I don't like is the use of the 
"very" and "slightly" modifiers. This for much the same reason that I don't 
like the "normal" value in the font property, it is hard or impossible to 
know/read which property is normal. 

To take a worst case example with very/slightly:
border: thin dotted slightly light very weak slightly transparent cyan-blue;

I think it would be better to either take a cue from font-stretch, join the 
modifier and adjective:

lightness:: extra-dark | dark | semi-dark | semi-light | light | extra-light 
| lighter | darker 

or use a list of keywords:

lightness:: off-black | grimy | dark | light | pastel | off-white | lighter 
| darker

saturation:: intense | vivid | bright | rich | pale | dull | colorless

transparency:: opaque | dense | semi-opaque | shimmering | transparent

hue:: red | red-yellow (orange) | yellow | yellow-green | green | green-cyan   
| cyan | cyan-blue | blue | blue-magenta (purple) | magenta | magenta-red 

An attractive colour scheme could then be:

border: thin dotted light dull shimmering cyan-blue;
background: light vivid yellow-green;
color: grimy rich magenta;



HSL can make it easier to solve an extremely common problem, how can you 
ensure that the foreground colour is readable on the current background 
colour. Especially system colors are horrible--it is impossible to predict 
if the color/background combination is readable, even when you do specify 
color and background in the same rule.

I have heard and seen a large number of suggestions for how to solve this, 
all of them complex and/or impracticable. With HSL it would be easier. It 
could be possible to specify a couple high contrast colors values, for 

Black/White: If background lightness < 50% color:white, otherwise 

Same hue: If background lightness < 50%, foreground lightness is 100%, 
otherwise foreground lightness is 0%. Hue and saturation is the same as 

Contrasting hue: As above, but hue = background hue - 180 degrees

CW hue/ CCW hue: As above, but hue = background hue +/- 120 degrees


Question (transparent color):

When color == transparent and background =/= transparent, is the color "on 
top of" the background color, or is it a punch-through?

In other words if you have a red box on a yellow box and the text in the red 
box is transparent, will the text be red or yellow? I assume it will be red, 
but I could not see anything definite one way or the other.

Jonny Axelsson
Opera software
Received on Thursday, 23 May 2002 13:21:41 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:27:02 UTC