What is Confirmation Dialog?

Confirmation Dialogs are modals that ask users to confirm destructive or important actions before proceeding—deleting data, leaving without saving, canceling subscriptions. Prevents accidents. Includes clear message, consequences, and two buttons (Confirm/Cancel). Cancel should be default focus.

When Should You Use This?

Use confirmation dialogs for destructive actions (delete, cancel subscription, leave without saving), irreversible changes, or expensive operations. Make message specific: "Delete 3 issues?" not "Are you sure?". Explain consequences: "This will permanently delete all data." Use danger color (red) for destructive button. Focus Cancel by default (safety).

Common Mistakes to Avoid

• •Confirming everything—only use for destructive/costly actions; don't ask to confirm "Mark as read"
• •Vague message—"Are you sure?" is useless; say what will happen: "Delete 12 customers?"
• •Wrong button focus—Cancel should be focused by default, not Delete
• •Generic buttons—"Delete project" is clearer than "OK"; "Keep editing" clearer than "Cancel"
• •No escape—always provide X button, Esc key, or click-outside to cancel

Real-World Examples

• •GitHub—"Delete repository" requires typing repo name, very explicit confirmation
• •Linear—"Delete 3 issues?" with list of issues, red "Delete" button
• •Stripe—"Cancel subscription?" explains what customer will lose
• •Notion—"Delete page?" with warning about nested pages being deleted too