# Looking for Bootstrap like Modal solution for tailwindcss in sage11

**URL:** https://discourse.roots.io/t/looking-for-bootstrap-like-modal-solution-for-tailwindcss-in-sage11/30103
**Category:** sage
**Tags:** tailwind, sage11
**Created:** 2025-12-30T10:51:37Z
**Posts:** 11

## Post 1 by @the_lar — 2025-12-30T10:51:37Z

Just looking for a ‘free’(ish) Modal solution for Tailwind that works in a similar way to Bootstrap’s Modals - [Modal · Bootstrap](https://getbootstrap.com/docs/4.0/components/modal/)

I know that there is a Modal Dialog that’s part of Tailwind Plus - [https://tailwindcss.com/plus/ui-blocks/application-ui/overlays/modal-dialogs](https://tailwindcss.com/plus/ui-blocks/application-ui/overlays/modal-dialogs) but thats a paid option which I’ll do as a last resort, but if anyone has a decent alternative, I’d appreciate the recommedation.

Thank you!

---

## Post 2 by @sitesandsuch — 2025-12-30T11:01:31Z

As I think you are more interested in the functional than the visual aspect of this element you should have a look at the excellent alpine.js components which includes a great modal:

> **[Modal Component — Alpine.js](https://alpinejs.dev/component/modal)**
>
> How to build a modal component using Alpine.js.

You’ll like the price as well. :slightly_smiling_face:

You can then make it look the way you want with Tailwind, no need for the full package there.

---

## Post 3 by @the_lar — 2025-12-30T11:18:20Z

Thank you for the tip @sitesandsuch - looks like it fits the bill!

---

## Post 4 by @the_lar — 2025-12-30T11:23:05Z

Just one quick question re Alpine Components - would they work alongside React? One specific part of my site is a React app and I would need to trigger a modal from within it, hopefully they would play nicely together?

---

## Post 5 by @sitesandsuch — 2025-12-30T11:41:38Z

If you’re using React, you should use that for the modal? react-modal should do it, or maybe you are already working with Headless UI?  
Not sure if they work together well because they shouldn’t work together.

---

## Post 6 by @the_lar — 2025-12-30T14:05:12Z

yes it’s a funny one, my site is Wordpress/Woocommerce but one particular page (product search results) is a react app (inside Wordpress)… so really need a modal solution that will work both from react and from ‘normal’ template page. I might just roll with my own!

---

## Post 7 by @ben — 2025-12-30T16:45:46Z

For what it’s worth, Radicle (not free) ships with a modal blade component that also works as a block that could be used as a reference

---

## Post 8 by @porobertdev — 2025-12-31T00:41:12Z

For your information, SheafUI components work. There was a small error and workaround when setting it up, but I don’t recall it. Works fine. They work with both livewire & alpinejs.

> **[Modal Dialog Component – Sheaf UI](https://sheafui.dev/docs/components/modal)**
>
> An overlay dialog component for displaying content above the main interface with focus management and escape handling.

---

## Post 9 by @the_lar — 2026-01-05T10:09:46Z

@porobertdev - thanks for the tip, I’ll give that a try!

---

## Post 10 by @the_lar — 2026-01-05T11:06:07Z

@porobertdev - just trying to set up Sheaf UI, I ran `wp acorn sheaf:init` and pretty much accepted all the default options, but when it runs I got the following error:

 ![Screenshot 2026-01-05 at 11.04.04](https://discourse.roots.io/uploads/default/original/2X/d/df14385d13897ad8232ad178d2f84d42d1c32602.png)

I know you said you had a work around you needed - would it have been to do with this and can you remember how you did it?

---

## Post 11 by @porobertdev — 2026-01-05T19:39:04Z

@the_lar Hi, I have rechecked my discord post:

 ![image](https://discourse.roots.io/uploads/default/original/2X/8/84c0b7494d1477f05f2ef588b931c2800b0e4930.png)
