Skip to content
Index730 resources
Tailwind CSS

Tailwind CSS

Utility-first CSS framework; v4 configures theming in CSS, not JS

Tier S · Best in classToolDesign System Docstailwindcss.com

(Visit tailwindcss.com ↗)(Docs)(Repository)
Preview image from tailwindcss.com

Tailwind CSS is the utility-first framework the modern component ecosystem is built on: you compose interfaces from classes like `flex`, `pt-4` and `rotate-90` instead of writing bespoke stylesheets. Version 4 (v4.3 at time of check) moves configuration out of `tailwind.config.js` and into CSS — `@import "tailwindcss"` plus an `@theme` block whose variables (`--color-*`, `--font-*`, `--text-*`, `--spacing-*`, `--radius-*`, `--shadow-*`, `--breakpoint-*`, `--container-*`, `--animate-*` and more) both emit real CSS custom properties and generate the matching utilities. Install paths include a Vite plugin, PostCSS, a standalone CLI and a Play CDN. The framework itself is MIT and free; Tailwind Plus (500+ UI blocks, 13+ templates, the Catalyst UI kit) is a separate paid product on the same site.

Install
npm install tailwindcss @tailwindcss/vite

For an agent

Assume v4 unless the repo proves otherwise: there is no `tailwind.config.js` to generate — write `@import "tailwindcss";` and an `@theme` block, and install `@tailwindcss/vite` rather than the old `postcss` + `autoprefixer` trio. Porting v3 advice into a v4 project is the single most common failure here, as is inventing a token name; every `--color-*` or `--spacing-*` you define in `@theme` becomes a utility, so define the token instead of reaching for an arbitrary value like `bg-[#123456]`. Pair with shadcn/ui or Radix for behaviour, since Tailwind ships utilities and design tokens only — no components — and note that the 500+ Tailwind Plus blocks you may recall are paid and must not be reproduced from memory.

Why it is here. It is the substrate the rest of this index assumes: nearly every registry, block collection and template here emits Tailwind classes, so its v4 CSS-first theming defines how tokens flow through the whole ecosystem.

Install command, framework, licence and component list.

Facts

License
MIT, Commercial license
Pricing
Free, Open source, One-time purchase
Framework
Vanilla JS, React, Next.js, Vue, Nuxt, Svelte, SvelteKit, Solid, Angular, Astro, Remix
Styling
Tailwind CSS v4, Tailwind CSS, CSS custom properties
Distribution
npm package, CLI installer, GitHub repository, Direct download / asset pack
Platform
Web
Content type
Code, Design tokens / theme files, Prose / writing
Agent readiness
CLI installable, Structured documentation, Readable open source
Accessibility
Semantic HTML, Not applicable
Maturity
Actively maintained
Pricing detail
Tailwind CSS itself is free and MIT. Tailwind Plus is a one-time purchase: $299 personal, $979 team (up to 25 people), both plus local tax, with lifetime updates and a 30-day refund window; reselling templates or building page builders from them is not permitted.
GitHub stars
97,200
Package
tailwindcss

Templates

13

Notable for

  • v4 CSS-first @theme configuration
  • 97.2k stars, MIT
  • Vite plugin, PostCSS, CLI and Play CDN install paths
  • theme variables double as CSS custom properties
  • Tailwind Plus sold separately at $299/$979

Provenance

Verified 2026-08-15. HTTP 200. https://tailwindcss.com/, https://tailwindcss.com/docs/installation/using-vite, https://tailwindcss.com/docs/theme, https://tailwindcss.com/plus, https://github.com/tailwindlabs/tailwindcss, curl check on https://tailwindcss.com/llms.txt (404)

Also in Component Libraries

6
tailwindcss.comTier S