Metric components

Powerful and customizable React metric components built for modern applications and websites. These metric components are built using React Aria and styled with Tailwind CSS.

Metrics example

Get the code

View 24 hours

2,000

100%

vs last month

Installation

You can add this metrics component using our CLI or manually:

CLI

Manual

npx untitledui@latest add metrics

Metrics examples

Below are examples and variations of this metrics component:

Simple

Get the code

Views 24 hours

2,000

100%

Simple actions

Get the code

Views 24 hours

2,000

100%

View report

Metrics icon 01

Get the code

View 24 hours

2,000

100%

Metrics icon actions 01

Get the code

View 24 hours

2,000

100%

View report

Metrics icon 02

Get the code

View 24 hours

2,000

100%

vs last month

Metrics icon actions 02

Get the code

View 24 hours

2,000

100%

vs last month

View report

Metrics icon 03

Get the code

View 24 hours

2,000

100%

vs last month

Metrics icon actions 03

Get the code

View 24 hours

2,000

100%

vs last month

View report

Metrics icon 04

Get the code

View 24 hours

2,000

100%

Metrics icon actions 04

Get the code

View 24 hours

2,000

100%

View report

Chart 01

Get the code

View 24 hours

2,000

100%

vs last month

Chart actions 01

Get the code

View 24 hours

2,000

100%

vs last month

View report

Chart 02

Get the code

View 24 hours

2,000

100%

Chart actions 02

Get the code

View 24 hours

2,000

100%

View report

Chart 03

Get the code

View 24 hours

2,000

100%

vs last month

Chart actions 03

Get the code

View 24 hours

2,000

100%

vs last month

View report

Chart 04

Get the code

View 24 hours

2,000

100%

vs last month

Chart actions 04

Get the code

View 24 hours

2,000

100%

vs last month

View report

Radar charts Slideout menus