Link styled as a button.
Navigates to a destination while using button-like styling.
See it in context
What it is
A navigation link may have a filled or outlined treatment to make it prominent. Its underlying semantics remain a link so browser actions such as opening a new tab still work.
When to use it
Use a real link with a destination and make its label describe that destination.
Know the difference
An action button changes state; this pattern changes location using link semantics.
Across platforms
Web
Use a native button for an action and an anchor for navigation. Preserve keyboard activation and a visible focus indicator.
iOS · iPadOS · Android
Provide a comfortable touch target, use familiar system symbols when appropriate, and show a clear pressed or selected state.
macOS · Windows · Linux
Keep pointer, keyboard, and focus behavior consistent. Common commands can additionally expose a menu item or keyboard shortcut.
Go to the source
Primary documentation for the pattern and its platform conventions.