Tailwind CSS Modal

This tailwind example is contributed by Krishna Gudpalle, on 21-Aug-2022. Component is made with Tailwind v3.4. similar terms for this example are popup,dialog

Modal

Author Krishna Gudpalle

Tailwind v3.4 12.8k 12

Fork Fullscreen

<div class="ml-3">
		<h2 class="font-semibold text-gray-800">Alert Component</h2>
		<p class="mt-2 text-sm text-gray-600 leading-relaxed">Etiam finibus velit vel lacus cursus porttitor ac rhoncus leo. Ut gravida justo est, sit amet vulputate felis vestibulum eleifend. Vivamus faucibus augue a scelerisque rutrum. Donec faucibus nibh ex, in condimentum quam viverra in.</p>
	  </div>
	</div>

<div class="flex justify-end items-center mt-3">
	  <button class="px-4 py-2 bg-gray-100 hover:bg-gray-200 text-gray-800 text-sm font-medium rounded-md">
		Cancel
	  </button>

<button class="px-4 py-2 ml-2 bg-blue-500 hover:bg-blue-600 text-white text-sm font-medium rounded-md">
		Continue
	  </button>
	</div>
  </div>
</div>

Related Examples

Modal popup
Working modal in tailwind CSS Simple snippet for creating models with tailwind and javascript

Lukas Müller

3 years ago

44k
Responsive modal popup

I.P. Leroy

3 years ago

14.9k
Blurred Background Modal

Prem..

3 years ago

14.5k
Modal with background overlay
Reduce the opacity of the page content to bring the focus to the modal.

Abigail

3 years ago

12.6k
Error popup modal

Odessa Young

3 years ago

17k
Confirmation Dialog Box

Anonymous

3 years ago

17.2k
Login popup modal
centered modal for gaining more attention from users, it also has social login buttons.

R Thapa

2 years ago

18.3k
Confirmation modal/card

Sophia Baker

3 years ago

16.5k
Confirmation model

Mr Robot

4 years ago

13.6k
Confirmation modal with blurred background

Orion.c

3 years ago

14.8k
Social media login modal
Popup model for social media login. i.e. google and GitHub. you can add more buttons according to your need

Sameer Sultana

3 years ago

15.8k
popup modal contact form
Working modal popup contact form in tailwind CSS Simple snippet for creating a popup contact form with tailwind and javascript

Ti To

2 years ago

8.9k