Skip to content

ColorSwatch

A component for color samples.

Examples

Preact

jsx
return (
  <ColorSwatch color="#EEAA00" />
);

Custom Element

html
<phi-color-swatch color="#EEAA00" />

CSS

html
<span class="phi-color-swatch" style="background: #EEAA00" />

Reference

Preact

Properties

PropertyTypeDefaultDescription
colorstring(required)Color name to preview

Custom Element

Props / Attrs

SlotCategoryTypeDefault
colorProp/Attrstring""

Pure-CSS

Classes

Class
phi-color-swatchCore styles