The <dialog> element handles modals the right way 🪟
Built-in focus trapping, backdrop styling, and Escape key handling. No more custom modal libraries.
⋅ .showModal() for modal dialogs
⋅ .show() for non-modal
⋅ ::backdrop for overlay styling
Learn more 👇
https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog
MDN Web Docs
npub1az…ntw5z
2026-04-16 21:00:11 UTC
Author Public Key
npub1azl49z5aacf56hgus0xn95fhrtmvuy9kmj6lnczk979pwsdddulqqntw5zSeen on
wss://relay.momostr.pinkPublished at
2026-04-16 21:00:11 UTCEvent JSON
{
"id": "208730cf5e450f8e97a36ef1b29092c643a43d0cf8459b955ca5878b379c279b",
"pubkey": "e8bf528a9dee134d5d1c83cd32d1371af6ce10b6dcb5f9e0562f8a1741ad6f3e",
"created_at": 1776373211,
"kind": 1,
"tags": [
[
"proxy",
"https://mastodon.social/@mdn/116416394802994447",
"web"
],
[
"proxy",
"https://mastodon.social/users/mdn/statuses/116416394802994447",
"activitypub"
],
[
"L",
"pink.momostr"
],
[
"l",
"pink.momostr.activitypub:https://mastodon.social/users/mdn/statuses/116416394802994447",
"pink.momostr"
],
[
"-"
]
],
"content": "The \u003cdialog\u003e element handles modals the right way 🪟\n\nBuilt-in focus trapping, backdrop styling, and Escape key handling. No more custom modal libraries.\n\n⋅ .showModal() for modal dialogs\n⋅ .show() for non-modal\n⋅ ::backdrop for overlay styling\n\nLearn more 👇\nhttps://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog",
"sig": "5a9ce0193941c22940c727cb08684d5816b30b5eeee59190edd27302497174d1a5f858d6040f7c67b6fd557cd8c8991dd878a1aaf9802417154be2ed9bb6b2a9"
}