Open experiment
Holographic context menu
A self-contained context surface that opens a real command menu at the pointer or from the keyboard. Arrow keys move through commands, Enter activates, and Escape closes while restoring focus to the demonstration field.
Lab tested Responsive Dark mode Interactive
- Version
- 1.0.0
- Updated
- 2026-08-02
- Dependencies
- Zero
<section
class="cmp-holo-context"
tabindex="0"
aria-label="Context menu demo"
aria-describedby="cmp-holo-context-help"
>
<header><span>Canvas object</span><strong>Signal card #08</strong></header>
<div class="cmp-holo-context__object" aria-hidden="true"><i></i><b>CL</b></div>
<p id="cmp-holo-context-help">Right-click or press Shift+F10</p>
<div class="cmp-holo-context__menu" role="menu" hidden>
<button type="button" role="menuitem">
<span aria-hidden="true">⌘</span> Open inspector <kbd>I</kbd>
</button>
<button type="button" role="menuitem">
<span aria-hidden="true">◇</span> Duplicate <kbd>D</kbd>
</button>
<button type="button" role="menuitem">
<span aria-hidden="true">↗</span> Export <kbd>E</kbd>
</button>
<button type="button" role="menuitem">
<span aria-hidden="true">×</span> Remove <kbd>⌫</kbd>
</button>
</div>
<span class="cmp-holo-context__status" aria-live="polite">Menu closed</span>
</section>
No runtime reactions detected Open in Editor
Validated in the lab
Experiment report
- Schema and source files passed
- Responsive test passed
- Keyboard test passed
- No console errors
Component ingredients
- Dependencies
- None
- Browser support
- Current Chrome, Current Edge, Current Firefox, Current Safari
- Version
- 1.0.0
- Last tested
- 2026-08-02
Accessibility notes
- The trigger surface supports Shift+F10 as a keyboard equivalent.
- Commands use menuitem roles and roving focus.
- Escape closes the menu and restores focus.
License: MIT License for open-source use, modification, and distribution.