Search

Search components and blocks

Sign in

Analytics Blocks

Dashboards and trackers that make numbers easy to scan.

Analytics Tracker

A four-metric site tracker covering API uptime, SEO score, visitors and error budget. Each card pairs a count-up number and a trend chip with a bar of fine ticks that recolor left to right to show progress against target. A 24h / 7d / 30d switcher (sliding pill) swaps the readings: numbers roll from their previous value, ticks re-sweep, and chips pop in. Cards enter with a staggered blur-in and lift on hover.

pnpm dlx shadcn@latest add @ditherui/analytics-tracker

Site tracker

API, SEO and traffic at a glance

API uptime0.03%

0.00%

2.9M requests
SEO score5%

0/100

5 issues open
Visitors3.1%

0.0K

of 70K weekly goal
Error budget left8%

0%

6.2 min downtime

Install

$ pnpm dlx shadcn@latest add @ditherui/analytics-tracker

Props

className / ...div propsReact.ComponentProps<"div">—

Suggested components