Start Guides Reference Icons Animations
Theming
  • Colors
  • Sizing
  • Typography
  • Density
  • Motion
  • Theme builder
  • Overview
  • Headings
  • Paragraphs
  • Links
  • Lists
  • Code
  • wrTypography API
GridReactive formsOverlayMobile & responsive
  • Overview
  • Setup & loaders
  • Usage in templates
  • Interpolation
  • Scopes
  • WrI18n API
KeyboardServer-side renderingTestingMCP serverAgent skillRegistryContent Security Policy
Section

Typography

A complete type system for ngwr apps. Semantic variants, color tones, alignment, truncation, and monospace — all driven by the shared --wr-text-* / --wr-font-weight-* / --wr-leading-* tokens so a single theme override re-skins everything.

At a glance

ngwr/typography

Build interfaces

that read beautifully.

A single `[wrTypography]` directive covers every text role. Pick a variant, optional tone, and you’re done.

Sections

  • Headings & display

    h1–h6 plus the display variant. Reads the type scale from `--wr-text-*` tokens.

  • Paragraphs

    lead, body, small, caption, overline. The full prose vocabulary plus tones and alignment.

  • Links

    The `link` variant — inline in a paragraph, or paired with an icon.

  • Lists

    One `list` variant across ul, ol and dl — markers and nesting follow the element.

  • Code

    Inline code and the `[mono]` modifier for forcing monospace on any variant.

  • API reference

    Every input on `wrTypography`, the full variant union, and the classes it emits.

2022 – 2026 © Roman Khegayv14.5.1