Color Scheme Customization

The template includes a built-in color system powered by shadcn’s theme colors, allowing you to customize your website’s and admin appearance without touching any code. All color management is handled through the Sanity Studio interface.

Overview

The color system provides:

• Pre-defined color presets from shadcn
• Automatic dark/light mode variations for each theme
• Consistent styling across all components

Accessing Color Settings

1. Navigate to the Sanity Studio dashboard (/admin)
2. Click on “Site Settings” in the left sidebar
3. Find the “Color Scheme” section
4. Use the dropdown to select your desired color preset

Available Color Presets

The template currently includes the following color presets from shadcn:

• Default: The default color scheme
• Red: Vibrant red palette
• Orange: Energetic orange shades
• Green: Natural green hues
• Blue: Professional blue tones
• Yellow: Bright yellow variants
• Violet: Rich purple shades
• Rose: Elegant pink hues

Each preset comes with:

• Carefully selected primary and secondary colors
• Complementary background shades
• Optimized text colors
• Hover and active states
• Dark mode variations

Coming Soon

We plan to add more color presets in future updates. All new colors will be automatically available in the Sanity Studio interface once they’re added.

Best Practices

1. The color presets are designed to maintain excellent contrast and readability
2. All colors are tested for accessibility in both light and dark modes
3. Preview your site in both light and dark modes after changing colors

Need Help?

If you encounter any issues with color customization:

1. Try refreshing the Sanity Studio page
2. Clear your browser cache
3. Reach out to our support team if problems persist

For more information about shadcn’s theming system, visit the shadcn documentation.