# Shadcn Custom Sizing

> Custom sizing

- Type: example, free and open source (MIT)
- Component: [Icon Tile](https://reui.io/components/icon-tile.md)
- Page: https://reui.io/components/icon-tile/c-icon-tile-7
- Docs (Base UI): https://reui.io/docs/components/base/icon-tile.md
- Docs (Radix UI): https://reui.io/docs/components/radix/icon-tile.md
- MCP: `get_example("c-icon-tile-7")`
- Registry item: https://reui.io/r/styles/base-nova/c-icon-tile-7.json
- Uses: Icon Tile

## Best for

Resizing outside the size prop 2 ways, size classes on tile and glyph or both size variables in one class

## Agent notes

- `size-14` on the tile resizes only the box; the glyph keeps the default step's size unless it carries its own `size-7`

## When not to use

- A box that matches one of the built in steps from xs to xl: use [Sizes](https://reui.io/components/icon-tile/c-icon-tile-5.md) (`get_example("c-icon-tile-5")`)

## Install

```bash
npx shadcn@latest add @reui/c-icon-tile-7
```

## About Shadcn Icon Tile

### When to use

- Square media for list rows, feature cards and empty states, held to one size and radius
- Status and brand markers in a soft tint, a solid fill or a theme or Tailwind palette color
- Compact links, initials or counts, and glyphs with a status dot pinned to one corner

### When not to use

- A finished first run screen with heading, message and actions around the glyph: use the [Empty State blocks](https://reui.io/blocks/application/empty-state.md)
- A finished KPI or feature tile with a value, a label and a trend beside the glyph: use the [Card blocks](https://reui.io/blocks/application/card.md)
- Markers for each step of a multi step flow, with active and completed states: use [Stepper](https://reui.io/components/stepper.md) (`get_component("stepper")`)

Every ReUI item has a twin like this one; the index is https://reui.io/llms.txt. Agents with the ReUI MCP (https://reui.io/docs/mcp) get the same guidance from the getters named above.