Modal dialog
An example of a modal dialog using Motion and the HTML <dialog /> element. This example demonstrates smooth animations for opening and closing the modal, with a backdrop overlay and click-outside-to-close functionality.
Introduction
The Modal dialog example shows how to create a smooth, interactive modal using Motion and the HTML <dialog> element. This example uses the animate() function to orchestrate opening and closing animations, hover() to add scale effects on hover, and press() to handle tap interactions. Together, these Motion APIs create a polished modal experience with 3D perspective transforms, backdrop animations, and multiple ways to dismiss the dialog.