Tooltip Reference

This page is a complete reference for every field in the Vesper Inspect hover tooltip. Fields are shown conditionally based on the element type - not every field appears for every element.

Accessible Name

Always shown. The computed accessible name of the element - the text that assistive technology will announce when interacting with it.

Value Meaning
A text string The computed name. May come from element content, aria-label, aria-labelledby, alt, title, or an associated <label>.
None No accessible name could be computed. For interactive elements this is usually a problem - buttons, links, and inputs require accessible names.
(hidden) The element is hidden from assistive technology via aria-hidden="true" or display: none.

Role

Always shown. The ARIA role of the element, either explicit (role="button") or implicit (a <button> element has an implicit role of button).

Common implicit roles to know:

Element Implicit role
<a href>link
<button>button
<input type="text">textbox
<input type="checkbox">checkbox
<select>combobox
<img>img
<img alt="">presentation
<nav>navigation
<main>main
<h1>-<h6>heading

ARIA Attributes

Shown when ARIA attributes are present. Displays all aria-* attributes on the element as key-value pairs. If no ARIA attributes are present, this row is hidden.

Tab Index

Shown for focusable elements.

Value Meaning
In tab sequence (position N) The element is reachable via Tab and is at the given position in the sequence.
Programmatic only (tabindex="-1") The element can receive focus via script but is not in the Tab sequence.
Not focusable The element is neither natively focusable nor has a tabindex attribute.

Contrast Ratio

Shown for text elements. The computed contrast ratio between the text color and its background, along with a pass/fail indicator for WCAG AA.

Threshold Applies to
4.5:1 Normal text (below 18pt / 24px, or below 14pt bold / ~18.67px bold)
3:1 Large text (18pt / 24px or larger, or 14pt bold / ~18.67px bold or larger)
Contrast detection works best on elements with a solid or near-solid background color. Text over complex gradients, patterns, or photographs may show an approximate value.

Font

Shown when the element has direct text content. Displays font size (px), weight, WCAG large-text classification, and font family.

The large-text badge is highlighted when the text meets WCAG's large text threshold - useful for quickly confirming which contrast ratio applies to a given text element.

Colors

Shown for text elements. The raw hex values for the computed foreground (text) color and background color. These match the values used to calculate the contrast ratio above.