Stat
Statistical data display component
Class Reference Basic
Variants
Total Likes
25.6K
21% more than last month
Page Views
2.6M
21% more than last month

Tasks done
86%
31 tasks remaining
Div(
Div(
Div(Icon.heart(), cls='stat-figure text-primary'),
Div('Total Likes', cls='stat-title'),
Div('25.6K', cls='stat-value text-primary'),
Div('21% more than last month', cls='stat-desc'),
cls='stat'
),
Div(
Div(Icon.lightning(), cls='stat-figure text-secondary'),
Div('Page Views', cls='stat-title'),
Div('2.6M', cls='stat-value text-secondary'),
Div('21% more than last month', cls='stat-desc'),
cls='stat'
),
Div(
Div(
Div(
Img(src='https://img.daisyui.com/images/stock/photo-1534528741775-53994a69daeb.webp'),
cls='w-16 rounded-full'
),
cls='avatar'
),
Div('Tasks done', cls='stat-title'),
Div('86%', cls='stat-value'),
Div('31 tasks remaining', cls='stat-desc text-secondary'),
cls='stat'
),
cls='stats shadow'
)
Auto-import documentation coming soon...
Downloads
31K
Jan 1st - Feb 1st
New Users
4,200
↗︎ 400 (22%)
New Registers
1,200
↘︎ 90 (14%)
Div(
Div(
Div(Icon.info(), cls='stat-figure text-secondary'),
Div('Downloads', cls='stat-title'),
Div('31K', cls='stat-value'),
Div('Jan 1st - Feb 1st', cls='stat-desc'),
cls='stat'
),
Div(
Div(Icon.settings(), cls='stat-figure text-secondary'),
Div('New Users', cls='stat-title'),
Div('4,200', cls='stat-value'),
Div('↗︎ 400 (22%)', cls='stat-desc'),
cls='stat'
),
Div(
Div(Icon.archive(), cls='stat-figure text-secondary'),
Div('New Registers', cls='stat-title'),
Div('1,200', cls='stat-value'),
Div('↘︎ 90 (14%)', cls='stat-desc'),
cls='stat'
),
cls='stats shadow'
)
Auto-import documentation coming soon...
Layouts
Downloads
31K
From January 1st to February 1st
Users
4,200
↗︎ 40 (2%)
New Registers
1,200
↘︎ 90 (14%)
Div(
Div(
Div('Downloads', cls='stat-title'),
Div('31K', cls='stat-value'),
Div('From January 1st to February 1st', cls='stat-desc'),
cls='stat place-items-center'
),
Div(
Div('Users', cls='stat-title'),
Div('4,200', cls='stat-value text-secondary'),
Div('↗︎ 40 (2%)', cls='stat-desc text-secondary'),
cls='stat place-items-center'
),
Div(
Div('New Registers', cls='stat-title'),
Div('1,200', cls='stat-value'),
Div('↘︎ 90 (14%)', cls='stat-desc'),
cls='stat place-items-center'
),
cls='stats shadow'
)
Auto-import documentation coming soon...
Downloads
31K
Jan 1st - Feb 1st
New Users
4,200
↗︎ 400 (22%)
New Registers
1,200
↘︎ 90 (14%)
Div(
Div(
Div('Downloads', cls='stat-title'),
Div('31K', cls='stat-value'),
Div('Jan 1st - Feb 1st', cls='stat-desc'),
cls='stat'
),
Div(
Div('New Users', cls='stat-title'),
Div('4,200', cls='stat-value'),
Div('↗︎ 400 (22%)', cls='stat-desc'),
cls='stat'
),
Div(
Div('New Registers', cls='stat-title'),
Div('1,200', cls='stat-value'),
Div('↘︎ 90 (14%)', cls='stat-desc'),
cls='stat'
),
cls='stats stats-vertical shadow'
)
Auto-import documentation coming soon...
Downloads
31K
Jan 1st - Feb 1st
New Users
4,200
↗︎ 400 (22%)
New Registers
1,200
↘︎ 90 (14%)
Div(
Div(
Div('Downloads', cls='stat-title'),
Div('31K', cls='stat-value'),
Div('Jan 1st - Feb 1st', cls='stat-desc'),
cls='stat'
),
Div(
Div('New Users', cls='stat-title'),
Div('4,200', cls='stat-value'),
Div('↗︎ 400 (22%)', cls='stat-desc'),
cls='stat'
),
Div(
Div('New Registers', cls='stat-title'),
Div('1,200', cls='stat-value'),
Div('↘︎ 90 (14%)', cls='stat-desc'),
cls='stat'
),
cls='stats stats-vertical lg:stats-horizontal shadow'
)
Auto-import documentation coming soon...
Custom
Account balance
$89,400
Current balance
$89,400
Div(
Div(
Div('Account balance', cls='stat-title'),
Div('$89,400', cls='stat-value'),
Div(
Button('Add funds', cls='btn btn-sm btn-success'),
cls='stat-actions'
),
cls='stat'
),
Div(
Div('Current balance', cls='stat-title'),
Div('$89,400', cls='stat-value'),
Div(
Button('Withdrawal', cls='btn btn-sm'),
Button('Deposit', cls='btn btn-sm'),
cls='stat-actions'
),
cls='stat'
),
cls='stats bg-primary text-primary-content'
)
Auto-import documentation coming soon...
Class Reference
Class | Type | Description |
---|---|---|
stats | Component | Base stat items container |
stat | Part | Display a stat |
stat-title | Part | Stat title text |
stat-value | Part | Main stat value |
stat-desc | Part | Description text |
stat-figure | Part | Icon/image container |
stat-actions | Part | Actions part container |
stats-horizontal | Direction | Horizontal layout [default] |
stats-vertical | Direction | Vertical layout |
Do you have a question? ask the community
Do you see a bug? open an issue on GitHub
LLMs Context: Full Markdown | This Component