Diamond

Render a diamond shape using the active design tokens.

@sigil-ui/componentsReact

Preview

import { Diamond } from "@sigil-ui/components";

<Diamond size="xl" />

Prop	Type	Default	Description
`size`	`"sm" \| "md" \| "lg" \| "xl"`	`md`	Diamond size.

CSS Variable	Purpose
`--s-surface`	Surface
`--s-border`	Border

Diagonal

Draw diagonal line patterns within a surface.

Hexagon

Render a hexagonal shape using the active design tokens.