Stat
Display numerical data at a glance. Use Stats as a
container for one or more Stat items. Each stat has a
title, value, description, optional figure slot, and optional actions
slot.
Single stat
Minimal: title + value + description.
With figures (icons)
Use the figure slot for an icon, avatar, or badge beside
the stat value.
Colored values
Use DaisyUI color classes inside the value prop — or pass
raw HTML via the default slot to color specific text.
Centered
Add centered to align all content to the center of each
stat cell.
Vertical layout
Pass direction="vertical" to stack stats in a column.
Responsive
Stack vertically on small screens, horizontal on larger screens via
Tailwind responsive classes on classes.
With actions
Use the actions slot to add buttons or links inside the
stat.
Colored backgrounds
Apply a background color to individual stat cells via classes.
Avatar figure
The figure slot accepts any element — here using an avatar image.