C&C Docs
Log in

cnc-icon

An SVG icon renderer with theme colors, decorative kinds, a complete size and shape scale, and optional motion. Icon names use the Iconify-style prefix/icon-name convention.

Quick start

Set name to an available icon reference. Add label when the icon conveys meaning; otherwise its name is used as the accessible fallback.

Featured item
<cnc-icon
  name="heroicons/star"
  label="Featured"
  color="primary"
  size="xl"
></cnc-icon>

Usage guidance

Use plain icons inside text and controls that already provide their own visual surface. Set a kind when the icon needs a standalone badge-like container, and reserve continuous animations for progress or status that is actively changing.

← Back to Widgets