Stat
Surface KPIs and key metrics with compact stat cards.
x-t-stat
Preview and Examples
Monthly Revenue
$48,294
+12.4% vs last month
New Signups
1,284
+8.1% this week
Avg Response Time
187ms
Down from 243ms
<x-t-stat variant="primary" shadow> <x-slot:icon><i class="fa-solid fa-chart-line"></i></x-slot:icon> <x-slot:title>Monthly Revenue</x-slot:title> <x-slot:value>$48,294</x-slot:value> <x-slot:description>+12.4% vs last month</x-slot:description></x-t-stat>
Attributes
| Name | Type | Options | Description |
|---|---|---|---|
| accent | boolean |
true
false
|
Adds an accent |
| border | boolean |
true
false
|
Adds a border |
| divide | boolean |
true
false
|
Adds a divide between elements |
| hollow | boolean |
true
false
|
Removes background colour |
| icon | string |
string
|
Adds an icon |
| ring | boolean |
true
false
|
Adds a ring |
| rounded | boolean |
true
false
|
Adds rounded corners |
| shadow | boolean |
true
false
|
Adds a shadow |
| size | string |
xs
sm
md
lg
xl
2xl
|
Controls component scale |
| variant | string |
default
brand
primary
secondary
success
warning
danger
light
dark
|
A variant is like a colour palette |