5-day Mini-Course
Build UIs that don’t suck.
Short, tactical video lessons from the creator of Tailwind CSS, delivered directly to your inbox every day for a week.
Elements
A commercial license is required to use Tailwind Plus Elements. Purchase Tailwind Plus to obtain a license.
Tailwind Plus Elements is a JavaScript UI component library that powers all the interactive behavior in our HTML snippets. It has no dependencies on JavaScript frameworks like React, and works with any modern stack—Next.js, Rails, Laravel, Svelte, Astro, or even plain HTML.
Available components
Tailwind Plus Elements includes the following UI components:
Browser support
Elements targets the same modern browsers supported by Tailwind CSS v4.0, and relies on the following minimum versions:
- Chrome 111 (released March 2023)
- Safari 16.4 (released March 2023)
- Firefox 128 (released July 2024)
Installing in your project
The easiest way to install Elements is via the CDN. To do this, add the following script to your project's <head>
tag:
<script src="https://cdn.jsdelivr.net/npm/@tailwindplus/elements@1" type="module"></script>
Alternatively, if you have a build pipeline you can also install it via npm:
npm install @tailwindplus/elements
Next, import Elements into your root layout:
import '@tailwindplus/elements';
Detecting when ready
To view the complete documentation, you must own a Tailwind Plus license and be signed in.
Documentation for LLMs
To view the complete documentation, you must own a Tailwind Plus license and be signed in.