Tailwind Plus· Design Systemtailwindcss.com

Official Tailwind components · by Tailwind Labs

Beautiful components, crafted by Tailwind.

Tailwind Plus includes 500+ marketing and admin components, 300+ e-commerce templates, and Catalyst — a modern React UI kit. Built by the team behind Tailwind CSS itself.

Color Palette23 tokens

background#ffffff

surface#f8fafc

ink#000000

ink-soft#0a0a0a

slate-900#0f172a

slate-700#334155

slate-500#64748b

slate-300#cbd5e1

slate-200#e2e8f0

slate-100#f1f5f9

slate-50#f8fafc

primary#0ea5e9

primary-light#38bdf8

success#10b981

warning#f59e0b

error#ef4444

on-primary#ffffff

on-ink#ffffff

border#e2e8f0

shadow-inset-rest#f2f2f2

shadow-inset-hover#ebebeb

shadow-popover#e6e6e6

shadow-modal#d1d1d1

Buttons

TypographyGoogle Font

Schibsted Groteskbrand uses InterVariable

display-huge

The official library.

96px · 400 · -4.8px

display-hero

Three kits, one license

60px · 400 · -1.5px

display-light

Tailwind Plus includes 500+ marketing and admin components, 300+ e-commerce templates, and Catalyst — a modern React UI kit. Built by the team behind Tailwind CSS itself.

60px · 300 · 0px

display-medium

import { Button } from '@tailwindplus/catalyst'

60px · 500 · 0px

Tailwind Plus includes 500+ marketing and admin components, 300+ e-commerce templates, and Catalyst — a modern React UI kit. Built by the team behind Tailwind CSS itself.

40px · 500 · -1px

IconsSolar

Set: Solar · brand-matched

Formfocus ring

you@company.com

Password

••••••••

Card · Shapes

Three kits, one license

Tailwind Plus includes 500+ marketing and admin components, 300+ e-commerce templates, and Catalyst — a modern React UI…

Design System

none

Elevation

RING

CARD

ELEVATED

Controls

Off

✓Checked

Unchecked

Selected

Option

Alerts

Heads up — a new version of the design system is available.

Saved. Your changes are live across all surfaces.

Some tokens are missing a contrast-safe pairing.

Couldn’t reach the server. Retry in a moment.

Badges

SolidSoftOutlineNewv2.0

FAQ

Three kits, one license

Tailwind Plus includes 500+ marketing and admin components, 300+ e-commerce templates, and Catalyst — a modern React UI kit. Built by the team behind Tailwind CSS itself.

How does it integrate with my stack?

Is there a free tier?

Tabs

OverviewActivitySettings

DayWeekMonth

Stats

48.2k

Active users

+12.4%

$12.8k

MRR

+3.1%

99.9%

Uptime

−0.02%

Table

Member	Plan	Status
AQAvery Quinn	Pro	Active
JLJordan Lee	Team	Pending
SRSam Rivera	Free	Active

Avatars

AQJLSR+5

Avery Quinn

Online · Owner

Slider · Progress

Volume62%

Storage used78%

Tooltip · Popover

Brand-styled tooltipHover target

Navigation bar

Banner

Pricing

Pro

$24 /mo

Unlimited projects
Priority support
Custom domains

Stepper

CartDetails3Payment4Review

Breadcrumb

HomeDesign SystemTailwind Plus

Toast

Changes savedUndo

You have 3 new updates

Activity

Avery created a new project

2h ago

Jordan left a comment

5h ago

Sam shipped v2.0

1d ago

Notifications

AQAvery Quinn invited you to Tailwind Plus.

2 minutes ago

JLJordan Lee approved your design tokens.

1 hour ago

SRSam Rivera mentioned you in a thread.

Yesterday

Code

theme.ts

// Tailwind Plus tokens
export const theme = {
  primary: "#0ea5e9",
  radius: "12px",
}

Calendar

March 2026

SMTWTFS28291234567891011121314151617181920212223242526272829303112

No resultsTry adjusting your filters or search for something else.

Pagination

‹123…12›

Brand moment

Tailwind Plus is the library the Tailwind team would build for themselves if they were shipping a product.

Tailwind Plus · Design System