svelte-chroma-picker

1.1.1 • Public • Published

svelte-chroma-picker

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

Npm version Npm downloads License

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.

Package Sidebar

Install

npm i svelte-chroma-picker

Weekly Downloads

87

Version

1.1.1

License

MIT

Unpacked Size

889 kB

Total Files

17

Last publish

Collaborators

  • tricinel