j3w1 / color.interaction.focus.ringVue · HTML · React · Astro

J3W1 / DESIGN SYSTEM

color.interaction.focus.ring

1px dashed focus ring on controls and rows.

Source revision 1faefcf014c8bf01a6b27308ea796da968773a81

Find related usage · Specification anchor · Measured contrast report (default profile)

Report an issue with this token

color.interaction.focus.ring
--color-interaction-focus-ring

default · approved

Resolved value
#e53935
Status
observed
Consumption
use — Use within the role's documented scope and restrictions.
Decisions
None pending.
Source
tokens/semantic.tokens.json:291 /color/interaction/focus/ring
Alias chain
color.primitive.red.800
Used by aliases
focus.ring

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
alert · contrast—focus-visible · color.status.info.tintspec/components/alert.md:71 /contrast/14
button · contrast—hover · color.action.secondary.hover-bgspec/components/button.md:72 /contrast/5
diff-view · contrast—focus-visible · color.diff.added.bgspec/components/diff-view.md:86 /contrast/16
diff-view · contrast—focus-visible · color.diff.modified.bgspec/components/diff-view.md:88 /contrast/18
diff-view · contrast—focus-visible · color.diff.removed.bgspec/components/diff-view.md:87 /contrast/17
drawer · contrast—— · color.surface.overlayspec/components/drawer.md:51 /contrast/3
i3-window-frame · contrast—— · color.surface.chromespec/components/i3-window-frame.md:77 /contrast/6
link · contrast—hover · color.interaction.hover.bg-strongspec/components/link.md:46 /contrast/4
skip-link · contrast—focus-visible · color.surface.raisedspec/components/skip-link.md:29 /contrast/0
table · contrast—— · color.surface.defaultspec/components/table.md:68 /contrast/3
Shared rule · contrast—— · color.surface.canvasspec/contrast.json:41 /pairs/37
Shared rule · contrast—— · color.surface.defaultspec/contrast.json:42 /pairs/38
alert · partclose.ring—spec/components/alert.md:51 /tokens/close.ring
avatar · partcontrol.focus—spec/components/avatar.md:30 /tokens/control.focus
breadcrumbs · partlink.ring—spec/components/breadcrumbs.md:33 /tokens/link.ring
button-group · partcontrol.focus—spec/components/button-group.md:30 /tokens/control.focus
button · partsecondary.ring · secondary—spec/components/button.md:41 /tokens/secondary.ring
chart · partcontrol.focus—spec/components/chart.md:30 /tokens/control.focus
checkbox · partbox.ring—spec/components/checkbox.md:36 /tokens/box.ring
chip · partroot.ring—spec/components/chip.md:37 /tokens/root.ring
combobox · partroot.ring—spec/components/combobox.md:39 /tokens/root.ring
command-palette · partcontrol.focus—spec/components/command-palette.md:33 /tokens/control.focus
compact-dashboard · partcontrol.focus—spec/components/compact-dashboard.md:32 /tokens/control.focus
data-table · partrow.ring—spec/components/data-table.md:43 /tokens/row.ring
date-picker · partroot.ring—spec/components/date-picker.md:35 /tokens/root.ring
description-list · partcontrol.focus—spec/components/description-list.md:29 /tokens/control.focus
diagnostics · partrow.ring—spec/components/diagnostics.md:56 /tokens/row.ring
dialog · partclose.ring—spec/components/dialog.md:40 /tokens/close.ring
diff-view · partrow.ring—spec/components/diff-view.md:58 /tokens/row.ring
disclosure · partcontrol.focus—spec/components/disclosure.md:31 /tokens/control.focus
drawer · partclose.ring—spec/components/drawer.md:40 /tokens/close.ring
editor-search · partcontrol.focus—spec/components/editor-search.md:31 /tokens/control.focus
empty-state · partaction.ring—spec/components/empty-state.md:31 /tokens/action.ring
error-state · partcontrol.focus—spec/components/error-state.md:32 /tokens/control.focus
file-browser · partcontrol.focus—spec/components/file-browser.md:33 /tokens/control.focus
file-input · partbutton.ring—spec/components/file-input.md:36 /tokens/button.ring
filterable-table · partrow.ring—spec/components/filterable-table.md:54 /tokens/row.ring
i3-window-frame · partworkspace.ring—spec/components/i3-window-frame.md:41 /tokens/workspace.ring
icon-button · partroot.ring—spec/components/icon-button.md:29 /tokens/root.ring
kbd · partcontrol.focus—spec/components/kbd.md:28 /tokens/control.focus
link · partroot.ring—spec/components/link.md:30 /tokens/root.ring
list · partrow.ring—spec/components/list.md:40 /tokens/row.ring
menu · partbutton.ring—spec/components/menu.md:42 /tokens/button.ring
multiselect · partcontrol.focus—spec/components/multiselect.md:32 /tokens/control.focus
number-field · partroot.ring—spec/components/number-field.md:34 /tokens/root.ring
pagination · partlink.ring—spec/components/pagination.md:32 /tokens/link.ring
popover · partcontrol.focus—spec/components/popover.md:31 /tokens/control.focus
radio-group · partbox.ring—spec/components/radio-group.md:34 /tokens/box.ring
range · partcontrol.focus—spec/components/range.md:30 /tokens/control.focus
repeater · partcontrol.focus—spec/components/repeater.md:31 /tokens/control.focus
search-field · partroot.ring—spec/components/search-field.md:35 /tokens/root.ring
segmented-control · partcontrol.focus—spec/components/segmented-control.md:31 /tokens/control.focus
select · partroot.ring—spec/components/select.md:37 /tokens/root.ring
settings-panel · partcontrol.ring—spec/components/settings-panel.md:42 /tokens/control.ring
sidebar-nav · partlink.ring—spec/components/sidebar-nav.md:40 /tokens/link.ring
skeleton · partcontrol.focus—spec/components/skeleton.md:30 /tokens/control.focus
skip-link · partroot.ring—spec/components/skip-link.md:24 /tokens/root.ring
switch · parttrack.ring—spec/components/switch.md:35 /tokens/track.ring
table · partsort.ring—spec/components/table.md:43 /tokens/sort.ring
tabs · parttab.ring—spec/components/tabs.md:40 /tokens/tab.ring
text-field · partroot.ring—spec/components/text-field.md:46 /tokens/root.ring
textarea · partroot.ring—spec/components/textarea.md:37 /tokens/root.ring
time-picker · partroot.ring—spec/components/time-picker.md:31 /tokens/root.ring
timeline · partcontrol.focus—spec/components/timeline.md:29 /tokens/control.focus
toast · partclose.ring—spec/components/toast.md:53 /tokens/close.ring
toolbar · partbutton.ring—spec/components/toolbar.md:34 /tokens/button.ring
tooltip · parttrigger.ring—spec/components/tooltip.md:35 /tokens/trigger.ring
tree · partcontrol.focus—spec/components/tree.md:34 /tokens/control.focus
wizard · partstep.ring—spec/components/wizard.md:32 /tokens/step.ring
alert · stateoutlinefocus-visible · color.status.info.tintspec/components/alert.md:55 /stateTokens/focus-visible/outline
breadcrumbs · stateoutlinefocus-visible · color.surface.defaultspec/components/breadcrumbs.md:41 /stateTokens/focus-visible/outline
checkbox · stateoutlinefocus-visible · color.surface.inputspec/components/checkbox.md:53 /stateTokens/focus-visible/outline
chip · stateoutlinefocus-visible · color.surface.defaultspec/components/chip.md:50 /stateTokens/focus-visible/outline
combobox · stateoutlinefocus-visible · color.surface.inputspec/components/combobox.md:67 /stateTokens/focus-visible/outline
data-table · stateoutlinefocus-visible · color.surface.defaultspec/components/data-table.md:58 /stateTokens/focus-visible/outline
date-picker · stateoutlinefocus-visible · color.surface.inputspec/components/date-picker.md:68 /stateTokens/focus-visible/outline
diagnostics · stateoutlinefocus-visible · color.surface.defaultspec/components/diagnostics.md:67 /stateTokens/focus-visible/outline
dialog · stateoutlinefocus-visible · color.surface.overlayspec/components/dialog.md:59 /stateTokens/focus-visible/outline
diff-view · stateoutlinefocus-visible · color.code.bgspec/components/diff-view.md:66 /stateTokens/focus-visible/outline
file-input · stateoutlinefocus-visible · color.surface.canvasspec/components/file-input.md:59 /stateTokens/focus-visible/outline
filterable-table · stateoutlinefocus-visible · color.surface.defaultspec/components/filterable-table.md:76 /stateTokens/focus-visible/outline
icon-button · stateoutlinefocus-visible · color.action.secondary.bgspec/components/icon-button.md:41 /stateTokens/focus-visible/outline
link · stateoutlinefocus-visible · color.surface.canvasspec/components/link.md:38 /stateTokens/focus-visible/outline
list · stateoutlinefocus-visible · color.surface.defaultspec/components/list.md:52 /stateTokens/focus-visible/outline
menu · stateoutlinefocus-visible · color.surface.defaultspec/components/menu.md:59 /stateTokens/focus-visible/outline
number-field · stateoutlinefocus-visible · color.surface.inputspec/components/number-field.md:55 /stateTokens/focus-visible/outline
pagination · stateoutlinefocus-visible · color.surface.defaultspec/components/pagination.md:43 /stateTokens/focus-visible/outline
radio-group · stateoutlinefocus-visible · color.surface.inputspec/components/radio-group.md:51 /stateTokens/focus-visible/outline
search-field · stateoutlinefocus-visible · color.surface.inputspec/components/search-field.md:54 /stateTokens/focus-visible/outline
select · stateoutlinefocus-visible · color.surface.inputspec/components/select.md:57 /stateTokens/focus-visible/outline
settings-panel · stateoutlinefocus-visible · color.surface.inputspec/components/settings-panel.md:55 /stateTokens/focus-visible/outline
sidebar-nav · stateoutlinefocus-visible · color.surface.defaultspec/components/sidebar-nav.md:54 /stateTokens/focus-visible/outline
skip-link · stateoutlinefocus-visible · color.surface.raisedspec/components/skip-link.md:27 /stateTokens/focus-visible/outline
switch · stateoutlinefocus-visible · color.surface.inputspec/components/switch.md:50 /stateTokens/focus-visible/outline
tabs · stateoutlinefocus-visible · color.surface.defaultspec/components/tabs.md:46 /stateTokens/focus-visible/outline
tabs · stateoutlineselected+focus-visible · color.surface.defaultspec/components/tabs.md:48 /stateTokens/selected+focus-visible/outline
text-field · stateoutlinefocus-visible · color.surface.inputspec/components/text-field.md:70 /stateTokens/focus-visible/outline
textarea · stateoutlinefocus-visible · color.surface.inputspec/components/textarea.md:59 /stateTokens/focus-visible/outline
time-picker · stateoutlinefocus-visible · color.surface.inputspec/components/time-picker.md:54 /stateTokens/focus-visible/outline
toast · stateoutlinefocus-visible · color.surface.canvasspec/components/toast.md:59 /stateTokens/focus-visible/outline
toolbar · stateoutlinefocus-visible · color.surface.chromespec/components/toolbar.md:44 /stateTokens/focus-visible/outline
tooltip · stateoutlinefocus-visible · color.surface.canvasspec/components/tooltip.md:40 /stateTokens/focus-visible/outline
wizard · stateoutlinefocus-visible · color.surface.canvasspec/components/wizard.md:57 /stateTokens/focus-visible/outline

