Skip to content

Custom color picker with HTML custom elements (Web Components)

License

Notifications You must be signed in to change notification settings

abdellatifLabr/super-coolor-picker

Repository files navigation

cover-light npm version github-issues github-stars github-license

Super Coolor Picker

Custom color picker with HTML custom elements (Web components).

Install

Install via npm or download js file

$ npm install super-coolor-picker
<html>
    <body>
        ...
        <script src="https://unpkg.com/super-coolor-picker@1.0.0/dist/super-coolor-picker.js"></script>
    </body>
</html>

Usage

<form name="style">
    <super-coolor-picker 
        value="#00b2a9ff"
        name="color"
        colors="#F1E3F3FF;#C2BBF0FF;#8FB8EDFF;#62BFEDFF"
        lite="false"
        theme="dark"
        shades="2"
        width="30px"
        height="30px"
    ></super-coolor-picker>
</form>

Features

  • Color mixing (hold Alt and click on a color to mix it with the current color)
  • User defined colors
  • Lite mode
  • Light/Dark theme
  • User definded number of shades generated for each color selected
  • Insert new colors in HEX or RGBA format

Screenshots

Dark Theme

dark

Light Theme

light

Lite Mode

lite

License

Super Cooler Picker is freely distributable under the terms of the MIT License.

About

Custom color picker with HTML custom elements (Web Components)

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published