ngx-colors
#455a64
Slide-In animations & Default palette
#c2185b
Popup animations & Custom palette

Reference for ngx-colors

import { NgxColorsModule } from 'ngx-colors';

Directive ngx-colors-trigger

@Inputs

namedescription
paletteSet a custom palette for the color picker. Can recibe an Array of string or NgxColor
colorsAnimationSet the animation for the color circles.
Options:
  • popup
  • slide-in
    formatSet output format.
    Options:
    • hex
    • rgba
    • hsla
      hideColorPickerHide the option to see the sliders to choose a color
      hideTextInputHide the text input
      colorPickerControlsSet the controls for the color picker.
      Options:
      • default
      • only-alpha
      • no-alpha
        acceptLabelSet the label for the accept button
        cancelLabelSet the label for the cancel button
        overlayClassNameSet the class for the overlay
        attachToSet the element(ID) to append the overlay, Default is body
        attachToSet the element(ID) to append the overlay, Default is body

        @outputs

        namedescription
        changeGets triggered when the color is changed.
        inputGets triggered when the color is changed by the user
        sliderGets triggered when the the alpha, hue or Lightness sliders are changed
        openGets triggered when the panel is opened.
        closeGets triggered when the panel is closed.

        Validator validColorValidator

        import { validColorValidator } from 'ngx-colors';
        namedescription
        ErrorinvalidColor