Component Playground
A comprehensive showcase of all UI components in the Omega design system
Buttons
Variants
Sizes
States
Full Width
Typography
Headings
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Text Sizes
Extra small text
Small text
Base text (default)
Large text
Extra large text
Text Weights
Light weight
Normal weight
Medium weight
Semibold weight
Text Colors
Primary color
Secondary color
Muted color
Badges
Variants
Sizes
Form Elements
This field is required
Cards
Basic Card
This is a basic card with a title and content. Cards are useful for grouping related information.
Card with Footer
This card includes a footer section with action buttons.
Card with Badge
This card demonstrates using badges within cards.
Stat Cards
Total Users
1,234
+12.5%
Active Sessions
856
+8.2%
Revenue
$45,678
-5.3%
Conversion Rate
3.24%
+0.5%
Page Headers
Simple Page Header
A page header with just a title and description
Page Header with Actions
This header includes action buttons
Pagination
Basic Pagination
Middle Page
Last Page
Combined Example
User Dashboard
Manage your account settings and preferences
Messages
1,234
+12.5%
Artifacts
56
+8.2%
Documents
89
-5.3%
Component Playground • Omega Design System