Data input

Color picker

Themed color picker with saturation canvas, hue and alpha sliders, hex input, and preset swatches.

Import

Add the symbol to your component's imports array. The walkthrough below shows the most common usages — copy & tweak.

import { KjColorPickerComponent } from '@kouji-ui/components';

Loading editor

#b8f500

format

value

alpha slider

hex input

invalid

disabled

<kj-color-picker
  kjFormat="hex"
  [(ngModel)]="color"
/>