# IconWell

> A rounded square tile that holds a landing metaphor glyph — a quiet hairline ring by default, or a brand-tinted badge.

```ts
import { IconWell } from "@sdxc/ui/landing";
```

Centers a glyph in a rounded square so landing claim icons share one size
language across bands, with the same tile Feature.Icon draws.

## Examples

```tsx
<IconWell><ZapIcon size={18} aria-hidden="true" /></IconWell>
```

```tsx
<IconWell tone="brand"><ZapIcon size={18} aria-hidden="true" /></IconWell>
```

## Props

| Prop | Type | Description |
| --- | --- | --- |
| `size?` | `"sm" \| "md" \| "lg"` | Footprint. Defaults to DEFAULT_SIZE. |
| `tone?` | `Tone` | Tile chrome. Defaults to DEFAULT_TONE. |
| `children` | `RemixNode` | Glyph rendered inside the well — typically an `@sdxc/icons` icon. |

Also accepts everything in `TagProps<"span">`.


## Types

| Name | Values | What it decides |
| --- | --- | --- |
| `Size` | `"sm" \| "md" \| "lg"` | Well footprint: compact for dense grids, medium for every claim beside a Feature.Icon, large for a lone hero metaphor. |
