App Shells

One-viewport app chrome. Complete application surfaces from Dashboard to Calendar to CRM. All Pro. All previewable.

🎉 New: 7 Interactive Shells

Beautiful components for modern apps

Motion-first components and assembled blocks. Free primitives, Pro sections. Built for Next.js with Tailwind CSS.

Everything you need

Built with accessibility and performance in mind

Motion First

Smooth animations with Framer Motion, respecting prefers-reduced-motion

Fully Typed

Complete TypeScript support with full type safety and IntelliSense

Copy & Paste

No package lock-in. You own the code, modify it as needed

Accessible

WCAG compliant components with keyboard navigation support

Responsive

Mobile-first design that works beautifully on all screen sizes

Dark Mode

Built-in dark mode support with system preference detection

Simple, transparent pricing

One-time payment. Lifetime access.

Free

Perfect for trying out Patina

34 free primitives
Community support
TypeScript types
MIT license

Pro

Everything you need to ship

$49/ one-time

All free primitives
58+ pro blocks
28 app shells
Priority support
Lifetime updates
Commercial license

Teams

For growing teams

$199/ one-time

Everything in Pro
5 team seats
Shared workspace
Team billing
Dedicated support

Loved by developers

See what people are saying about Patina

Patina has completely transformed how I build landing pages. The components are beautiful and the code quality is top-notch.

Sarah Chen

Frontend Developer

The attention to detail in these components is incredible. Every animation feels polished and purposeful.

Alex Morgan

Product Designer

Best $49 I've ever spent. Shipped my SaaS landing page in a weekend using Patina blocks.

Jamie Taylor

Indie Hacker

Frequently asked questions

Everything you need to know about Patina

Ready to build something amazing?

Join thousands of developers building beautiful products with Patina.

SaaS Marketing

free

Complete landing: nav, hero, logo cloud, bento, features, pricing, FAQ, footer.

Welcome back

Or continue with

Don't have an account?

By continuing, you agree to our Terms and Privacy Policy

Auth Flow

free

Welcome

Let's get you set up

Thanks for signing up! We'll help you get started in just a few steps.

Quick setup (2-3 minutes)

No credit card required

Cancel anytime

Onboarding Wizard

free

Multi-step user onboarding with progress and validation.

Overview

Live

Total Revenue

$45,231

+12.5% from last month

Active Users

2,847

+8.2% from last month

Conversion Rate

3.6%

+0.4% from last month

Avg. Session

4.2m

-0.3% from last month

Revenue Trend

Last 30 days

Revenue

Top Customers

Alice Johnson

alice@example.com

$12,450

Bob Smith

bob@example.com

$8,230

Carol White

carol@example.com

$5,600

David Lee

david@example.com

$15,890

Emma Davis

emma@example.com

$3,200

All Customers

	Email	Status		Joined
Alice Johnson	alice@example.com	active	$12,450.00	1/15/2024
Bob Smith	bob@example.com	active	$8,230.00	2/20/2024
Carol White	carol@example.com	pending	$5,600.00	3/10/2024
David Lee	david@example.com	active	$15,890.00	1/5/2024
Emma Davis	emma@example.com	inactive	$3,200.00	4/12/2024

0 of 5 row(s) selected.

Page 1 of 1

Dashboard

pro

App chrome with sidebar, topbar, KPI cards, data table, and chart panels.

Profile Settings

Manage your account information and preferences.

Settings

pro

Account, billing, and team settings with tabbed navigation.

React component architecture

GPT-4

Can you help me build a responsive navbar component?

02:28 AM

I'd be happy to help! Here's a responsive navbar component using React and Tailwind CSS. This implementation includes mobile menu support and smooth transitions.

02:29 AM

How can I add a search feature to this navbar?

02:30 AM

Great question! You can add a search feature by integrating a command palette using cmdk. Here's how to implement it with keyboard shortcuts and fuzzy search.

02:31 AM

AI can make mistakes. Check important info.

AI Chat

pro

Chat interface with thread list and composer.

Billing & Usage

Manage your subscription and view billing history

Pro Plan

Active

Unlimited access to all components, blocks, and shells

$0/month

Purchased on January 15, 2024

Payment Method

•••• •••• •••• 4242

Expires 12/25

Usage Overview

Component downloads last 6 months

Total Downloads

477

Avg per Month

79.5

Peak Month

Apr (91)

Growth

+12.8%

Invoice History

	Description		Status
8/1/2024	Pro Plan - August 2024	$49.00	paid
7/1/2024	Pro Plan - July 2024	$49.00	paid
6/1/2024	Pro Plan - June 2024	$49.00	paid
5/1/2024	Pro Plan - May 2024	$49.00	paid
4/1/2024	Pro Plan - April 2024	$49.00	pending

Showing 5 of 8 invoice(s)

Page 1 of 2

