Interface ColorPickerProps

Props for the ColorPicker component.

interface ColorPickerProps {
    className?: string;
    containerClassName?: string;
    containerStyle?: CSSProperties;
    height?: string | number;
    hueSliderClassName?: string;
    hueSliderCursorClassName?: string;
    hueSliderHeight?: string | number;
    initialColor?: RGB;
    inputClassName?: string;
    onChange?: ((color: RGB) => void);
    previewClassName?: string;
    saturationValueAreaClassName?: string;
    saturationValueCursorClassName?: string;
    style?: CSSProperties;
    width?: string | number;
}

Properties

className? containerClassName? containerStyle? height? hueSliderClassName? hueSliderCursorClassName? hueSliderHeight? initialColor? inputClassName? onChange? previewClassName? saturationValueAreaClassName? saturationValueCursorClassName? style? width?

Properties

OptionalclassName

className?: string

Custom class name for the main container

OptionalcontainerClassName

containerClassName?: string

Custom class name for the outer container

OptionalcontainerStyle

containerStyle?: CSSProperties

Custom inline styles for the outer container

Optionalheight

height?: string | number

Height of the color picker

OptionalhueSliderClassName

hueSliderClassName?: string

Custom class name for the hue slider

OptionalhueSliderCursorClassName

hueSliderCursorClassName?: string

Custom class name for the hue slider cursor

OptionalhueSliderHeight

hueSliderHeight?: string | number

Height of the hue slider

OptionalinitialColor

initialColor?: RGB

Initial color value in RGB format

OptionalinputClassName

inputClassName?: string

Custom class name for the hex input field

OptionalonChange

onChange?: ((color: RGB) => void)

Callback function triggered when the color changes

OptionalpreviewClassName

previewClassName?: string

Custom class name for the color preview box

OptionalsaturationValueAreaClassName

saturationValueAreaClassName?: string

Custom class name for the saturation-value area

OptionalsaturationValueCursorClassName

saturationValueCursorClassName?: string

Custom class name for the saturation-value cursor

Optionalstyle

style?: CSSProperties

Custom inline styles for the main container

Optionalwidth

width?: string | number

Width of the color picker

Settings

Member Visibility

On This Page

Properties