Set up

Opening the files.

Every popup comes on a complete HTML file with the head and body tags

Open the HTML file with a code editor and if you do not have Tailwind installed or the CDN no worries, the link is included on the file, but is comented. If you want to learn how to install it locally, feel free to look at their docs.

Plugins

The popups are using the Forms plugin. It is not necesary for the pop ups to work, this plugin styles your forms, inputs, checkboxes... Download it here if you want and need:

Style

Colors are amazing, and some of them are used on the popups, you can get the list on Tailwind's documentation page.

Good to know

  • The pop ups are only coded with HTML and style with Tailwind CSS classes, you will have to make them dinamic yourself, at the moment.
  • All the popups comes with coment so you know what is what.

Quick look into the code

The classes are sorted with Headwind, a VS Code plugin to sort Tailwind Classes and is the standard way to sort them is not needed, but you get it here: