{modal} writes an HTML <dialog> holding its content, with the heading from title=, and a button that opens it. The content renders first; on the end walk the tag puts it in the dialog. The name is required and becomes the id pad-modal-<name>, so an address ending in #pad-modal-terms opens that dialog on arrival.

The button opens the dialog as a modal in the first way the browser can: the HTML invoker commands (commandfor, command="show-modal") where it has them; otherwise a small script, written once per page (with the CSP nonce when $padCsp asks for one), that calls showModal() and close(); and with scripting off a link to the dialog's id, shown by the CSS as an overlay with a close link back to the opener. Opened, the page behind is inert, the focus moves into the dialog and back to the button afterwards, and Escape, the close button or a click on the backdrop closes it.

title= heads and names the dialog; button= is the button text, Open by default; a dialog without a title takes the button text as its heading. A name that is not letters, digits, _ and - is an error under the strict check, as is a {modal} that never closes. The colours are --pad-modal-accent, -on, -text, -muted, -line, -surface and -backdrop on .pad-modal.