Panda CSS

Panda CSS is a styling engine that lets you write type-safe CSS-in-JS while generating static, framework-agnostic CSS at build time. This approach gives you the developer experience of CSS-in-JS without any runtime overhead, resulting in faster-loading websites. It combines the best of popular styling solutions to provide a superior workflow.

Key features include:

• Type-Safe Styling: Write styles with confidence thanks to first-class TypeScript support, catching errors before they hit production.
• Zero Runtime: All styles are extracted into static CSS files during your build process, ensuring your application remains lightweight and performant.
• Recipes & Variants: Easily create reusable component styles with multi-variant support, inspired by libraries like Stitches and CVA.
• Design Token System: Define your design system using the W3C token specification, supporting both core and semantic tokens for consistency.
• Framework Agnostic: Works seamlessly with modern frameworks and tools, including React Server Components, Next.js, Astro, Remix, and Vite.