Getting Started
UI Library
- Button
- Date Picker
- Field
- Fields
- Input Group
- File Uploader
- Signature Pad
- Text Area
- Container
- Section Header
- Separator
- Spacer
- Action Row
- Breadcrumb
- Tabs
- Tabs Container
- Card
- Image
- Text
- Title
- Video Player
- Card Collection
- Data Grid
- List Collection
- Table Collection
- Bar Chart
- Big Number
- Line Chart
- Radial Chart
- Hint
- Progress
- Spinner
- Skeleton
- Toast
- Sheet
- Dialog
- Real-world patterns
- Primitives
A lightweight component for section and page headers.
Basic Usage
Welcome to Our Platform
Get started with our powerful tools and features
With Emphasis Text
Add emphasis text above the title for categorization or context:
Getting Started
Quick Start Guide
Learn the basics in just a few minutes
With Image
Include an image alongside your section header:
About Our Company
Building the future of technology
Size Variants
Compact Size
Use the compact size for tighter spaces:
Quick Section
This uses the compact size variant
Compact with Image
Products
Browse our collection
Full Example
Combining all features:
Featured
Premium Services
Discover our top-tier offerings designed for professionals
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| title | string | required | The main heading text |
| subtitle | string | - | Optional descriptive text |
| emphasis | string | - | Optional small caps text above title |
| imageUrl | string | - | Optional image URL |
| imageAlt | string | "" | Alt text for image |
| size | "default" | "compact" | "default" | Size variant |
| className | string | - | Additional CSS classes |