Confirmation Dialog
Also called are you sure dialog, alert dialog, destructive confirm
A modal asking the user to approve an action before it is carried out.
Example
Reversible — just do it
3 files selected.
No dialog, because there is nothing to protect against. One click does it, one click puts it back.
Irreversible — ask first
3 files in the trash.
The dialog names what goes, says it cannot be undone, and puts the first focus on the way out. Escape cancels.
Nothing has happened yet.
Neither button says “OK”. Both say what they will do, so the sentence still makes sense when a screen reader reads the button on its own — “Delete 3 files”, “Keep the files”.
When to use it
- The action genuinely cannot be undone — permanent deletion, sending something outward, spending money.
- The consequence is wider than the click: it affects other people, other data, or something in the physical world.
- The user may not realise what is included. “Delete project” taking 40 files with it is worth spelling out.
When not to
- The action is reversible. Do it, then offer Undo — one click instead of two, and no interruption for the 99% who meant it.
- It fires constantly. A confirmation people see ten times a day is dismissed without reading, which removes the protection it claimed to provide.
- It is standing in for a fix. Confirming an accidental drag is worse than making the drag harder to trigger by accident.
Trade-offs
- A real stop before an irreversible step, when there is nothing to fall back on.
- Room to say exactly what will happen — how many items, whose, from where.
- Puts the wording of the action in front of the user at the moment they commit to it.
- Trains dismissal. The more often it appears, the less it is read, until it protects nothing.
- Costs a click and a context switch every single time, including the times it was not needed.
- Often used instead of undo, which is more work for the user and less safety for everyone.
Accessibility
What this pattern needs in order to work for everyone.
- Keyboard
- Escape cancels. The safe outcome must always be the cheapest key to reach.
- Focus moves into the dialog on open and is trapped there, and returns to the trigger on close — including when the action is carried out.
- Enter must not fire the destructive button by reflex. Put initial focus on Cancel, and let the user reach the other one deliberately.
- Roles and state
- `role="alertdialog"` rather than `dialog`, with `aria-labelledby` on the question and `aria-describedby` on the consequence — the description is announced immediately, which is the point.
- Name the buttons after the action, not the answer: “Delete 3 files” and “Cancel”, never “OK” and “Cancel”.
- Do not close on an outside click. A dialog that vanishes because someone missed is not a confirmation.
- State the scope in text: how many items, and whether it can be recovered.
- Focus
- Initial focus on the cancelling control. After confirming, focus goes somewhere still meaningful — the list that changed, not a button that no longer exists.
In the wild
- Gmail — Deleting does not confirm — it moves to Trash and shows Undo. The confirmation is reserved for emptying Trash.
- GitHub repository deletion — Type the repository name to enable the button: friction proportional to the consequence.