Overview

The PandaCSS preset for Radix Colors offers a powerful tool for developers looking to enhance their web projects with vibrant color options. Integrating seamlessly with Radix UI, this preset not only simplifies accessing a broad spectrum of colors but also brings essential features like dark mode support and DCI-P3 wide color gamut compatibility. With its customizable features, it's designed to cater to diverse design needs while ensuring that your project looks stunning across different displays.

What sets this preset apart is its focus on flexibility and ease of use. Developers can easily implement it into their existing PandaCSS configuration, leveraging complex color scales and maintaining a high level of responsiveness in design. Whether you're building a multi-themed application or just want to add a splash of color, this preset is a significant addition to any developer's toolkit.

Features

Dark Mode Support: Automatically switches between light and dark color variants based on user preferences, enhancing accessibility and user experience.
Customizable Color Scales: Hierarchical path-based filtering allows you to reduce bundle size by including only the color scales you need.
Wide Color Gamut (DCI-P3): Automatically employs DCI-P3 variants where supported, providing rich and vivid colors for high-quality displays.
Automatic Conditional Values: Tokens adjust automatically for dark mode and P3 support, simplifying color management in various design contexts.
Robust Color Scheme: Includes 12 shades for each color, allowing for a nuanced approach to color selection.
Error Warnings: Provides console warnings for invalid color scale paths at initialization, helping you catch typos and configuration errors early.
Testing Coverage: Comes with a comprehensive test suite using Bun test runner to ensure all functionality performs as expected.
Seamless Integration: Easy to add to your existing PandaCSS setup, allowing you to maintain features like keyframes, breakpoints, and text styles effortlessly.

Muijf

Pandacss Preset Radix Colors

Pandacss Preset Typography

Pandacss Preset Radix Colors