Potential focus visibility issue in annotations/hotspots
Author: MalvozCreated Aug 17, 2026Updated Aug 18, 2026
Potential a11y issue
Annotations may fail WCAG Focus Visible and/or Focus Appearance on focus.
Steps to reproduce:
- Go to https://modelviewer.dev/examples/annotations/#cameraViews
- Tab to the first annotation/hotspot
- Notice how the focused annotation element and belonging focus outline is barely visible:
Relevant CSS:
Potential solution
We can ensure the element and focus outline is visible on focus by not changing the opacity if there's focus-within the slotted annotation wrapper:
.annotation-wrapper.hide ::slotted(:not(:focus-within)) {
opacity: var(--min-hotspot-opacity, 0.25);
}Result:
The annotation and focus outline is now fully visible if there's focus within:
Disclaimer
I'm not personally a user of <model-viewer>, I'm here mostly due to @svinkle's model a11y work and my interest in the <model> element proposal.
Source: google/model-viewer