What problem does it solve?
PixiJS canvas-based UIs can be difficult to use with screen readers and keyboard-only navigation, because interactive content may not be discoverable or reachable through a semantic DOM.
Core Features & Use Cases
- Keyboard navigation and focus: Enables tab order via
tabIndex and controls when accessibility becomes active (for example, on Tab key press or immediately).
- Screen reader labeling: Provides accessible names and hints using
accessibleTitle, accessibleHint, and accessibleText for each interactive container.
- Shadow DOM overlay activation: Creates an invisible overlay layer positioned over accessible containers so assistive technologies can discover and activate them.
- Mobile activation behavior: Supports a hidden touch-hook approach where screen-reader focus activates the session.
- Common use case: Use it when building a game UI or interactive visualization in PixiJS and you need accessible buttons, dialogs, and navigational controls to be operable without a mouse.
Quick Start
Enable the PixiJS AccessibilitySystem, then mark a Sprite as accessible with an accessibleTitle, set eventMode and tabIndex for keyboard order, and handle pointertap to run your action.
