# Color Picker (/forms/color-picker)





<ComponentPreview name="color-picker-preskok-demo" description="Color picker with area, hue slider, and hex field." />

## Installation [#installation]

```bash
npx shadcn@latest add @preskok/color-picker
```

## Usage [#usage]

```tsx
import { ColorPicker } from "@/components/ui/preskok-ui/color-picker"

export function ColorPickerDemo() {
  return <ColorPicker label="Pick a color" defaultValue="hsl(216, 98%, 52%)" />
}
```

## Notes [#notes]

* **EyeDropper API**: enable `eyeDropper` prop to render an eyedropper button when supported.
* **Slots**: customize content by passing children (e.g., your own sliders or fields).