Usage card

Animated credit usage card with period tabs, stacked breakdown, daily chart and plan limits.

Installation

Set your access key from Account as NEXTUI_TOKEN in .env.local and add the @nextui namespace below to components.json once. Then it installs by name, like any free item.

$pnpm dlx shadcn@latest add @nextui/features-01

1{
2  "registries": {
3    "@nextui": {
4      "url": "https://tinistudio.vercel.app/r/{name}.json",
5      "headers": { "Authorization": "Bearer ${NEXTUI_TOKEN}" }
6    }
7  }
8}