---
url: https://brand.okrado.com/patterns/toast/
title: Toast
description: A brief confirmation that an action happened, with an optional action.
kind: reference
owner: hmdmsd
updated: 2026-11-03
review_by: 2027-02-28
audience:
  - designer
  - developer
  - agent
---

# Toast

> A brief confirmation that an action happened, with an optional action.

A toast confirms a result without taking focus: “Saved”, “Published”. It uses the same verb as the button that caused it. It never opens a modal, and anything the person must act on belongs in the page, not in a toast that disappears.

## Behaviour

Read from the component manifest, so this is the component’s own contract. See [Overlays](https://brand.okrado.com/patterns/overlays/) for layers, stacking and dismissal shared by all layers.

### `ToastProvider`

| Stage         | beta                                                                                                                                                                                                                                                                                                                              |
| ------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Keyboard      | - F6 moves focus to the toast region
- Tab reaches the action and the dismiss button
- Escape dismisses the focused toast                                                                                                                                                                                                         |
| Dismissal     | * escape: dismisses the focused toast
* outside press: no
* close button: yes
* timer: 5 s, 9 s with an action, paused on hover and focus                                                                                                                                                                                         |
| Stacking      | Above dialogs and popovers (z-toast); a toast never opens a modal, and a modal never waits on one.                                                                                                                                                                                                                                |
| Accessibility | - The region is a labelled live region: a polite toast is announced when the screen reader is free and an urgent one at once, without moving focus; F6 moves focus to the region. The timer pauses while the pointer or focus is on a toast. Every toast has a dismiss button and at most one action. At most three show at once. |
| Pattern       | [APG: alert](https://www.w3.org/WAI/ARIA/apg/patterns/alert/)                                                                                                                                                                                                                                                                     |
| Docs          | [Storybook](https://brand.okrado.com/components/?path=/docs/primitives-toastprovider--docs)                                                                                                                                                                                                                                       |
