Tailwind is optimised to work with JavaScript/TypeScript ecosystems, but other languages might have good integrations also.
This is the case for OCaml-derived languages that are used to do Frontend development. For the most part, a tighter integration might not be needed and using the Tailwind setup guide and regular classNames with strings is good enought.
let make = (~text) => {
<h1 className="text-3xl font-bold underline">{React.string(text)}<h1>
}
If you are looking for a smoother or safer integration, those tools might be your cup of tea:
ReScript PPX which validates the tailwindcss class names.
This is a ppx that checks your Tailwind classNames to be correct, according to a .css file. You would need to run tailwind on the background to generate the .css file.
<div className=%twc("p-[75px]")> ... </div>
Repo https://github.com/green-labs/res_tailwindcss
Sx is a just-in-time CSS generator based on the Tailwind API.
This is a ppx that generates the classNames you are using just in time when you use them, so no need to run Tailwind alongside.
<button className=%sx(`p-2 bg-white hover:(bg-purple-700 text-white)`)>
Repo https://github.com/hyper-systems/rescript-sx
(archived) A Reason/OCaml Pre-Processor eXtension (PPX) that validates your Tailwind classes at compile-time Very similar to res-tailwindcss, but includes autocomplete via coc and keeps a cache of your CSS generated file.
<Component className=[%tw "flex flex-row"] />
Repo https://github.com/dylanirlbeck/tailwind-ppx
Brings Tailwind CSS to ReasonML Provides the Tailwind API as ReasonML values and functions. Very helpful to autocomplete, not the best idea for bundle-size.