Shadcn.io is not affiliated with official shadcn/ui
Color Picker
Full-featured color picker with HSL canvas, eyedropper, and multiple output formats for React
Not a toy color picker. A 2D saturation/lightness canvas, hue slider, alpha control, and an eyedropper that samples colors right from your screen. Output in HEX, RGB, CSS rgba(), or HSL—switch formats from a dropdown. Compound components let you build exactly the picker you need, from minimal to full-featured. Perfect for theme builders, design tools, brand editors, or anywhere users need precise color control.
Scroll to load preview
Installation
Related Components
FAQ
Was this page helpful?
Sign in to leave feedback.