# How to Convert Tailwind CSS project to Plain CSS Project?

**URL:** <https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428>\
**Category:** Pinegrow WordPress Plugin\
**Tags:** css, tailwind\
**Created:** [December 15, 2022, 10:16am UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428 "2022-12-15T10:16:28Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![marcelreschke](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marcelreschke/32/4924_2.png) [@marcelreschke](https://forum.pinegrow.com/u/marcelreschke)\
**Post date:** [December 15, 2022, 10:16am UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428/1 "2022-12-15T10:16:28Z")

</div>

I started a project with Tailwind CSS, but I noticed that it is an outdated version.

I removed it and add the JIT compiler script, but I can’t use my configured classes and arbitrary value classes in the Element properties panel.

How can I switch to a Plain CSS project?

---

<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:** [December 15, 2022, 1:11pm UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428/2 "2022-12-15T13:11:29Z")

</div>

I don’t fully understand your desire. Do you want to completely abandon Tailwind? All projects in PG (whether using BS or TW) are set to be able to use regular CSS by default. Just create your .css (or .scss) file and classes and work with them by hand coding or using the “style” paintbrush UI as seen below:

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/7/7c27591d3b506d1f433acbff613cc0d96d3bb67e.png)

---

<div class="post-metadata">

**Author:** ![marcelreschke](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marcelreschke/32/4924_2.png) [@marcelreschke](https://forum.pinegrow.com/u/marcelreschke)\
**Post date:** [December 15, 2022, 1:43pm UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428/3 "2022-12-15T13:43:53Z")

</div>

No, I don’t want to abandon Tailwind CSS, I want to use the latest version with my own configuration and arbitrary value classes.

I only see the now default classes:

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/e/e022736d6291e6f1ebe1947e06d1e5a78c6cfa33.jpeg)

---

<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:** [December 15, 2022, 7:26pm UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428/4 "2022-12-15T19:26:26Z")

</div>

You’ll have to use your own CLI or the Node.js as an [external compiler](https://pinegrow.com/docs/tailwind/using-external-build-process/). But I don’t think it will pick up custom classes you add to your tailwind-config.js in the UI dropdowns so you’d have to add the class manually.

---

<div class="post-metadata">

**Author:** ![marcelreschke](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/marcelreschke/32/4924_2.png) [@marcelreschke](https://forum.pinegrow.com/u/marcelreschke)\
**Post date:** [December 16, 2022, 6:02am UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428/5 "2022-12-16T06:02:51Z")

</div>

Thank you, for your advice.

I doubt it, too. If I only could get rid of Tailwinds default theme classes in the UI.

---

<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:** [December 16, 2022, 8:14pm UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428/6 "2022-12-16T20:14:28Z")

</div>

Ya, I feel your pain. You can [create your own plugin for PG](https://pinegrow.com/docs/developers/) based on the official TW plugin. I’ve looked at the bootstrap one and it was too complex for me to wrap my head around to create a custom version of it. If you’re really good a JS ES6 you may have more luck than me.

---

<div class="post-metadata">

**Author:** ![matjaz](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/matjaz/32/5_2.png) [@matjaz](https://forum.pinegrow.com/u/matjaz)\
**Post date:** [December 17, 2022, 7:08pm UTC](https://forum.pinegrow.com/t/how-to-convert-tailwind-css-project-to-plain-css-project/7428/7 "2022-12-17T19:08:40Z")

</div>

@jonroc the TW plugin is a monster, would not recommend digging into it 🙂

We do have a prototype solution for picking out the custom TW classes but it will most likely involve having to add some kind of PG plugin into the external Node-based TW compilation process.

@marcelreschke the Pinegrow WordPress Plugin does not support customized TW, not sure if it will be possible in the future.
