The logo "glow" is actually a CSS shadow.
The box-shadow
values come as follows: horizontal and vertical offset, blur radius, spread and colour (or colours).
When inset
is specified, the outer shadow is changed to inner shadow. Specifying more colours creates layers.
Below is the logo shadow "evil glow" (so evil) code.
.logoimg {
width: fit-content;
margin: 2em 1em;
max-width: 250px;
padding: 5px;
box-shadow:
inset 60px 0 330px #f0f,
0 0 60px #f0f,
-10px 0 50px #0ff;
}
Similar to box-shadow
, text-shadow
takes several values:
Horizontal and vertical offset, blur radius and the shadow colour.
This sequence can be specified multiple times to create a layered shadow.
#textshadow {
color: #f0f;
text-shadow:
1px 1px 2px black,
0 0 25px blue,
0 0 5px darkblue;
}