Relevant contrast declarations

heritage-ansi · heritage

Resolved value
#e53935
Status
observed
Consumption
historical-only — Historical fidelity only; preserve all documented limitations and deprecations.
Decisions
None pending.
Source
tokens/semantic.tokens.json:291 /color/interaction/focus/ring
Alias chain
color.primitive.red.800
Used by aliases
focus.ring

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
alert · contrast—focus-visible · color.status.info.tintspec/components/alert.md:71 /contrast/14
button · contrast—hover · color.action.secondary.hover-bgspec/components/button.md:72 /contrast/5
diff-view · contrast—focus-visible · color.diff.added.bgspec/components/diff-view.md:86 /contrast/16
diff-view · contrast—focus-visible · color.diff.modified.bgspec/components/diff-view.md:88 /contrast/18
diff-view · contrast—focus-visible · color.diff.removed.bgspec/components/diff-view.md:87 /contrast/17
drawer · contrast—— · color.surface.overlayspec/components/drawer.md:51 /contrast/3
i3-window-frame · contrast—— · color.surface.chromespec/components/i3-window-frame.md:77 /contrast/6
link · contrast—hover · color.interaction.hover.bg-strongspec/components/link.md:46 /contrast/4
skip-link · contrast—focus-visible · color.surface.raisedspec/components/skip-link.md:29 /contrast/0
table · contrast—— · color.surface.defaultspec/components/table.md:68 /contrast/3
Shared rule · contrast—— · color.surface.canvasspec/contrast.json:41 /pairs/37
Shared rule · contrast—— · color.surface.defaultspec/contrast.json:42 /pairs/38
alert · partclose.ring—spec/components/alert.md:51 /tokens/close.ring
avatar · partcontrol.focus—spec/components/avatar.md:30 /tokens/control.focus
breadcrumbs · partlink.ring—spec/components/breadcrumbs.md:33 /tokens/link.ring
button-group · partcontrol.focus—spec/components/button-group.md:30 /tokens/control.focus
button · partsecondary.ring · secondary—spec/components/button.md:41 /tokens/secondary.ring
chart · partcontrol.focus—spec/components/chart.md:30 /tokens/control.focus
checkbox · partbox.ring—spec/components/checkbox.md:36 /tokens/box.ring
chip · partroot.ring—spec/components/chip.md:37 /tokens/root.ring
combobox · partroot.ring—spec/components/combobox.md:39 /tokens/root.ring
command-palette · partcontrol.focus—spec/components/command-palette.md:33 /tokens/control.focus
compact-dashboard · partcontrol.focus—spec/components/compact-dashboard.md:32 /tokens/control.focus
data-table · partrow.ring—spec/components/data-table.md:43 /tokens/row.ring
date-picker · partroot.ring—spec/components/date-picker.md:35 /tokens/root.ring
description-list · partcontrol.focus—spec/components/description-list.md:29 /tokens/control.focus
diagnostics · partrow.ring—spec/components/diagnostics.md:56 /tokens/row.ring
dialog · partclose.ring—spec/components/dialog.md:40 /tokens/close.ring
diff-view · partrow.ring—spec/components/diff-view.md:58 /tokens/row.ring
disclosure · partcontrol.focus—spec/components/disclosure.md:31 /tokens/control.focus
drawer · partclose.ring—spec/components/drawer.md:40 /tokens/close.ring
editor-search · partcontrol.focus—spec/components/editor-search.md:31 /tokens/control.focus
empty-state · partaction.ring—spec/components/empty-state.md:31 /tokens/action.ring
error-state · partcontrol.focus—spec/components/error-state.md:32 /tokens/control.focus
file-browser · partcontrol.focus—spec/components/file-browser.md:33 /tokens/control.focus
file-input · partbutton.ring—spec/components/file-input.md:36 /tokens/button.ring
filterable-table · partrow.ring—spec/components/filterable-table.md:54 /tokens/row.ring
i3-window-frame · partworkspace.ring—spec/components/i3-window-frame.md:41 /tokens/workspace.ring
icon-button · partroot.ring—spec/components/icon-button.md:29 /tokens/root.ring
kbd · partcontrol.focus—spec/components/kbd.md:28 /tokens/control.focus
link · partroot.ring—spec/components/link.md:30 /tokens/root.ring
list · partrow.ring—spec/components/list.md:40 /tokens/row.ring
menu · partbutton.ring—spec/components/menu.md:42 /tokens/button.ring
multiselect · partcontrol.focus—spec/components/multiselect.md:32 /tokens/control.focus
number-field · partroot.ring—spec/components/number-field.md:34 /tokens/root.ring
pagination · partlink.ring—spec/components/pagination.md:32 /tokens/link.ring
popover · partcontrol.focus—spec/components/popover.md:31 /tokens/control.focus
radio-group · partbox.ring—spec/components/radio-group.md:34 /tokens/box.ring
range · partcontrol.focus—spec/components/range.md:30 /tokens/control.focus
repeater · partcontrol.focus—spec/components/repeater.md:31 /tokens/control.focus
search-field · partroot.ring—spec/components/search-field.md:35 /tokens/root.ring
segmented-control · partcontrol.focus—spec/components/segmented-control.md:31 /tokens/control.focus
select · partroot.ring—spec/components/select.md:37 /tokens/root.ring
settings-panel · partcontrol.ring—spec/components/settings-panel.md:42 /tokens/control.ring
sidebar-nav · partlink.ring—spec/components/sidebar-nav.md:40 /tokens/link.ring
skeleton · partcontrol.focus—spec/components/skeleton.md:30 /tokens/control.focus
skip-link · partroot.ring—spec/components/skip-link.md:24 /tokens/root.ring
switch · parttrack.ring—spec/components/switch.md:35 /tokens/track.ring
table · partsort.ring—spec/components/table.md:43 /tokens/sort.ring
tabs · parttab.ring—spec/components/tabs.md:40 /tokens/tab.ring
text-field · partroot.ring—spec/components/text-field.md:46 /tokens/root.ring
textarea · partroot.ring—spec/components/textarea.md:37 /tokens/root.ring
time-picker · partroot.ring—spec/components/time-picker.md:31 /tokens/root.ring
timeline · partcontrol.focus—spec/components/timeline.md:29 /tokens/control.focus
toast · partclose.ring—spec/components/toast.md:53 /tokens/close.ring
toolbar · partbutton.ring—spec/components/toolbar.md:34 /tokens/button.ring
tooltip · parttrigger.ring—spec/components/tooltip.md:35 /tokens/trigger.ring
tree · partcontrol.focus—spec/components/tree.md:34 /tokens/control.focus
wizard · partstep.ring—spec/components/wizard.md:32 /tokens/step.ring
alert · stateoutlinefocus-visible · color.status.info.tintspec/components/alert.md:55 /stateTokens/focus-visible/outline
breadcrumbs · stateoutlinefocus-visible · color.surface.defaultspec/components/breadcrumbs.md:41 /stateTokens/focus-visible/outline
checkbox · stateoutlinefocus-visible · color.surface.inputspec/components/checkbox.md:53 /stateTokens/focus-visible/outline
chip · stateoutlinefocus-visible · color.surface.defaultspec/components/chip.md:50 /stateTokens/focus-visible/outline
combobox · stateoutlinefocus-visible · color.surface.inputspec/components/combobox.md:67 /stateTokens/focus-visible/outline
data-table · stateoutlinefocus-visible · color.surface.defaultspec/components/data-table.md:58 /stateTokens/focus-visible/outline
date-picker · stateoutlinefocus-visible · color.surface.inputspec/components/date-picker.md:68 /stateTokens/focus-visible/outline
diagnostics · stateoutlinefocus-visible · color.surface.defaultspec/components/diagnostics.md:67 /stateTokens/focus-visible/outline
dialog · stateoutlinefocus-visible · color.surface.overlayspec/components/dialog.md:59 /stateTokens/focus-visible/outline
diff-view · stateoutlinefocus-visible · color.code.bgspec/components/diff-view.md:66 /stateTokens/focus-visible/outline
file-input · stateoutlinefocus-visible · color.surface.canvasspec/components/file-input.md:59 /stateTokens/focus-visible/outline
filterable-table · stateoutlinefocus-visible · color.surface.defaultspec/components/filterable-table.md:76 /stateTokens/focus-visible/outline
icon-button · stateoutlinefocus-visible · color.action.secondary.bgspec/components/icon-button.md:41 /stateTokens/focus-visible/outline
link · stateoutlinefocus-visible · color.surface.canvasspec/components/link.md:38 /stateTokens/focus-visible/outline
list · stateoutlinefocus-visible · color.surface.defaultspec/components/list.md:52 /stateTokens/focus-visible/outline
menu · stateoutlinefocus-visible · color.surface.defaultspec/components/menu.md:59 /stateTokens/focus-visible/outline
number-field · stateoutlinefocus-visible · color.surface.inputspec/components/number-field.md:55 /stateTokens/focus-visible/outline
pagination · stateoutlinefocus-visible · color.surface.defaultspec/components/pagination.md:43 /stateTokens/focus-visible/outline
radio-group · stateoutlinefocus-visible · color.surface.inputspec/components/radio-group.md:51 /stateTokens/focus-visible/outline
search-field · stateoutlinefocus-visible · color.surface.inputspec/components/search-field.md:54 /stateTokens/focus-visible/outline
select · stateoutlinefocus-visible · color.surface.inputspec/components/select.md:57 /stateTokens/focus-visible/outline
settings-panel · stateoutlinefocus-visible · color.surface.inputspec/components/settings-panel.md:55 /stateTokens/focus-visible/outline
sidebar-nav · stateoutlinefocus-visible · color.surface.defaultspec/components/sidebar-nav.md:54 /stateTokens/focus-visible/outline
skip-link · stateoutlinefocus-visible · color.surface.raisedspec/components/skip-link.md:27 /stateTokens/focus-visible/outline
switch · stateoutlinefocus-visible · color.surface.inputspec/components/switch.md:50 /stateTokens/focus-visible/outline
tabs · stateoutlinefocus-visible · color.surface.defaultspec/components/tabs.md:46 /stateTokens/focus-visible/outline
tabs · stateoutlineselected+focus-visible · color.surface.defaultspec/components/tabs.md:48 /stateTokens/selected+focus-visible/outline
text-field · stateoutlinefocus-visible · color.surface.inputspec/components/text-field.md:70 /stateTokens/focus-visible/outline
textarea · stateoutlinefocus-visible · color.surface.inputspec/components/textarea.md:59 /stateTokens/focus-visible/outline
time-picker · stateoutlinefocus-visible · color.surface.inputspec/components/time-picker.md:54 /stateTokens/focus-visible/outline
toast · stateoutlinefocus-visible · color.surface.canvasspec/components/toast.md:59 /stateTokens/focus-visible/outline
toolbar · stateoutlinefocus-visible · color.surface.chromespec/components/toolbar.md:44 /stateTokens/focus-visible/outline
tooltip · stateoutlinefocus-visible · color.surface.canvasspec/components/tooltip.md:40 /stateTokens/focus-visible/outline
wizard · stateoutlinefocus-visible · color.surface.canvasspec/components/wizard.md:57 /stateTokens/focus-visible/outline

