Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Kbd examples · Platform Specific

Mac Option Symbol Kbd for React

The Mac Option symbol and Tab grouped as an ⌥Tab shortcut.

Framework
UI library

Mac keyboards call the Alt key Option and mark it with ⌥. This React example writes it as that symbol and groups it with Tab in a KbdGroup, the way macOS menus show shortcuts. In Safari, for example, ⌥Tab moves focus to every link and button when Tab alone skips them.

Preview

Preview width
⌥Tab

Installation

Sign in to get your install command
Free with an account. It carries your token, so the CLI installs everything in one go.
GoogleGitHub
Use email insteadNo credit card

FAQ

Should I show ⌥ or Alt for Mac users?

⌥, or the word Option: that's what Mac keyboards and menus say. Alt is the Windows and Linux name for the same key.

What is the ⌥ symbol and how do I type it?

It's the option key sign, U+2325. Paste it from macOS's Character Viewer or copy it from here; it's a plain character in the string.

Which Option shortcuts do Mac users need?

⌥ with the arrow keys moves by word in text, ⌥ Delete deletes a word, ⌥ click on a link downloads it in Safari, and ⌥ shows extra items in many menus.

How do I document Option for special characters?

Option types accents and symbols on Mac: ⌥E then E for é, ⌥G for ©. Avoid ⌥ letter shortcuts in your app for that reason, since they can stop people typing those characters.

Do screen readers read ⌥?

Not reliably. Add Option as visually hidden text inside the cap, with the symbol hidden, when it matters.

What is the Windows equivalent of Option?

Alt, the key in the same place. Alt shortcuts on Windows often use ⌥ on Mac, but check each one: some map to ⌘ instead.

All 39 kbd examples