A modular context menu opens on a local pixel lattice, highlights neighboring cells and exposes shortcuts, status and destructive actions with clear hierarchy.
ReadyDOM NATIVERESPONSIVEPOINTER SAFE
RENDERERDOM / CSS
DEPENDENCIESReact + CSS
OUTPUTResponsive component
MOTIONReduced-safe
A modular context menu opens on a local pixel lattice, highlights neighboring cells and exposes shortcuts, status and destructive actions with clear hierarchy.
- Product navigation
- Account flows
- Application shells
- Menu rows use native button semantics and visible focus
- Local pixel grid reacts without intercepting actions
- Destructive action is separated by label, color and border
- A component-specific renderer and control contract—not a palette swap of another release
- Semantic controls, visible focus and keyboard navigation ship with the visual system
No animation package or external preview asset is required. Layout is container-scoped and decorative motion is disabled when reduced motion is requested.
Pointer, touch, horizontal trackpad and keyboard states use the same underlying component state.
Native landmarks and controls preserve reading order, visible focus and keyboard access. Motion never carries the only meaning.
BEHAVIOR
Built to move without taking over.
- Menu rows use native button semantics and visible focus
- Local pixel grid reacts without intercepting actions
- Destructive action is separated by label, color and border
- A component-specific renderer and control contract—not a palette swap of another release
- Semantic controls, visible focus and keyboard navigation ship with the visual system
USE IT
Sign in, copy the source, rename it, tune the values and ship it inside your own system.