Radix UI Themes with Tailwind
Features
- (optional) You can use tailwind naming convention for colors and radius helpers
- You can still write
bg-red-500
bg-blue-500
and it will point to radix color
- (optional) You can map missing color tokens from tailwind to radix-colors
- For example you can map
zinc
to sand
, neutral
to sage
, etc...
FAQ
What is/are Radix Themes?
"Radix Themes is just a styled, opinionated component lib on top of the primitives. It’s made for when you want to kickstart a project with pre-designed, battle-tested components." (from Radix UI Twitter)
Do I really need this plugin to use Radix themes?
No, but if you used to tailwind and don't wanna use Radix Themes' layout utilities (<Box />
, <Flex />
, <Grid />
etc...) you can still develop with Tailwind (className="flex items-center gap-2"
).
OK, show me a demo!
Sure, coming soon...
Acknowledgements