Published on April 28, 2026
Go homeCSS tricks for HTML dialog elements
Stop the backdrop from scrolling when the dialog is open.
body:has(dialog[open]) {
overflow: hidden;
}
Apply tailwind CSS blur.
dialog::backdrop {
@apply backdrop-blur-[2px];
}