Hide & Show

Class
Properties
hide
visibility: hidden;
opacity: 0;
pointer-events: none;
show
visibility: visible;
opacity: 1;
pointer-events: auto;

Usage

Single import

// tailwind.config.js | tailwind.config.ts

import { hideShow } from "tailwindcss-addons"

export default {
    plugins: [hideShow],
}

Multi import

// tailwind.config.js | tailwind.config.ts

import tailwindcssAddons from "tailwindcss-addons"

export default {
    plugins: [
        ...tailwindcssAddons({
            hideShow: false, // Enabled by default
        }),
    ],
}
Return to top