# TailwindUI components interactions in PG?

**URL:** <https://forum.pinegrow.com/t/tailwindui-components-interactions-in-pg/7744>\
**Category:** General\
**Tags:** tailwind\
**Created:** [February 15, 2023, 7:52am UTC](https://forum.pinegrow.com/t/tailwindui-components-interactions-in-pg/7744 "2023-02-15T07:52:17Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![red-rosefields](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/red-rosefields/32/5392_2.png) [@red-rosefields](https://forum.pinegrow.com/u/red-rosefields)\
**Post date:** [February 15, 2023, 7:52am UTC](https://forum.pinegrow.com/t/tailwindui-components-interactions-in-pg/7744/1 "2023-02-15T07:52:17Z")

</div>

Anyone played with TailwindUI interactive components here?  
Having functional dropdown menus, accordion tabs, pricing tabs and all the rest is a time saver. Adding Pinegrow Interactions to have them work seem a little inefficient (time wise).  
Note I know this is not PG “issue”

The documentantion says: "

## Using Vue

### Installing dependencies

Tailwind UI for Vue depends on [Headless UI](https://headlessui.dev/) to power all of the interactive behavior and [Heroicons](https://heroicons.com/) for icons, so you’ll need to add these two libraries to your project:

```auto
npm install @headlessui/vue @heroicons/vue

```

"

What do you think?

---

<div class="post-metadata">

**Author:** ![TechAkayy](https://avatars.discourse-cdn.com/v4/letter/t/ce73a5/32.png) [@TechAkayy](https://forum.pinegrow.com/u/TechAkayy)\
**Post date:** [February 16, 2023, 12:08am UTC](https://forum.pinegrow.com/t/tailwindui-components-interactions-in-pg/7744/2 "2023-02-16T00:08:58Z")

</div>

Thanks for sharing Carlos.

I don’t have a tailwind-ui subscription, but I can see from their docs, they support only react & vue components, and let the end user write their [own javascript](https://tailwindui.com/documentation#using-html-and-your-own-js) when using vanilla HTML.

[Flowbite](https://flowbite.com/docs/getting-started/quickstart/) is an alternative to tailwind-ui that can be installed as a tailwind plugin or used via cdn. Unlike tailwind-ui, in addition to react & vue, they also support using their components as vanilla HTML + javascript combo. It’s a good alternative if you want interactive tailwind components in vanilla HTML projects.

Back to tailwind-ui, I have been playing with headless-ui + tailwind (essentially creating my own tailwind-ui components manually) in the upcoming Pinegrow Vue integration and it’s a great combo. I can see the value in tailwind-ui subscription which gives a huge array of accessible, beautiful and ready-to-use components. Stay tuned for Vue Designer 🙂

---

<div class="post-metadata">

**Author:** ![George\_Graham](https://avatars.discourse-cdn.com/v4/letter/g/b5ac83/32.png) [@George\_Graham](https://forum.pinegrow.com/u/George_Graham)\
**Post date:** [February 16, 2023, 1:36am UTC](https://forum.pinegrow.com/t/tailwindui-components-interactions-in-pg/7744/3 "2023-02-16T01:36:06Z")

</div>

I see you guys are working hard on that with lots of updates recently. Have we got a rough time for it to come out?