The glow font effect renders a blurred outline around the text.

Glow effect sample

Both the outline pass and the subsequent blur pass can be controlled independently. Additionally, an offset can be applied which makes the effect suitable for generating drop shadows as well.

The effect is declared as:

font-effect: glow( <width-outline> <width-blur> <offset-x> <offset-y> <color> );

Its properties are specified by the following.

width-outline

Value: <length>
Initial: 1px
Percentages: N/A

Determines the outline width of the effect.

width-blur

Value: <length>
Initial: -1px
Percentages: N/A

Determines the blur width of the effect. For negative specified values, the used value will be copied from width-outline.

offset-x

Value: <length>
Initial: 0px
Percentages: N/A

offset-y

Value: <length>
Initial: 0px
Percentages: N/A

These properties define the offset, in pixels, between the source text and the glow.

color

Value: <color>
Initial: white
Percentages: N/A

The color is applied multiplicatively over the entire effect.

/* Declares a glow font effect. */
h1
{
	font-effect: glow( 3px #ee9 );
}
/* The glow effect can also create nice looking shadows. */
p.glow_shadow
{
	color: #ed5;
	font-effect: glow(2px 4px 2px 3px #644);
}