# Tray

A recess cut into the plate that holds other parts: keys, a selector, an empty state waiting for its first thing.

Kit part · With the Kit · https://tactileui.dev/parts/tray

> The code and styling for this part come with the Tactile UI Kit, which is in the Founder Pass. Sign in if you have it. Sign in: https://tactileui.dev/auth/sign-in The price: https://tactileui.dev/pricing

## Anatomy

The recess every well in the kit uses. No images, no script.

## Variants

- Holding keys
- Empty state
- Inside a panel

## States

- Empty
- Holding keys
- One latched

## Usage notes

The upper wall is in shadow and the lower lip catches the lamp: that is what makes it read as cut in.

## Accessibility

- A tray is presentation. When its keys are one control (only one can be down), use a selector: it is a real radio group.
- An empty state says what goes here in words; the unlit lamp is a second signal.

## Related parts

- [Panel](https://tactileui.dev/parts/panel): A face plate that groups what belongs together: a head, a rule, then the parts. Screws only on device-like panels.
- [Selector](https://tactileui.dev/parts/selector): One mode of two to five: latching keys in a tray, one down at a time, each with a lamp that lights when chosen.
- [Key](https://tactileui.dev/parts/key): Every button, and every link that acts like one: a cap on a skirt that drops below the plate when pressed.