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.

Get the free course

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.