Outline

Outline & Stroke · Static · pure CSS

Hollow outline text via -webkit-text-stroke, with an optional offset echo shadow. Minimal, editorial and lightweight.

Open in the generator →All effects
Outline

CSS

/* Outline — generated with TEXT-FX
 * HTML: just put the class on any element.
 * Font: 'Recursive', sans-serif (load from Google Fonts).
 */

.text-effect {
  font-family: 'Recursive', sans-serif;
  font-weight: 400;
  letter-spacing: 8px;
  text-transform: none;
}

.text-effect {
  color: transparent;
  -webkit-text-stroke: 2.5px hsl(21 90% 66%);
}

Pure CSS — just add the .text-effect class to any element.

Category
Outline & Stroke
Type
Static
Browser support
-webkit-text-stroke (all modern, prefixed)
Capabilities
pure

Related Outline & Stroke effects