Theo's Typesafe CultTTC
Theo's Typesafe Cult•10mo ago
adrian

How to theme with Tailwind v4?

I've followed the setup instructions for tailwind v4. I am able to style the UploadButton and UploadDropzone containers like this:

<UploadDropzone
     className="..."
     ...
/>


But I am unable to style the nested elements using the appearance prop like this:
  appearance={{
    button:
      "ut-ready:bg-green-500 ut-uploading:cursor-not-allowed rounded-r-none bg-red-500 bg-none after:bg-orange-400",
    container: "w-max flex-row rounded-md border-cyan-300 bg-slate-800",
    allowedContent:
      "flex h-8 flex-col items-center justify-center px-2 text-white",
  }}


React doesn't even pick up that tailwind is being used within the appearance prop. Am I missing something?
Was this page helpful?