Sticker
Retro & Themed · Static · pure CSS
A white fill with a bold colored stroke and a hard drop-shadow — the die-cut sticker look. paint-order keeps thick strokes clean.
CSS
/* Sticker — generated with TEXT-FX
* HTML: just put the class on any element.
* Font: 'Space Mono', monospace (load from Google Fonts).
*/
.text-effect {
font-family: 'Space Mono', monospace;
font-weight: 900;
letter-spacing: -1px;
text-transform: uppercase;
}
.text-effect {
color: #fff;
-webkit-text-stroke: 3px hsl(86 85% 55%);
paint-order: stroke fill;
filter: drop-shadow(4px 6px 0 rgba(0,0,0,.28));
}
Pure CSS — just add the .text-effect class to any element.
- Category
- Retro & Themed
- Type
- Static
- Browser support
- -webkit-text-stroke + paint-order
- Capabilities
- pure