Get Tailwindcss in Salesforce org

Question

I want get Tailwindcss into my Salesforce org, so that I can use those classes for UI requirements in LWC/Aura components, Searched online a lot but couldn't find anything, Help me with the steps?

Answer 1

You must to get the tailwind css file(https://unpkg.com/tailwindcss@2.2.19/dist/tailwind.min.css), then you should upload as an static resource to the org.

You can add those styles from LWC using this code:

import resourceName from '@salesforce/resourceUrl/tailwind';
import { loadStyle, loadScript } from 'lightning/platformResourceLoader';

loadStyle(this, resourceName + '/tailwind.min.css')

Just to mention, using in that way:

• You can't customize Tailwind's default theme
• You can't use any directives like @apply, @variants, etc.
• You can't enable additional variants like group-focus
• You can't install third-party plugins
• You can't tree-shake unused styles

I hope this helps!

Enroll for the salesforce admin course here to learn more.