color-js / elements

WIP
12 stars 1 forks source link

[color-swatch][color-scale] Option to show coords #81

Closed LeaVerou closed 2 months ago

LeaVerou commented 3 months ago

<color-swatch> should support an option to list any coords in any color space. Name TBB, let's use coords for now. Type would be array of objects and the default label would be the coord name.

<color-swatch color="#f8f9fa" coords="L: oklch.l, C: oklch.c, H: oklch.h"></color-swatch>

Rendering could look like this. Ideally should have a container query that lays out horizontally unless there is not enough space.

image

<color-scale> should support the same attribute and just pass it along to its swatches.

LeaVerou commented 2 months ago

This has now been implemented (thanks @DmitrySharabin)