Color Elements

These are some highly experimental color-related web components. Use at your own risk, the API can change at any point.

All elements

{% for name, description in components -%}

<{{ name }}>

{{ description | safe }}

{% endfor %}

Upcoming

{% for name in ["color-plane"] -%}

<{{ name }}>

{% endfor %}

Usage

Via bare specifiers

Install via npm:

npm i color-elements

To include all components at once:

import "color-elements";

You can also import individual components:

import "color-elements/COMPONENT_NAME";

Each component also exports a standalone CSS file (for CSS-only usage):

@import url("color-elements/COMPONENT_NAME.css");

You can use these imports with Nudeps — no bundler needed (this website does) — or with any bundler you already have.

Via CDN

If you’d rather not set up any tooling, you can use a CDN such as esm.sh:

<script src="https://esm.sh/color-elements" type="module"></script>

To cherry-pick individual components:

<script src="https://esm.sh/color-elements/COMPONENT_NAME" type="module"></script>

Each component imports its own dependencies and styles.