Card

Container that groups related content and actions about a single subject.

Card Titles

Card Description

Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sapiente, commodi! Ad maxime totam nisi, enim consectetur fuga facere natus explicabo!

Card Footer

Stats Card

Sales Overview

+20.1% from last month

$42.5k

62.2%

Orders

25.5%

Visits

Total Sales

$75,890.75

+128% from June


User Card

Users

Manage user accounts and permissions.


Product Card

PUMA Smash v2 Sneakers

PUMA Smash v2 Sneakers

(4.5)

Classic tennis-inspired sneakers with a sleek design and everyday comfort.

$60
In Stock

Card Structure

<!-- Card -->
<div class="w-full rounded-lg bg-surface text-surface-text shadow-sm"></div>
 
<!-- Card Header -->
<div class="flex flex-col space-y-1.5 p-4"></div>
 
<!-- Card Title -->
<h3 class="text-2xl font-semibold leading-none tracking-tight">Card Titles</h3>
 
<!-- Card Description -->
<p class="text-sm text-muted-text">Card Description</p>
 
<!-- Card Content -->
<div class="p-4 pt-0"></div>
 
<!-- Card Footer -->
<div class="flex items-center p-4 pt-0"></div>

On this page