v148 · CSS · typography

Typography Lab

A full-featured text-decoration playground. Adjust underline offset, thickness, letter-spacing, and skip-ink mode. Cycle through scripts. Compare auto vs all side by side with annotations.

live preview

Checking text-decoration-skip-ink: all support...

Typography defies gravity — gjpqy descend below the baseline. 文字排版

text-decoration: underline; text-decoration-skip-ink: auto; text-underline-offset: 3px; text-decoration-thickness: auto; letter-spacing: 0px;

script catalog

See how descender clearance changes per script when switching between auto and all. Use the skip-ink radio above to toggle.

before / after — descender crossing

Show crossing descenders (skip-ink: none on left)
skip-ink: auto auto
Typography — gjpqy descend. 文字排版
Latin descenders are skipped. CJK is not skipped with auto.
skip-ink: all all
Typography — gjpqy descend. 文字排版
All glyphs get ink-skipping — including CJK and every script.

auto vs all — annotation panel

text-decoration-skip-ink: auto
gjpqy Typography. 日本語テスト. क्षमा करें.
auto: skips Latin descenders (g, j, p, q, y). Does NOT skip CJK or Devanagari by default. The UA decides per-glyph.
text-decoration-skip-ink: all
gjpqy Typography. 日本語テスト. क्षमा करें.
all: skips ink unconditionally for every glyph, every script. Consistent clearance when you control offset + position.

references

implementation reference

Need the exact API surface, compatibility boundaries, errors, lifecycle, and source links? Read the matching gendn reference ↗