Color Input

Native color input built on the shared labeled input field.

Installation

bash

pnpm dlx shadcn@latest add @cs/color-input

tsx

import { ColorInput } from "@/components/cs/color-input"

tsx

<ColorInput name="brandColor" label="Brand color" />

Renders a native color input using the shared labeled input field.

Name	Type	Default	Description
defaultValue	string	-	-
error	string \| null \| undefined	-	Validation error message for the field.
icon	ReactNode	-	Icon displayed inside the input on the left.
inputClassName	string \| undefined	-	Additional classes applied to the native input control.
label	ReactNode	-	Field label and fallback placeholder.
onValueChange	(value: string) => void	-	-
orientation	"vertical" \| "horizontal" \| "responsive" \| null \| undefined	"vertical"	Layout of the field label and input control.
value	string	-	-