# Toast and snackbar

> A toast or snackbar reports what just happened in a short message that leaves on its own and does not block the screen. Material 3 calls it a snackbar and can add one action; iOS has no system toast.

Page: https://www.appetiteui.com/glossary/toast-snackbar. Snackbar vs toast: Material 3 and iOS. Also called Snackbar vs toast.

## Why it matters

A toast confirms what happened without stopping the person. Because it leaves on its own, it cannot carry anything that must be read.

On iOS there is no system toast, so a shared design has to draw its own.

## iOS and Android

|  | iOS | Android (Material 3) | Appetite UI |
| --- | --- | --- | --- |
| Name | No system component | Snackbar | Toast |

| Component | iOS | Material 3 | What differs |
| --- | --- | --- | --- |
| Snackbar | No counterpart | M3 / Snackbar, 344 wide | The Apple pages have no snackbar |

## In practice

A message that needs a decision is an alert, not a toast. A snackbar may carry one action, usually Undo.

Appetite UI draws it as Toast, and the Material set carries Snackbar at 344 wide with text only, text and action, and a longer action.

## Common mistakes

- Reporting a critical error in a toast that disappears. Use an alert.
- Adding more than one action. A snackbar takes one, usually Undo.
- Covering the tab bar or the floating action button.

## Questions

### What is the difference between a snackbar and a toast?

Both show a short message that disappears on its own. A Material 3 snackbar sits at the bottom and can carry one action, such as Undo; toast is the general name, from Android’s older Toast, for a message with no action.

### Does iOS have a toast?

No. iOS has no system toast; apps draw their own or use a banner. Appetite UI’s Toast covers both platforms, with two types and five states.

## Sources

1. [Material Design 3: Snackbar](https://m3.material.io/components/snackbar/overview)

## Related

- Docs: [Toast](https://www.appetiteui.com/docs/toast)
- Docs: [Material 3](https://www.appetiteui.com/docs/material-3)
- Article: [iOS vs Material 3: what changes per component](https://www.appetiteui.com/blog/ios-vs-material-3-components)
- Glossary: [Empty state](https://www.appetiteui.com/glossary/empty-state)
- Glossary: [Action sheet](https://www.appetiteui.com/glossary/action-sheet)
- Glossary: [Alert dialog](https://www.appetiteui.com/glossary/alert-dialog)
- Glossary: [Progress indicator](https://www.appetiteui.com/glossary/progress-indicator)
