Typography
ContentHệ thống typography đầy đủ — Heading, Text, Paragraph, Code, Kbd, Link, Mark và hơn thế nữa.
Heading
6 mức tiêu đề.
Heading 1 — The quick brown fox
Heading 2 — The quick brown fox
Heading 3 — The quick brown fox
Heading 4 — The quick brown fox
Heading 5 — The quick brown fox
Heading 6 — The quick brown fox
Text — Sizes & Weights
Sizes
Extra Small (xs)Small (sm)Medium — defaultLarge (lg)Extra Large (xl)Weights
Light (300)Normal (400)Medium (500)Semibold (600)Bold (700)Decorations & Colors
Strong — Bold textItalic — slanted textUnderlined textStrikethrough textGradient text effect
PrimarySuccessWarningDangerMuted
Paragraph & Lead
Lead paragraph — intro text dành cho phần mở đầu.
Regular paragraph với line-height relaxed. Typography tốt giúp người đọc dễ theo dõi.
Muted paragraph — dùng cho chú thích, mô tả phụ.
Code, Kbd & Blockquote
Chạy lệnh npm install @base-ui/react để cài đặt.
Copy Ctrl+CSave ⌘+S
Design is not just what it looks like. Design is how it works.
Link & Mark
defaultprimarysuccesswarningdanger
API Reference
| Prop | Type | Default | Mô tả |
|---|---|---|---|
size | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | md | Kích thước text |
weight | 'light' | 'normal' | 'medium' | 'semibold' | 'bold' | normal | Độ đậm |
color | 'primary' | 'success' | 'warning' | 'danger' | 'muted' | — | Màu sắc |
level | 1 | 2 | 3 | 4 | 5 | 6 | — | Mức heading (Heading component) |