Skip to content
All effectsCard

Prism Card

A gradient border-box plus the same gradient blurred behind it — the glow is a copy, not a shadow.

Pure CSSCardPro

Usage

Analytics

Meant for

CardHolo CardKPIWidget

Examples

On a Card

The glow is a blurred copy of the rim, not a box-shadow — that is why it keeps the colour. The class takes over the card's fill and opens its overflow, because the rim and the glow both sit outside the card's own edge. Leave it room, or a neighbouring element clips the glow.

Analytics
Live for the last 24 hours
12,480 sessions · 3.2% conversion

The class is wm wm-prism-card — the first half is the marker the trigger and reduced-motion rules hook into, the second is the effect.