sajad torkamani

Install packages

Ensure you’ve setup the open-source version of Tailwind

Install the Headless UI package for the JavaScript behaviour and the Heroicons package for icons:

npm install @headlessui/react @heroicons/react

Optional: Add the Inter font family

Add CDN link:

<link rel="stylesheet" href="">

Configure tailwind.config.js:

// tailwind.config.js
const defaultTheme = require('tailwindcss/defaultTheme')

module.exports = {
  theme: {
    extend: {
      fontFamily: {
        sans: ['Inter var', ...defaultTheme.fontFamily.sans],
  // ...

Restart your Tailwind script. For create-react-app projects, quit your dev server and run:

npm run start