How you get here
Modals are the cheapest way to add a screen. They need no route, no layout decision and no thought about where the thing lives. So the first one appears reasonably — a short confirm, a small form — and then each subsequent need is solved the same way, because the mechanism is already there.
The second modal is not a new mistake. It is the first modal admitting it was carrying too much.
How to recognise it
- Two or more overlays stacked, with two dimmed layers behind.
- Escape closes the wrong one, or closes all of them and loses everything typed.
- A modal has grown tabs, or a stepper, or its own scrollbar.
- Someone needs a value from the page behind and has to close, look, reopen, and retype.
- The modal cannot be linked to, so "look at this record" is a set of instructions rather than a URL.
- The browser Back button leaves the page entirely instead of closing the top layer.
Why it fails
A modal makes exactly one promise: this is the only thing that matters right now. Stacking them breaks the promise on the first repetition — clearly the thing underneath also mattered, because you are still holding it.
The specific damage is to context. A modal deliberately blocks the page, so anything you need from that page is unreachable. In a single modal that is an acceptable trade for a bounded task. In a stack it is the reason the person is stuck, and it produces the worst workaround in internal software: opening the same record in a second browser tab to read what the modal is covering.
The way out
- Never open a modal from a modal. Treat this as a hard rule; it is the one that keeps the rest honest.
- When you want to, promote the first modal to a page. It has outgrown the surface, and the second modal is the evidence.
- If the parent list must stay visible, that is a drawer, not a modal — and a drawer can host a genuine modal above it for a bounded confirm.
- Pick one surface per kind of object and use it everywhere. Most mazes grow in products where the same record opens three different ways.
- Give anything with depth a URL. If people need to share it, it was never a modal.
The one legitimate stack
A confirmation over a form — "discard your changes?" — is a genuine second layer, because it is about the first one and it is bounded, immediate and has one way out. That is the exception, and it is the only one worth allowing.
The test
Count the dimmed layers on screen. More than one, and something on the stack deserved a page. Then check whether Escape closes only the top layer and Back does something sensible — if not, people are already losing work.