Cards
Basic Card
Standard card with header, body, and optional footer.
Card Title
Card subtitle text
A basic card component with a header, body, and footer. Use it to group related content together in a clean container.
Notification Card
Body-only card with an icon header for contextual alerts or info.
Image Card
Card with a full-width cover image at the top.
Accent Border Cards
Cards with a colored top border to convey status or category.
Primary
Brand color accent. Use for primary content blocks.
Success
Green accent for positive data or success states.
Info
Blue accent for informational content.
Warning
Amber accent for warnings or pending states.
Colored & Dark Cards
Full background color cards for emphasis sections.
Primary Card
Filled background using the primary brand color. Great for CTAs or featured callouts.
Dark Card
Dark background card. Works in both light and dark mode independently.
Glass Card
Glassmorphism style with blur, transparency, and subtle border.
Icon Cards
Centered icon cards for feature highlights, service listings, or menu grids.
Profile Cards
User/team member cards with cover, avatar, and statistics.
Sarah Chen
UI / UX Designer
48
Projects
1.2k
Followers
96
Tasks
Mark Davis
Senior Developer
72
Projects
3.4k
Followers
143
Tasks
Lisa Park
Product Manager
31
Projects
820
Followers
58
Tasks
Tom Wilson
DevOps Engineer
24
Projects
540
Followers
77
Tasks
Pricing Cards
Three-tier pricing card layout with feature lists and featured highlight.
Starter
$9/mo
Perfect for individuals and small projects.
- 5 Projects
- 10 GB Storage
- Email Support
- Analytics
- Team Access
Pro
$29/mo
For growing teams and professional use.
- Unlimited Projects
- 100 GB Storage
- Priority Support
- Analytics
- Team Access
Enterprise
$99/mo
For large organizations and enterprise needs.
- Unlimited Everything
- 1 TB Storage
- 24/7 Dedicated Support
- Advanced Analytics
- Unlimited Team Access