mjwebs/tailwindcss-frosted

A TailwindCSS plugin that provides a set of frosted classes to create a modern illusion of layering for modals and slide-over elements.

tailwindcss-frosted

A TailwindCSS plugin that provides a set of frosted classes to create a modern layering effect for modals and slide-over elements.

<section class="p-5 shadow frosted">
  <span>
    <!-- Modal or slide-over content -->
  </span>
</section>

Installation

Install the plugin from npm:

npm install @mjwebs/tailwindcss-frosted

Then add the plugin to your tailwind.config.js file:

// tailwind.config.js
module.exports = {
  theme: {
    // ...
  },
  plugins: [
    require('@mjwebs/tailwindcss-frosted'),
    // ...
  ],
}