Icon nativelite

One icon from the shared Lucide registry, by name.

A2UI basic: Icon
Children: none

Preview

Loading the renderer…

namerequired

size

tone

label

createSurface + updateComponents, A2UI v0.9.

json

[
  {
    "version": "v0.9",
    "createSurface": {
      "surfaceId": "preview",
      "catalogId": "https://ui.exponential.at/catalogs/core/v1"
    }
  },
  {
    "version": "v0.9",
    "updateComponents": {
      "surfaceId": "preview",
      "components": [
        {
          "id": "root",
          "component": "Stack",
          "direction": "vertical",
          "align": "start",
          "children": [
            "example"
          ]
        },
        {
          "id": "example",
          "component": "Icon",
          "name": "ui-check",
          "size": "default"
        }
      ]
    }
  }
]

This surface through a MemoryTransport. Install and transports: React guide.

This surface through a MemoryTransport. Install and transports: SwiftUI guide.

This surface through a MemoryTransport. Install and transports: Compose guide.

This surface through a MemoryTransport. Install and transports: gpui guide.

Platforms

Web React

iOS SwiftUI

Android Compose

Desktop gpui

View exponential-ui-icon, painted by each native renderer.

Variants

size · sm

size · default

size · lg

tone · neutral

tone · primary

tone · success

tone · warning

tone · danger

tone · info

Props

Prop	Type	Default	Description
`name`required	`icon`	–	The icon name (an icons.json concept or Lucide name).
`size`	`sm \| default \| lg`	`"default"`	Glyph size.
`tone`	`neutral \| primary \| success \| warning \| danger \| info`	–	A colour tone instead of the current text colour.
`label`	`string`	–	An accessibility label when the icon stands alone.

Events and slots

No events, no slots. Children: none.

Accessibility

Role: img
Semantics: img when labelled, hidden otherwise

Not focusable; no keys.

Theming

Recipe parts: Icon/root
Keyed by: sizetone:hover:pressed:focus:disabled:checked:open:selected:invalid:dragover

Themes · Write a theme