<menu> Menu list
A list of commands like toolbar buttons; browsers treat it as a ul.
<menu> is a semantic stand-in for <ul> when the items are interactive commands, such as the buttons on a toolbar. It holds <li> items and renders as an unordered list.
Browsers and screen readers handle it exactly as they handle ul. Site navigation links go in <nav> with a ul.
The menu element in the WHATWG standard (opens in a new tab) describes it as a toolbar, a list of commands. Compare it with the ul element.
Syntax
<menu>
<li><button type="button">Command</button></li>
</menu>When to use it
A <menu> groups buttons that do something to the current page or item. Bold, Italic and Link above a comment box are one example. Share and Save under an article are another, and so are Edit and Delete beside each row of a list. Anyone reading the code knows the list holds commands. Visitors see an ordinary list.
Links to other pages go in nav with a ul. And menu on its own will not make a dropdown open and close. That takes a button with a script, or the details element for a simple disclosure.
Since it renders like a ul, a menu comes with bullets and left padding. A toolbar usually needs list-style:none, padding:0 and inline-block items. Inside a form, give every button type="button", or a click on any command submits the form.
Live example
Edit the code and watch the preview.
<menu>
<li><button type="button">Copy</button></li>
<li><button type="button">Cut</button></li>
<li><button type="button">Paste</button></li>
</menu>More examples
Article action toolbar
Three command buttons in a menu under a short article. The CSS strips the bullets and padding and lines the items up with inline blocks, the way most toolbars look.
<style>
menu{list-style:none;padding:0}
menu li{display:inline-block;margin-right:.5em}
</style>
<article>
<h3>Spring opening hours</h3>
<p>From April we open at 8:00 on weekdays.</p>
<menu>
<li><button type="button">Share</button></li>
<li><button type="button">Save</button></li>
<li><button type="button">Print</button></li>
</menu>
</article>Actions on each row
Every file in the list has its own little menu of actions. Because a menu can sit inside an li, the commands stay next to the item they act on.
<style>
.files menu{display:inline-block;list-style:none;margin:0 0 0 1em;padding:0}
.files menu li{display:inline-block}
</style>
<ul class="files">
<li>holiday-photos.zip
<menu>
<li><button type="button">Rename</button></li>
<li><button type="button">Delete</button></li>
</menu>
</li>
<li>invoice-march.pdf
<menu>
<li><button type="button">Rename</button></li>
<li><button type="button">Delete</button></li>
</menu>
</li>
</ul>Tip: menu for command buttons; nav with ul for links.
Browser support
All browsers support menu and draw it exactly like a ul, bullets and padding included. It is current HTML and not deprecated. Browsers add no behavior of their own, though. Keyboard handling and focus work the same as for any list of buttons.
Accessibility
menu is exposed as a plain list, so users move through it like any other list. It is not an ARIA menu. Leave out role="menu" unless you also build the full arrow-key behaviour; the W3C menu and menubar pattern (opens in a new tab) lists what a real ARIA menu needs.
Common mistakes
Wrong
<menu>
<a href="/">Home</a>
</menu>Right
<menu>
<li><button type="button">Copy</button></li>
</menu>menu follows the ul rule: li children only.
Frequently asked questions
Should I use the menu tag for a navigation menu?
No. Put site navigation in <nav>, normally with a <ul> of links. The HTML Living Standard defines <menu> as a semantic alternative to ul for a list of commands, for example the toolbar buttons in an editor. Browsers expose it as a list, identical to ul.
Does the menu tag create a context menu?
Not any more. Older specs had type="context" and <menuitem> for custom right-click menus. Browsers never implemented them consistently, so both were dropped, and menu is now only a list. An interactive menu needs your own JavaScript plus the ARIA menu pattern, and that pattern is meant for application-style menus. Wikipedia's context menu (opens in a new tab) article explains what these menus are.