Core

Typography

Reusable type tools: a font-size scale (fs-*), weights (fw-*), line-heights (lh-*) and pre-styled semantic elements. The font is Inter, set on --ng-font-base.

Semantic tags (h1–h6, p, code) come pre-styled from the type tokens, so plain HTML already reads well. The fs-* / fw-* / lh-* utilities let you override any single property on top.

Font scale

Eleven steps from fs-2xs (0.6875rem) to fs-6xl (4.5rem). Each utility sets only the font size.

fs-6xl

fs-5xl

fs-4xl

fs-3xl

fs-2xl

fs-xl

fs-lg

fs-base

fs-sm

fs-xs

fs-2xs

type.html

<p class="fs-6xl">fs-6xl</p>
<p class="fs-5xl">fs-5xl</p>
<p class="fs-4xl">fs-4xl</p>
<p class="fs-3xl">fs-3xl</p>
<p class="fs-2xl">fs-2xl</p>
<p class="fs-xl">fs-xl</p>
<p class="fs-lg">fs-lg</p>
<p class="fs-base">fs-base</p>
<p class="fs-sm">fs-sm</p>
<p class="fs-xs">fs-xs</p>
<p class="fs-2xs">fs-2xs</p>

Headings

The heading tags are styled out of the box — no classes required.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

type.html

<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>

Font weight

Seven weights, fw-200 to fw-800.

fw-200 · Extra light

fw-300 · Light

fw-400 · Regular

fw-500 · Medium

fw-600 · Semibold

fw-700 · Bold

fw-800 · Extrabold

type.html

<p class="fw-200">fw-200 · Extra light</p>
<p class="fw-300">fw-300 · Light</p>
<p class="fw-400">fw-400 · Regular</p>
<p class="fw-500">fw-500 · Medium</p>
<p class="fw-600">fw-600 · Semibold</p>
<p class="fw-700">fw-700 · Bold</p>
<p class="fw-800">fw-800 · Extrabold</p>

Line height

lh-tight · 1.25 lh-normal · 1.5 lh-relaxed · 1.75 lh-loose · 2

Alignment & transform

text-left text-center text-right text-justify text-upper text-lower

Text flow

text-truncate cuts a single line with an ellipsis, text-wrap breaks long words, text-nowrap prevents wrapping.

text-truncate text-wrap text-nowrap

Type tokens

Semantic size tokens read by the base elements.

`--ng-fs-display`	2.25rem
`--ng-fs-h1`	1.75rem
`--ng-fs-h2`	1.4rem
`--ng-fs-h3`	1.125rem
`--ng-fs-lead`	1.125rem
`--ng-fs-body`	.85rem
`--ng-fs-small`	.875rem
`--ng-fs-micro`	.75rem