zippy starter's shadcn/ui theme generator

Shadcn UI Theme Generator: Create Custom Themes from a Single Color

The Shadcn UI Theme Generator is a powerful tool for developers using shadcn/ui. It simplifies the creation of custom visual themes by allowing you to generate a complete color palette from just a single base color. Fine-tune your theme with adjustments for saturation, lightness, and border-radius, then easily copy the generated CSS variables to integrate them seamlessly into your applications, ensuring a consistent and personalized look and feel.

Features:

• Single Color Input: Generate an entire theme palette from one chosen base color.
• Hex Value Input: Precisely define your base color using a hexadecimal code.
• Interactive Color Picker: Visually select your desired base color with ease.
• Saturation Adjustment: Control the overall saturation of the generated theme colors.
• Lightness Adjustment: Modify the lightness levels across your theme's palette.
• Radius Customization: Set global border radius for components, with options like 0, 0.3, 0.5, 0.75, and 1.0.
• Mode Toggle: Supports switching and previewing themes, commonly for light and dark modes.
• Copyable CSS Variables: Directly copy the generated theme configuration for quick integration into shadcn/ui projects.
• Live Component Preview: Instantly visualize how the generated theme applies to various shadcn/ui components like cards, buttons, and forms.

Summary:

This Shadcn UI Theme Generator enables developers to rapidly design and implement custom themes for their shadcn/ui projects. By starting with a single color and utilizing intuitive controls for saturation, lightness, and radius, users can generate a full set of theme variables. These variables are readily available for copying, significantly speeding up the process of applying a unique and consistent visual style to web applications.