# modal-backdrop

> Backdrop and animated panel of a <details> modal.

Status: Ready (Smootify 2.0)  
URL: https://www.smootify.io/docs/reference/elements/modal-backdrop  
Updated: 2026-10-13

## Where it can go

- **Inside** `details`.
- **Out of place,** it stays in the page and does nothing: removed when it has no next sibling element.

## What it requires

Nothing beyond Smootify: it works on every plan.

## Attributes on the element

- It reads `data-target` on `details`.
- It reads `data-overflow-body` on `details`.
- It reads `data-fix-position` on `details`.
- It reads `data-open-animation` on `details`.
- It reads `data-close-animation` on `details`.
- **Smootify writes** `data-state` on it: do not set them yourself.

## Loading

Its code loads only on pages that have `modal-backdrop`.