HTML <dialog> tagto create a new popup dialog on a web page. This tag represents a dialog box or other interactive component like window.

The <dialog> element uses a boolean attribute called open that activate element and facilitate user to interact with it.

HTML dialog is a new tag introduced in HTML5.

HTML dialog tag example

 <div>
<dialog id=“myFirstDialog” style=“width:50%;background-color:#F4FFEF;border:1px dotted black;”>
<p><q>I am so clever that sometimes I don’t understand a single word of what I am saying.
</q> – <cite>Oscar Wilde</cite></p>
<button id=“hide”>Close</button>
</dialog>
<button id=“show”>Show Dialog</button>
</div>
<!– JavaScript to provide the “Show/Close” functionality –>
<script type=“text/JavaScript”>
(function() {
    var dialog = document.getElementById(‘myFirstDialog’);
   document.getElementById(‘show’).onclick = function() {
       dialog.show();
   };
    document.getElementById(‘hide’).onclick = function() {
        dialog.close();
   };
})();
</script>

Output:

HTML dialog tag also supports global and event attributes in HTML.