Communication

Icon

An Iconify-powered primitive that resolves Material icons by default and inherits size and color from its context.

Playground

Configure the component and copy synchronized Vue code.

Interactive preview

Changes are reflected in the example and source.

Properties

Name

Iconify collection and glyph

Size

Icons inherit font size

Color

Icons inherit currentColor

Vue

<m-icon
  name="ic:round-auto-awesome"
  style="font-size: 48rem; color: var(--md-sys-color-primary)"
/>

Token map

The manual manifest combines inherited token owners with local deltas.

MIcon · All1 tokens
md-icon

MIcon API

Props, slots, and events are generated from the current public kit contract.

MIcon

Utility family
src/runtime/components/ui/icon

Props

NameTypeDefault
nameIconify name. Names without a collection prefix resolve to the `ic` collection.
string—

Slots

Events

MIcon does not emit component-specific events. Native events fall through to its root element.