Skip to content

role presentation

Icon draft v0.1.0

A glyph of the system's icon set, decorative or named.

An icon draws one glyph of the icon set (Material Symbols, the Iconography foundation) at a size and in a color of the system. Next to text it is decoration and says nothing to assistive technology; alone, it must be named by what it means, and is then exposed as an image. Icons inside the other components (buttons, alerts, selects) are those components' parts, styled by their tokens; this component is for icons placed by a product in its own content.

Playground

HTML
<span
  class="ds-icon"
  data-size="medium"
  data-color="current"
  aria-hidden="true"
>settings</span>