Shadcn-ui variation without Tailwind #2832
Replies: 12 comments 15 replies
-
|
Yes, please. |
Beta Was this translation helpful? Give feedback.
-
|
Is there any? I'll make one if there's none. |
Beta Was this translation helpful? Give feedback.
-
|
What's the word? |
Beta Was this translation helpful? Give feedback.
-
|
Might be possible I mean i believe the underlying radix-ui library works with plan css right? If i'm not mistaken should be doable. |
Beta Was this translation helpful? Give feedback.
-
|
The Radix documentation gives examples with both CSS and Tailwind. |
Beta Was this translation helpful? Give feedback.
-
|
I have begun a starter template using css modules and next.js. Its nothing fancy as shadcn has but personally I feel this could work quite well. https://github.com/qwalker8408/shadcn-css The big limiting factor is documentation wont be publicly available but I want to instead have a page (shadcn) that has all the components, its basically the same as the section of all the preview tabs on shadcn's website for each component, and the developer can just copy and paste that section from the code into a page they're creating. I appreciate any ones thoughts on this and hopefully some help. I'm finishing up on making sure the page that houses all the components is as smooth as butter. Alot of extra styling is applied apart from the components itself, not to mention animation. for the love of css :) |
Beta Was this translation helpful? Give feedback.
-
|
It looks pretty nice. SO, you make it yourself manually, right? Only miss to make the components SSR first. |
Beta Was this translation helpful? Give feedback.
-
|
I mean shadcn explicitly calls "use client" on each of his components he's created so I'm not sure how SSR ties in, but I do have limited knowledge as to how to render the css from the server. Follow the way next.js handles css modules. https://nextjs.org/docs/app/building-your-application/styling/css-modules |
Beta Was this translation helpful? Give feedback.
-
|
Or I think it would be nice too if using |
Beta Was this translation helpful? Give feedback.
-
|
I honestly think that unoCSS is a well formed framework of what shadcn/css or even shadcn/ui is already trying to achieve. css modules is very powerful, tied in with "class-variance-authority" plugin makes a very compelling scenario for people out there, like myself, who have a passion for css but make their living through js. |
Beta Was this translation helpful? Give feedback.
-
|
shadcn with css modules is a must ! |
Beta Was this translation helpful? Give feedback.
-
|
its not perfect in any way, however its a good start and most of the components are there except for the new graphs component. this can also be used in a normal react project with vite |
Beta Was this translation helpful? Give feedback.
-
|
@qwalker8408 how is it going on? |
Beta Was this translation helpful? Give feedback.
-
still outstanding, keen to help ? Push a PR please. I'm also going to try create a home page for the components some time soon :) |
Beta Was this translation helpful? Give feedback.
-
|
This is amazing |
Beta Was this translation helpful? Give feedback.
-
For me, priority is to fix the snags that are still present and iron them out, update with the graph component and then to work on a landing page for the repo with examples loaded onto vercel. I'm also porting these components as a library to react-native and using styled components as its basis. I'm not sure how the CLI will work Prince, its not really my cup of tea. |
Beta Was this translation helpful? Give feedback.
-
|
Second you! Shadcn's components are cool. |
Beta Was this translation helpful? Give feedback.
-
|
Am willing to contribute to start this going! |
Beta Was this translation helpful? Give feedback.
-
|
I was just playing around with a way to abstract out all the styling information and came up with a proposal that would also allow defining a style that could use css modules instead of tailwind. Might be crazy, but it's in this discussion if you want to take a look. |
Beta Was this translation helpful? Give feedback.
-
|
Tailwind is the only thing stopping me from using shadcn, would love to see this happen. |
Beta Was this translation helpful? Give feedback.
-
|
Same here ! |
Beta Was this translation helpful? Give feedback.
-
|
Same. I prever not to use hype frameworks like tailwind. In a couple of years it's outdated and will be a mess to update and maintain it. |
Beta Was this translation helpful? Give feedback.
-
but not that performative. |
Beta Was this translation helpful? Give feedback.
-
|
the majority of devs are already used to CSS, Less, or SCSS, so it’s super easy to maintain and get new folks on board |
Beta Was this translation helpful? Give feedback.
-
Ten months have already passed does anyone know if this is going to be scheduled or at least considered? |
Beta Was this translation helpful? Give feedback.
-
|
Tailwind is pure cancer. Incurable. So, yes, please, let this be. |
Beta Was this translation helpful? Give feedback.
-
|
I love shadcn and still haven't tried it yet because i f...in hate tailwind. i prefer to write my styles in plain css or scss modules |
Beta Was this translation helpful? Give feedback.
-
Hello everyone,
I've been exploring the shadcn-ui package and I must say, it's quite promising. However, I have a query regarding its dependency on Tailwind CSS. Is there any plan in the pipeline to release a version of shadcn-ui that doesn't rely on Tailwind? Alternatively, will it remain exclusively Tailwind-centric in its design approach?
From a personal perspective, I find Tailwind CSS a bit restrictive, and I prefer the flexibility of customizing components with regular CSS, akin to the approach taken by Ant Design. Moreover, in organizational settings, heavy reliance on Tailwind can sometimes lead to cluttered codebases, making components harder to comprehend, read, and maintain.
I believe offering an option to utilize regular CSS for customization alongside or instead of Tailwind would greatly enhance the appeal and versatility of shadcn-ui, catering to a broader range of preferences and use cases.
Looking forward to hearing your thoughts on this matter.
Beta Was this translation helpful? Give feedback.
All reactions