Outline drop shadow

How to use it

Duplicate an element and place it as if it’s a drop shadow, but outline the shadow rather than filling it.

When to use it

This technique almost purely exists to reinforce a brand or theme. Shadows don’t have outlines in real life, so it’s not a particularly realistic shadow.

What to watch out for

It’s best to make the shadow a different colour from the element that casts it. This is because the shadow is solid, so unlike a softer drop shadow it’ll clash with the main element if it’s the same colour.

Examples