CSS Underline Generator

Style text underlines with CSS: wavy, double, dotted or dashed, with custom colour, thickness, offset and ink-skipping. Copy the CSS.

The quick brown fox jumps over the lazy dog

Frequently asked questions

What is a wavy underline used for?

A wavy underline adds a playful or hand-drawn feel and is often used to highlight links or key phrases. Modern CSS makes it a one-line style with text-decoration-style: wavy, which this tool builds for you.

What does skip-ink do?

Skip-ink controls whether the underline breaks around the descenders of letters like g, y and p. Auto skips them for a cleaner look, while none draws a continuous line straight through.

Will these styles work in all browsers?

The core text-decoration properties are widely supported in current browsers. Thickness and offset are supported almost everywhere now; very old browsers ignore them and simply show a default underline.