Billing Information

john@example.com

Billing Address

123 Main St, San Francisco, CA 94105

Tax ID

US123456789

Next Billing Date

September 1, 2024

Billing Portal

pro

Invoices, plan management, and usage tracking.

v1.0.0

Getting Started

Introduction

Patina is a freemium component library for Next.js. Motion primitives stay public. Marketing blocks unlock once.

What is Patina?

Patina is a companion kit for shadcn/ui that provides motion-first components and assembled marketing blocks. The primitives are always free. The composed sections are Pro.

Quick Tip

All components respect prefers-reduced-motion and work with keyboard navigation.

Key Features

Motion-first — Built on Framer Motion with accessibility in mind
Freemium model — 34 free primitives, 58+ pro blocks
Copy-paste — No package lock-in, you own the code
TypeScript — Full type safety and IntelliSense

Getting Started / Introduction

Documentation

pro

Docs layout with sidebar navigation and content area.

Your security alert

GitHub•10:32 AM

We detected a new sign-in to your account from Chrome on Mac. If this wasn't you, please secure your account immediately by changing your password and reviewing your security settings.

Mail Inbox

pro

Gmail-style mail client with thread list, reading pane, and compose.

Product Roadmap

Q1 2026 Sprint

To Do

Design new landing page

Update documentation

Review PRs

In Progress

Implement auth flow

Fix mobile nav bug

In Review

Add search functionality

Done

Set up CI/CD pipeline

Deploy to staging

Kanban Board

pro

Trello-style board with draggable cards across swim lanes.

November 1-7, 2026

Calendar

pro

Google Calendar-style scheduler with month/week/day views.

Store

Showing 8 products

Sort by

🪔

Shop with product list, detail view, and cart checkout flow.

Contacts

Company	Email	Status		Last Contact
TechCorp Industries	sarah.chen@techcorp.com	customer	$125,000	8/18/2024
Innovate Solutions	m.rodriguez@innovate.io	qualified	$85,000	8/20/2024
DataStream Analytics	ethompson@datastream.com	lead	$45,000	8/19/2024
Cloud Nine Systems	jwilson@cloudnine.com	customer	$210,000	8/17/2024
Nexus Group	l.anderson@nexusgroup.com	qualified	$67,000	8/21/2024
Quantum Technologies	dpark@quantum.io	lead	$52,000	8/16/2024
Apex Ventures	jmartinez@apex.com	customer	$178,000	8/15/2024
Fusion Enterprises	rtaylor@fusion.com	churned	$0	6/12/2024

0 of 8 row(s) selected.

Page 1 of 1

CRM

pro

Customer relationship management with contacts table, detail views, and sales pipeline.

Overview

Total Users

24,583

+12.3%vs last period

Revenue

$128,420

+18.7%vs last period

Conversion Rate

3.42%

+0.8%vs last period

Avg. Session

4m 32s

-0.5%vs last period

Revenue Trend

Daily

Revenue

Traffic Sources

SessionsShare %

Top Pages

/products

8,234 views

32% bounce

/blog/getting-started

6,482 views

28% bounce

/pricing

5,921 views

45% bounce

5,103 views

38% bounce

/about

3,827 views

52% bounce

Devices

Desktop58%

Mobile35%

Tablet7%

Analytics

pro

Analytics dashboard with charts, KPIs, date range selector, and interactive visualizations.

Users

Total Users

Active

Suspended

Pending

	Role	Status	Last Seen	Created
E Emma Wilson emma@example.com	admin	active	805d ago	1/15/2024
J James Chen james@example.com	editor	active	805d ago	2/20/2024
S Sarah Martinez sarah@example.com	editor	active	806d ago	3/10/2024
M Michael Brown michael@example.com	user	suspended	811d ago	4/5/2024
L Lisa Taylor lisa@example.com	viewer	active	805d ago	5/12/2024
D David Kim david@example.com	user	pending	807d ago	8/18/2024
J Jennifer Lee jennifer@example.com	editor	active	805d ago	6/8/2024
R Robert Garcia robert@example.com	user	active	806d ago	7/22/2024

0 of 8 row(s) selected.

Page 1 of 1

Admin

pro

Admin dashboard with users table, role management, and audit log tracking.

Projects

Folder

Documents

Folder

Photos

Folder

Videos

Folder

Presentation.pdf

2.4 MB

Screenshot.png

1.2 MB

Meeting_Recording.mp4

45.8 MB

Podcast_Episode.mp3

12.3 MB

Report_Q2.docx

856 KB

index.tsx

8.5 KB

Files

pro

File manager with folders, list and grid views, upload affordance, and file operations.

All Tickets

No ticket selected

Select a ticket to view details

Support

pro

Support ticket system with inbox, thread view, status management, and response composer.

Library

Midnight Dreams

The Soundscapes

Night Sessions