Tailwind Plus Components

Official premium component collection by the Tailwind CSS team - 500+ professionally designed, responsive components in React, Vue, and HTML, plus site templates and the Catalyst UI kit.

Source baseline: raw/obsidian/Tailwind CSS Components - Tailwind Plus.md. Source: raw/obsidian/Tailwind CSS Components - Tailwind Plus.md

What's Included

Three categories: Marketing (hero sections, feature grids, pricing tables, testimonials), Application UI (forms, tables, navigation, modals, sidebars), and Ecommerce (product grids, checkout flows, cart components). Uses Headless UI for interactive behaviors.

Catalyst UI Kit

Full application UI kit with pre-built layouts, navigation patterns, and form components. Designed as a starting point for dashboard and admin interfaces.

Pricing

One-time purchase: $149/package or $299 for everything. Lifetime access with free updates. Team licensing available. Usable across unlimited projects. Designed for Tailwind CSS v4.2.

When to Use

Tailwind Plus for polished marketing and application UI when you need production-quality templates fast. Shadcn UI Ecosystem for composable primitives when building a custom design system. They complement each other - Tailwind Plus for speed, shadcn for flexibility.

Usage Contract

Use Tailwind Plus when Prefer another source when
You need a polished starting layout quickly The product has a mature local design system
The surface is marketing, ecommerce, or common SaaS UI The interaction needs custom behavior primitives
You will adapt tokens and content immediately You are likely to ship the template unchanged
Speed matters more than owning every primitive Accessibility or behavior must come from Radix/shadcn primitives

Proof

A Tailwind Plus import is done only after the component has been retokened, stripped of irrelevant sections, tested in the actual viewport, and checked against CSS UI Enforcement. Template aesthetics are not product fit by default. They are a starting debt.

Style Rule Contract

This page follows Style Rule Contract: name the default pattern, banned pattern, reason, exception, proof, and codification path clearly enough that the next agent can apply the rule without asking Kevin again. If a local repo has a stricter rule, follow the local rule and update the wiki when the decision becomes durable.


Timeline