Foundations
Typography
Inter is the sole typeface across all Comitor surfaces. It loads via next/font/google with weights 400–800 and the Vietnamese subset included.
Type scale — live samples
Design system · v1.0
text-xs font-bold tracking-[0.18em] uppercase
Comitor ships a single typeface — Inter — across every product surface. Generous line height ensures readability in dense admin UIs and marketing copy alike.
text-base leading-relaxed
The quick brown fox jumps over the lazy dog.
text-xl md:text-2xl font-semibold
The quick brown fox jumps over the lazy dog.
text-3xl md:text-4xl font-bold tracking-tight
The quick brown fox jumps over the lazy dog.
text-5xl md:text-6xl font-extrabold tracking-tight
Type scale table
| Name | Tailwind classes | Size | Line-height | Usage |
|---|---|---|---|---|
| Eyebrow | text-xs font-bold tracking-[0.18em] uppercase | 12px | 1.5 | Section labels, chip tags |
| Body | text-base leading-relaxed | 16px | 1.6 | Prose, descriptions, labels |
| H3 | text-xl md:text-2xl font-semibold | 20–24px | 1.3 | Card titles, subsections |
| H2 | text-3xl md:text-4xl font-bold tracking-tight | 30–36px | 1.2 | Page section headings |
| Display H1 | text-5xl md:text-6xl font-extrabold tracking-tight | 48–60px | 1.08 | Hero headings, marketing |
Rules
Do not
- Do not introduce additional font families — Inter covers all weight and style needs.
- Do not set body text smaller than 14px in any product surface.
- Do not use decorative or serif fonts even as accents.