State Indicator Tabs

A shadcn/ui registry item that keeps the tabs API familiar while adding a separate indicator for each state — active and hover.

Overview

View your key metrics and recent project activity. Track progress across all your active projects.

You have 12 active projects and 3 pending tasks.

Installation

pnpm dlx shadcn@latest add https://shadcn-state-indicator-tabs.vercel.app/r/state-indicator-tabs.json

Arrow keys move focus first and Enter or Space commits the selection.

Selecting a tab smoothly scrolls it toward the center when space allows.

An underline-only treatment keeps the tabs lighter and more navigation-like.

A stacked layout for settings-style pages, side panels, and dashboards.