Display ve Body sayfaları büyük başlık + paragrafı kapsıyor. Bu tablo aradaki h4-h6, label, overline, code, blockquote'u kapatır. Tüm değerler colors_and_type.css'de export edilir.
| Token | Spec | Örnek | Kullanım |
|---|---|---|---|
| --nb-text-h1 | 48 / 1.10 · -2% | Sipariş başlığı | Marketing hero, login splash. UI içinde yasak. |
| --nb-text-h2 | 36 / 1.15 · -2% | Sayfa başlığı | Modal başlığı, ana sayfa h1. Sayfa başına tek. |
| --nb-text-h3 | 28 / 1.20 · -1.8% | Bölüm başlığı | Card başlığı, settings bölümü, drawer başlığı. |
| --nb-text-h4 | 22 / 1.25 · -1.2% | Alt bölüm | Nested card, dialog body başlığı, list group title. |
| --nb-text-h5 | 18 / 1.35 · -.6% | Küçük başlık | Sidebar item başlığı, accordion item, kart üst başlığı. |
| --nb-text-h6 | 15 / 1.40 · 0 | Mini başlık | Form bölüm ayracı, küçük card title, dropdown header. |
| Token | Spec | Örnek | Kullanım |
|---|---|---|---|
| --nb-text-label-lg | 12.5 / 1.4 · 500 | E-posta adresi | Form input label'ı (default). |
| --nb-text-label-sm | 11 / 1.4 · 500 | İsteğe bağlı | Yardımcı / opsiyonel hint, density:compact form. |
| --nb-text-overline | 10.5 / 1.4 · 600 · UC | Bu hafta · canlı | Bölüm üstü etiket; section eyebrow, table header. |
| --nb-text-code-inline | 12.5 · ui-mono | npm install | Cümle içi kod parçacığı, token adı, klasör yolu. |
| --nb-text-code-block | 12 / 1.55 · ui-mono | curl -X POST https://api.nexberry.com/v1/orders \
-H "Authorization: Bearer $TOKEN" \
-d '{"branch": "kadikoy"}' | |
| --nb-text-quote | 18 / 1.5 · 400 italic | "Sipariş paneli telefondan açınca cebime sığdı; mutfaktan tablete geçtim." | |
/* Headings */
--nb-text-h1: 600 48px/1.10 var(--nb-font-sans); letter-spacing:-.02em;
--nb-text-h2: 600 36px/1.15 var(--nb-font-sans); letter-spacing:-.02em;
--nb-text-h3: 600 28px/1.20 var(--nb-font-sans); letter-spacing:-.018em;
--nb-text-h4: 600 22px/1.25 var(--nb-font-sans); letter-spacing:-.012em;
--nb-text-h5: 600 18px/1.35 var(--nb-font-sans); letter-spacing:-.006em;
--nb-text-h6: 600 15px/1.40 var(--nb-font-sans);
/* Labels */
--nb-text-label-lg: 500 12.5px/1.4 var(--nb-font-sans);
--nb-text-label-sm: 500 11px/1.4 var(--nb-font-sans);
--nb-text-overline: 600 10.5px/1.4 var(--nb-font-sans);
letter-spacing:.08em; text-transform:uppercase;
/* Code */
--nb-text-code-inline: 12.5px var(--nb-font-mono);
--nb-text-code-block: 12px/1.55 var(--nb-font-mono);
/* Quote */
--nb-text-quote: italic 18px/1.5 var(--nb-font-sans);