Typography

Manti UI uses a compact UI-first type scale.

The typography primitives add Manti's token-backed visual language without giving up native HTML semantics: Blockquote, Code, and Kbd.

Size

--manti-text-xs through --manti-text-5xl provide interface and display sizes. Pair them with --manti-leading-tight, snug, normal, or relaxed.

xs · 0.75remThe smooth folded dough

sm · 0.875remThe smooth folded dough

base · 1remThe smooth folded dough

lg · 1.125remThe smooth folded dough

xl · 1.25remThe smooth folded dough

2xl · 1.5remThe smooth folded dough

3xl · 1.875remThe smooth folded dough

4xl · 2.25remThe smooth folded dough

5xl · 3remThe smooth folded dough

.card-title {
  font-size: var(--manti-text-xl);
  line-height: var(--manti-leading-snug);
}

Weight

Available weights are regular (400), medium (500), semibold (600), and bold (700).

regular · 400The smooth folded dough

medium · 500The smooth folded dough

semibold · 600The smooth folded dough

bold · 700The smooth folded dough

Families

--manti-font-sans — Inter with system fallbacks
--manti-font-mono — system monospace stack

Inter is not bundled. Load it in the application or override --manti-font-sans.