Adding Tailwind CSS to custom component

  • Goal: I am creating a custom component inside my retool app. I want to be able to use tailwind styles inside the custom component but I'm only able to do styling with inline CSS.

  • Steps: Build custom component libraries | Retool Docs I don't see any example of styling inside the custom component docs. I've tried to import already working components within the repo into my component and the styling breaks.

  • Details: I've imported retoolCustomComponentLibraryConfig into an already existing repo that I have. I'm able to create custom components but unable to add tailwind styling to these components

  • Screenshots:

  • App json export: (here's how to get a json export)

1 Like

I was able to accomplish this by using the default Tailwind installation docs seen here: Installation - Tailwind CSS.

In my index.tsx file I imported ./output.css.

My file structure looks like so after following the Tailwind installation
image

Hope that helps

3 Likes