Relevant contrast declarations

extended · proposed

Resolved value
#e53935
Status
observed
Consumption
blocked — Proposed profile: preview only, not downstream delivery.
Decisions
None pending.
Source
tokens/semantic.tokens.json:291 /color/interaction/focus/ring
Alias chain
color.primitive.red.800
Used by aliases
focus.ring

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
alert · contrast—focus-visible · color.status.info.tintspec/components/alert.md:71 /contrast/14
button · contrast—hover · color.action.secondary.hover-bgspec/components/button.md:72 /contrast/5
diff-view · contrast—focus-visible · color.diff.added.bgspec/components/diff-view.md:86 /contrast/16
diff-view · contrast—focus-visible · color.diff.modified.bgspec/components/diff-view.md:88 /contrast/18
diff-view · contrast—focus-visible · color.diff.removed.bgspec/components/diff-view.md:87 /contrast/17
drawer · contrast—— · color.surface.overlayspec/components/drawer.md:51 /contrast/3
i3-window-frame · contrast—— · color.surface.chromespec/components/i3-window-frame.md:77 /contrast/6
link · contrast—hover · color.interaction.hover.bg-strongspec/components/link.md:46 /contrast/4
skip-link · contrast—focus-visible · color.surface.raisedspec/components/skip-link.md:29 /contrast/0
table · contrast—— · color.surface.defaultspec/components/table.md:68 /contrast/3
Shared rule · contrast—— · color.surface.canvasspec/contrast.json:41 /pairs/37
Shared rule · contrast—— · color.surface.defaultspec/contrast.json:42 /pairs/38
alert · partclose.ring—spec/components/alert.md:51 /tokens/close.ring
avatar · partcontrol.focus—spec/components/avatar.md:30 /tokens/control.focus
breadcrumbs · partlink.ring—spec/components/breadcrumbs.md:33 /tokens/link.ring
button-group · partcontrol.focus—spec/components/button-group.md:30 /tokens/control.focus
button · partsecondary.ring · secondary—spec/components/button.md:41 /tokens/secondary.ring
chart · partcontrol.focus—spec/components/chart.md:30 /tokens/control.focus
checkbox · partbox.ring—spec/components/checkbox.md:36 /tokens/box.ring
chip · partroot.ring—spec/components/chip.md:37 /tokens/root.ring
combobox · partroot.ring—spec/components/combobox.md:39 /tokens/root.ring
command-palette · partcontrol.focus—spec/components/command-palette.md:33 /tokens/control.focus
compact-dashboard · partcontrol.focus—spec/components/compact-dashboard.md:32 /tokens/control.focus
data-table · partrow.ring—spec/components/data-table.md:43 /tokens/row.ring
date-picker · partroot.ring—spec/components/date-picker.md:35 /tokens/root.ring
description-list · partcontrol.focus—spec/components/description-list.md:29 /tokens/control.focus
diagnostics · partrow.ring—spec/components/diagnostics.md:56 /tokens/row.ring
dialog · partclose.ring—spec/components/dialog.md:40 /tokens/close.ring
diff-view · partrow.ring—spec/components/diff-view.md:58 /tokens/row.ring
disclosure · partcontrol.focus—spec/components/disclosure.md:31 /tokens/control.focus
drawer · partclose.ring—spec/components/drawer.md:40 /tokens/close.ring
editor-search · partcontrol.focus—spec/components/editor-search.md:31 /tokens/control.focus
empty-state · partaction.ring—spec/components/empty-state.md:31 /tokens/action.ring
error-state · partcontrol.focus—spec/components/error-state.md:32 /tokens/control.focus
file-browser · partcontrol.focus—spec/components/file-browser.md:33 /tokens/control.focus
file-input · partbutton.ring—spec/components/file-input.md:36 /tokens/button.ring
filterable-table · partrow.ring—spec/components/filterable-table.md:54 /tokens/row.ring
i3-window-frame · partworkspace.ring—spec/components/i3-window-frame.md:41 /tokens/workspace.ring
icon-button · partroot.ring—spec/components/icon-button.md:29 /tokens/root.ring
kbd · partcontrol.focus—spec/components/kbd.md:28 /tokens/control.focus
link · partroot.ring—spec/components/link.md:30 /tokens/root.ring
list · partrow.ring—spec/components/list.md:40 /tokens/row.ring
menu · partbutton.ring—spec/components/menu.md:42 /tokens/button.ring
multiselect · partcontrol.focus—spec/components/multiselect.md:32 /tokens/control.focus
number-field · partroot.ring—spec/components/number-field.md:34 /tokens/root.ring
pagination · partlink.ring—spec/components/pagination.md:32 /tokens/link.ring
popover · partcontrol.focus—spec/components/popover.md:31 /tokens/control.focus
radio-group · partbox.ring—spec/components/radio-group.md:34 /tokens/box.ring
range · partcontrol.focus—spec/components/range.md:30 /tokens/control.focus
repeater · partcontrol.focus—spec/components/repeater.md:31 /tokens/control.focus
search-field · partroot.ring—spec/components/search-field.md:35 /tokens/root.ring
segmented-control · partcontrol.focus—spec/components/segmented-control.md:31 /tokens/control.focus
select · partroot.ring—spec/components/select.md:37 /tokens/root.ring
settings-panel · partcontrol.ring—spec/components/settings-panel.md:42 /tokens/control.ring
sidebar-nav · partlink.ring—spec/components/sidebar-nav.md:40 /tokens/link.ring
skeleton · partcontrol.focus—spec/components/skeleton.md:30 /tokens/control.focus
skip-link · partroot.ring—spec/components/skip-link.md:24 /tokens/root.ring
switch · parttrack.ring—spec/components/switch.md:35 /tokens/track.ring
table · partsort.ring—spec/components/table.md:43 /tokens/sort.ring
tabs · parttab.ring—spec/components/tabs.md:40 /tokens/tab.ring
text-field · partroot.ring—spec/components/text-field.md:46 /tokens/root.ring
textarea · partroot.ring—spec/components/textarea.md:37 /tokens/root.ring
time-picker · partroot.ring—spec/components/time-picker.md:31 /tokens/root.ring
timeline · partcontrol.focus—spec/components/timeline.md:29 /tokens/control.focus
toast · partclose.ring—spec/components/toast.md:53 /tokens/close.ring
toolbar · partbutton.ring—spec/components/toolbar.md:34 /tokens/button.ring
tooltip · parttrigger.ring—spec/components/tooltip.md:35 /tokens/trigger.ring
tree · partcontrol.focus—spec/components/tree.md:34 /tokens/control.focus
wizard · partstep.ring—spec/components/wizard.md:32 /tokens/step.ring
alert · stateoutlinefocus-visible · color.status.info.tintspec/components/alert.md:55 /stateTokens/focus-visible/outline
breadcrumbs · stateoutlinefocus-visible · color.surface.defaultspec/components/breadcrumbs.md:41 /stateTokens/focus-visible/outline
checkbox · stateoutlinefocus-visible · color.surface.inputspec/components/checkbox.md:53 /stateTokens/focus-visible/outline
chip · stateoutlinefocus-visible · color.surface.defaultspec/components/chip.md:50 /stateTokens/focus-visible/outline
combobox · stateoutlinefocus-visible · color.surface.inputspec/components/combobox.md:67 /stateTokens/focus-visible/outline
data-table · stateoutlinefocus-visible · color.surface.defaultspec/components/data-table.md:58 /stateTokens/focus-visible/outline
date-picker · stateoutlinefocus-visible · color.surface.inputspec/components/date-picker.md:68 /stateTokens/focus-visible/outline
diagnostics · stateoutlinefocus-visible · color.surface.defaultspec/components/diagnostics.md:67 /stateTokens/focus-visible/outline
dialog · stateoutlinefocus-visible · color.surface.overlayspec/components/dialog.md:59 /stateTokens/focus-visible/outline
diff-view · stateoutlinefocus-visible · color.code.bgspec/components/diff-view.md:66 /stateTokens/focus-visible/outline
file-input · stateoutlinefocus-visible · color.surface.canvasspec/components/file-input.md:59 /stateTokens/focus-visible/outline
filterable-table · stateoutlinefocus-visible · color.surface.defaultspec/components/filterable-table.md:76 /stateTokens/focus-visible/outline
icon-button · stateoutlinefocus-visible · color.action.secondary.bgspec/components/icon-button.md:41 /stateTokens/focus-visible/outline
link · stateoutlinefocus-visible · color.surface.canvasspec/components/link.md:38 /stateTokens/focus-visible/outline
list · stateoutlinefocus-visible · color.surface.defaultspec/components/list.md:52 /stateTokens/focus-visible/outline
menu · stateoutlinefocus-visible · color.surface.defaultspec/components/menu.md:59 /stateTokens/focus-visible/outline
number-field · stateoutlinefocus-visible · color.surface.inputspec/components/number-field.md:55 /stateTokens/focus-visible/outline
pagination · stateoutlinefocus-visible · color.surface.defaultspec/components/pagination.md:43 /stateTokens/focus-visible/outline
radio-group · stateoutlinefocus-visible · color.surface.inputspec/components/radio-group.md:51 /stateTokens/focus-visible/outline
search-field · stateoutlinefocus-visible · color.surface.inputspec/components/search-field.md:54 /stateTokens/focus-visible/outline
select · stateoutlinefocus-visible · color.surface.inputspec/components/select.md:57 /stateTokens/focus-visible/outline
settings-panel · stateoutlinefocus-visible · color.surface.inputspec/components/settings-panel.md:55 /stateTokens/focus-visible/outline
sidebar-nav · stateoutlinefocus-visible · color.surface.defaultspec/components/sidebar-nav.md:54 /stateTokens/focus-visible/outline
skip-link · stateoutlinefocus-visible · color.surface.raisedspec/components/skip-link.md:27 /stateTokens/focus-visible/outline
switch · stateoutlinefocus-visible · color.surface.inputspec/components/switch.md:50 /stateTokens/focus-visible/outline
tabs · stateoutlinefocus-visible · color.surface.defaultspec/components/tabs.md:46 /stateTokens/focus-visible/outline
tabs · stateoutlineselected+focus-visible · color.surface.defaultspec/components/tabs.md:48 /stateTokens/selected+focus-visible/outline
text-field · stateoutlinefocus-visible · color.surface.inputspec/components/text-field.md:70 /stateTokens/focus-visible/outline
textarea · stateoutlinefocus-visible · color.surface.inputspec/components/textarea.md:59 /stateTokens/focus-visible/outline
time-picker · stateoutlinefocus-visible · color.surface.inputspec/components/time-picker.md:54 /stateTokens/focus-visible/outline
toast · stateoutlinefocus-visible · color.surface.canvasspec/components/toast.md:59 /stateTokens/focus-visible/outline
toolbar · stateoutlinefocus-visible · color.surface.chromespec/components/toolbar.md:44 /stateTokens/focus-visible/outline
tooltip · stateoutlinefocus-visible · color.surface.canvasspec/components/tooltip.md:40 /stateTokens/focus-visible/outline
wizard · stateoutlinefocus-visible · color.surface.canvasspec/components/wizard.md:57 /stateTokens/focus-visible/outline

Relevant contrast declarations

j3w1 / command

  • SPEC Overview
  • SPEC Foundations
  • SPEC Components
  • SPEC Patterns
  • SPEC Tokens
  • SPEC Tools
  • SPEC Implement
  • SPEC For agents
  • SPEC Ports
  • SPEC Releases
  • DEMO Vue application demo
  • SPEC Complete UI theme specification