svelte-chroma-picker

What?! Yet another color picker? Yep, I wanted to learn svelte.

Installation

yarn add svelte-chroma-picker

npm i --save svelte-chroma-picker

Usage

To use it, simply import it as a svelte component.

<script>
  import ChromaPicker from 'svelte-chroma-picker';

  let color = '#fff';
</script>

<ChromaPicker bind:color />

Play with this example on Code Sandbox.

Options

You have a few options at your disposal.

• color. Obviously, the color you want to bind to.
• width and height. You can control the size of the color box for the picker.

Events

• update. Dispatched every time you change the color. It returns an object with the rgb and hsv values for the current color, should you need them.

Check out the Demo.

A note on accessibility

I'm still working on making this 100% keyboard and screen reader accessible. Pull requests welcome!

License

MIT License - fork, modify and use however you want.