Optimotive UI
GitHub →

Beautiful components
for AI-powered apps

A curated library of shadcn/ui-compatible components, blocks, and templates built for the Optimotive platform. Copy, install, ship.

npx shadcn@latest add https://optimotive-ui.dev.optimotive-tools.co.uk/registry.json

3

Components

2

Blocks

2

Templates

shadcn compatible

TS

TypeScript

component

Status Badge

Colored pill badge for agent/system statuses — active, idle, busy, error, pending, offline.

View component →
component

Metric Card

Stat card with icon, large value, label, and trend indicator (up/down %) for dashboards.

View component →
component

Agent Avatar

Circular avatar with colored status ring (online/busy/idle/offline), emoji or initials fallback.

View component →
block

Agent Activity Feed

Scrollable real-time feed of agent actions with avatars, status badges, and relative timestamps.

View component →
block

Stats Overview Grid

4-column responsive grid of MetricCards with sample platform analytics data.

View component →
template

Dashboard Shell

Full-page layout with collapsible sidebar, header, breadcrumb nav, and mobile sheet drawer.

View component →
template

Analytics Dashboard

Full analytics page with stats grid, chart area placeholder, and recent agent activity feed.

View component →