angular2-hsl-color-picker v1.0.1

ng2-hsl-color-picker

This package contains a hsl color triangle for Angular2. It aims to provide high customizability (not so much currently, more in the future) and can be used like any other form field, using [(ngModel)] to bind a value.

To create the color picker, import the HSLColorPickerModule into your desired module and insert the <hsl-color-picker> component at the desired location.

Color

The package provides a color class implementation, which can create color objects from RGB and HSL values:

color1: Color = Color.fromRGB(12, 34, 56) // r, g, b each in the range of [0, 255]
color2: Color = Color.fromHSL(180, 40, 60) // h in the range of [0, 360), s and l in [0, 100]

You can bind the value of the picker using the ngModel and ngModelChanged directives as used for normal <input> elements:

<hsl-color-picker [(ngModel)]="color1">

License

MIT © Thomas Neumüller