# Patina UI

Patina is a premium shadcn companion kit with motion-first components, marketing blocks, full app shells, and production templates.

## Pricing

- Free: Motion primitives, basic components, and 3 starter shells
- Pro ($49 one-time): All blocks, shells, and templates
- Deluxe ($119 one-time): Pro + theme customizer + form kit + priority support

## Registry

- @patina: Free components and blocks
- @patina-pro: Pro and Deluxe items

## Catalog Stats

- Total items: 289
- Free items: 156
- Pro items: 133
- Primitives: 92
- Components: 47
- Blocks: 122
- Shells: 19
- Templates: 9

## Categories

- application
- buttons
- cards
- charts
- chrome
- content
- controls
- convert
- data
- effects
- features
- feedback
- forms
- heroes
- inputs
- modals
- motion
- social
- templates
- text
- wow

## Installation

Add to your components.json:

```json
{
  "registries": {
    "@patina": "https://patina.nicostran.com/r/{name}.json"
  }
}
```

Then install any component:

```bash
npx shadcn@latest add @patina/marquee
npx shadcn@latest add @patina/shimmer-button
npx shadcn@latest add @patina/dock
```

## Featured Free Components

- Shimmer Button (@patina/shimmer-button): A brass-light sweep across a pressable button.
- Button (@patina/button): Button variants with multiple sizes, states, and icon support.
- Marquee (@patina/marquee): Pause-on-hover infinite strip. Never locked.
- Dock (@patina/dock): Magnifying icon rail. Never locked.
- Ink Bleed (@patina/ink-bleed): Headline letters bloom like wet ink on paper.
- Patina Oxidize (@patina/patina-oxidize): A brass surface that slowly greens and pits on hover.
- Filament Script (@patina/filament-script): A thin glowing wire writes an SVG path like a signature.
- Typing Terminal (@patina/typing-terminal): Caret-driven typewriter in a terminal chrome.
- Device Mock (@patina/device-mock): iPhone and browser chrome frames for content previews.
- Stepper (@patina/stepper): Progress indicator for multi-step flows.

## Featured Shells

- SaaS Marketing (@patina/shell-saas-marketing): Complete landing: nav, hero, logo cloud, bento, features, pricing, FAQ, footer. [free]
- Auth Flow (@patina/shell-auth): Login and signup screens as a complete product surface. [free]
- Onboarding Wizard (@patina/shell-onboarding): Multi-step user onboarding with progress and validation. [free]
- Dashboard (@patina/shell-dashboard): App chrome with sidebar, topbar, KPI cards, data table, and chart panels. [pro]
- Settings (@patina/shell-settings): Account, billing, and team settings with tabbed navigation. [pro]
- AI Chat (@patina/shell-ai-chat): Chat interface with thread list and composer. [pro]

## Templates

Full production templates live at https://patina.nicostran.com/templates

- Studio: Design studio landing: work, services, selected projects, process, contact. Quiet editorial style. [pro]
- Launch: Product waitlist page: email capture with state update, social proof, FAQ, footer. One sharp product story. [pro]
- DevTools: Developer-tool landing: command chip, code sample toggle, features, pricing teaser, docs CTA. [pro]
- Atelier: Production multi-page studio template. Home, work index, work detail, about, contact. Light + dark themes, motion, working form. [pro]
- Slate: Production task template: inbox, list, board, calendar, projects, settings, task detail. Full task management with typed mock data. [pro]
- Ledger: Production admin template with data-grid, kanban board, filters, and multi-route architecture. Brass/paper design. [pro]
- Relay: Production support inbox: inbox list, thread view, customers, reports with computed stats, settings with saved replies. Intercom/Front-class support ops. [pro]
- Mercer: Production commerce admin: ops home with GMV stats, orders table, order detail with fulfillment, products with variants, inventory management, customer order history. Surge-class commerce ops. [pro]
- Pilot: Production AI agent operations console: run queue, step traces, approval inbox, tool matrix, evals, token spend. Multi-route ops dashboard. [pro]

## MCP Integration

Patina provides an MCP server for AI agents at https://patina.nicostran.com/api/mcp

Available tools:
- search: Query catalog by name, description, or category
- list_catalog: List items by kind (component/block/shell) and tier
- get_item: Get full details for a catalog item
- get_install_command: Get the exact installation command for an item

Learn more: https://patina.nicostran.com/mcp

## Links

- Website: https://patina.nicostran.com
- Components: https://patina.nicostran.com/components
- Blocks: https://patina.nicostran.com/blocks
- Shells: https://patina.nicostran.com/shells
- Templates: https://patina.nicostran.com/templates
- Documentation: https://patina.nicostran.com/docs
- Pricing: https://patina.nicostran.com/pricing