#Need help with Shadcn UI styling in Tailwind v4 and Tanstack start monorepo

6 messages · Page 1 of 1 (latest)

split grotto
#

I'm excited to share a project I've been working on called "Tanstack Forge" - it's a modern monorepo template built around Tanstack Router and React 19. I've put together what I think is a pretty nice stack with Tanstack Query, Tailwind CSS v4, Shadcn UI, and more!

I'm running into a bit of an issue with the Shadcn UI styling though. While regular Tailwind classes are working fine, the Shadcn UI component styles don't seem to be applying correctly. I'm not sure if the problem is with my globals.css setup, the tailwind configuration, or something else entirely.

Has anyone here integrated Shadcn UI with Tailwind v4 in a monorepo setup? Any common problems I should look out for?

For reference, I'm using the latest Tanstack Router, and the project is structured with the UI components in a separate package. Regular Tailwind classes work perfectly, it's just the Shadcn specific styling that's not taking effect.

This is the link to my github repo if you want to check it out: https://github.com/astronautfa/tanstack-forge

Any help or pointers would be much appreciated!

GitHub

A modern, opinionated monorepo template for building lightning-fast, feature-rich single-page applications. - astronautfa/tanstack-forge

quartz sun
#

man,

#

you’re basically reinventing the wheel

split grotto
#

Thanks. I didn't know this existed. I just followed the documentation for creating a tanstack start from scratch and that was the code I ended up with. I have migrated my turborepo setup to use the create-tsrouter-app in the dashboard app. The problem however still exists. When I import the globals.css from the ui pakcage the styles are not loading. I even recreated the globals.css inside of the dashboard package and referenced it in the __root.tsx file but the shadcn styles are not taking effect.

split grotto
#

This is the style of the button and badge that I am getting on the index.tsx which is not the correct styling for the shadcn components