# Customising Tailwind

**URL:** https://forum.pinegrow.com/t/customising-tailwind/7105
**Category:** Frameworks
**Created:** [October 17, 2022, 1:54pm UTC](https://forum.pinegrow.com/t/customising-tailwind/7105 "2022-10-17T13:54:10Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![Dom](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/dom/32/4887_2.png) [@Dom](https://forum.pinegrow.com/u/Dom)
#### Post date: [October 17, 2022, 1:54pm UTC](https://forum.pinegrow.com/t/customising-tailwind/7105/1 "2022-10-17T13:54:10Z")

</div>

Hi

I have been following [this tutorial in the documentation](https://pinegrow.com/tutorials/customizing-a-tailwind-css-theme/) and all has gone well until I get to the part where it says ’ Click on the **Tools & Settings** icon and select **Customize visual controls** :’

Rather than seeing the dialog where it should allow me to point to the build stylesheet I instead see a dialog telling me that customisation is not supported in Tailwind Css 3+.

As I’m new to using Pinegrow I am assuming that at this point I should probably be doing something other than what is suggested in the tutorial however I’m not entirely sure what.

Could you enlighten me?

---

<div class="post-metadata">

### Author: ![jonroc](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/jonroc/32/2805_2.png) [@jonroc](https://forum.pinegrow.com/u/jonroc)
#### Post date: [October 17, 2022, 6:59pm UTC](https://forum.pinegrow.com/t/customising-tailwind/7105/2 "2022-10-17T18:59:13Z")

</div>

Hi @Dom I’ve spent about 20hrs trying to get Tailwinds working in PG with their Tialwind’s Windows CLI. Never got it to sync properly with PG but I think node.js is working, but I do know you’re looking at old documentation. They are using the [design panel](https://pinegrow.com/docs/tailwind/tailwind-css-design-panel/) to handle colors now. You have to activate the design panel from the Window → Show/Hide in the top navigation of PG if it’s not already active for you.

Also, this [new external build](https://pinegrow.com/docs/tailwind/using-external-build-process/) may help you a bit too.

---

<div class="post-metadata">

### Author: ![Dom](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/dom/32/4887_2.png) [@Dom](https://forum.pinegrow.com/u/Dom)
#### Post date: [October 18, 2022, 1:20pm UTC](https://forum.pinegrow.com/t/customising-tailwind/7105/3 "2022-10-18T13:20:38Z")

</div>

@jonroc Thank you so much for your suggestion. I have the basic design palette working now. Would I be correct in thinking that allowing Pinegrow to use it’s own compiler removes the ability to abstract some of the css into its own reusable components. Possibly not very well put on my part but I have in mind things like buttons or cards that might be widely reused over a site.

I’m presuming for that I’d need a tailwind config, and that in turn suggests an external build, or could I simply add a tailwind config to the tailwind theme folder that gets created by Pinegrow and use that?

---

<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: [October 18, 2022, 2:41pm UTC](https://forum.pinegrow.com/t/customising-tailwind/7105/4 "2022-10-18T14:41:58Z")

</div>

or you could use pinegrow components.

---

<div class="post-metadata">

### Author: ![adamslowe](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/adamslowe/32/4590_2.png) [@adamslowe](https://forum.pinegrow.com/u/adamslowe)
#### Post date: [October 19, 2022, 3:07am UTC](https://forum.pinegrow.com/t/customising-tailwind/7105/5 "2022-10-19T03:07:48Z")

</div>

Tailwind changed a lot from version 2 to v3, then again with 3.1. A lot of Pinegrow’s tailwind documentation was written for v2 before they added the JIT compiler, and small adjustments need to be made to make them work with v3. If you know tailwind, it’s easy enough to sort out, but trying to learn TW and reinterpret the documentation can be a challenge.

I hope to have time to make a video walking through the whole process, both for public consumption and for my team’s documentation. I just need a few extra hours in the day, and maybe I’ll be able to crank it out 🤷‍♂️

Team Pinegrow is bending over backward to get the WP plug-in released sooner than later, along with a ton of new quality-of-life changes (maybe even some new tutorials), so I doubt revisiting older documentation is on their radar at the moment.

Keep using these forums, and don’t hesitate to tag me if you run into specific issues. I’m happy to help whenever I’m able.

---

<div class="post-metadata">

### Author: ![jonroc](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/jonroc/32/2805_2.png) [@jonroc](https://forum.pinegrow.com/u/jonroc)
#### Post date: [October 21, 2022, 1:24pm UTC](https://forum.pinegrow.com/t/customising-tailwind/7105/6 "2022-10-21T13:24:59Z")

</div>

Hey @Dom,

PG can create abstracts of reusable code (use the “inline” feature at the top UI under the classes), update colors, and add fonts.

Unfortunately, the only way you can customize Tailwinds beyond that is to run your own compiler. There has [been a feature request](https://forum.pinegrow.com/t/support-for-semi-custom-tailwind-theme/6757) for PG to add a text area into the settings for their compiler so we can inject our own custom Tailwind configurations (with the exception of adding plugins) you can plus 1 over on that thread if you’d like to let them know you’d also like to add in custom functions/setting that TW offers with the internal compiler.
