Introduction
Recastui is a UI toolkit that enables the development of accessible web applications and design systems using React(soon Solidjs, Svelte and others). It includes a collection of themeable UI components and primitives that can serve as a solid foundation for implementing design systems.
Key features
Accessible
Recastui adheres to the WAI-ARIA Authoring Practices as much as possible. It takes care of accessibility implementation details such as ARIA attributes, focus management, and keyboard navigation.
Composable
Recastui provides fine-grained access to individual components’ parts, allowing you to wrap them and add your own event listeners, props, and more.
Themeable
Component in Recastui are shipped with themed styles using TailwindCSS & variations powered by CVA , allowing you to completely customize the look and feel.
Automatic Dark Mode
No need to add prefix dark:
to your classes in your code for dark mode. No conditional logic required. Recast uses Radix-color pallets along with the power of CSS custom properties to automatically create dark variants equivalent for the used color pallet. All components are built with dark mode in mind.
Acknowledgments
Recastui owes its existence to the previous work of other significant frontend community projects, including:
- TailwindCSS - https://tailwindcss.com/
- Radix Color - https://www.radix-ui.com/colors/
- Chakra-ui - https://chakra-ui.com/
- Mantine - https://mantine.dev/