HexColorSliders

A <Slider> and <Input> per channel to choose a HEX color value

Code

<script lang="ts">
  import { HexColorSliders } from '@geoffcox/sterling-svelte';
</script>

<HexColorSliders />

Members

Property Name	Type	Default	Comment
red	number	0	The red value.
green	number	0	The green value.
blue	number	0	The blue value.
alpha	number	255	The alpha value.
variant	string	''	Additional class names to apply

Considerations

Includes HTMLDivElement props, event, and methods

Anatomy

<div class="sterling-hex-color-sliders">
  <Slider variant="red" />
  <Input variant="red" />
  <Slider variant="green" />
  <Input variant="green" />
  <Slider variant="blue" />
  <Input variant="blue" />
  <div class="alpha-hatch" />
  <div class="alpha-gradient" />
  <Slider variant="alpha" />
  <Input variant="alpha" />
</div>