j3w1 / color.interaction.hover.bgVue · HTML · React · Astro

J3W1 / DESIGN SYSTEM

color.interaction.hover.bg

Hover on rows, ghost buttons, list items.

Source revision 1faefcf014c8bf01a6b27308ea796da968773a81

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

Report an issue with this token

color.interaction.hover.bg
--color-interaction-hover-bg

default · approved

Resolved value
#1c0a09
Status
observed
Consumption
use — Use within the role's documented scope and restrictions.
Decisions
None pending.
Source
tokens/semantic.tokens.json:337 /color/interaction/hover/bg
Alias chain
color.primitive.ink.40
Used by aliases
No declared aliases depend on this role.

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
card · contrast—hover · color.interaction.hover.bgspec/components/card.md:52 /contrast/2
card · contrast—hover · color.interaction.hover.bgspec/components/card.md:53 /contrast/3
diagnostics · contrast—hover · color.interaction.hover.bgspec/components/diagnostics.md:92 /contrast/19
diagnostics · contrast—hover · color.interaction.hover.bgspec/components/diagnostics.md:93 /contrast/20
list · contrast—hover · color.interaction.hover.bgspec/components/list.md:58 /contrast/1
switch · contrast—hover · color.interaction.hover.bgspec/components/switch.md:55 /contrast/1
breadcrumbs · partellipsis.bg-hover—spec/components/breadcrumbs.md:37 /tokens/ellipsis.bg-hover
card · partroot.bg-hover—spec/components/card.md:34 /tokens/root.bg-hover
checkbox · partbox.bg-hover—spec/components/checkbox.md:35 /tokens/box.bg-hover
chip · partroot.bg-hover—spec/components/chip.md:35 /tokens/root.bg-hover
combobox · partroot.bg-hover—spec/components/combobox.md:37 /tokens/root.bg-hover
data-table · partrow.bg-hover—spec/components/data-table.md:42 /tokens/row.bg-hover
date-picker · partroot.bg-hover—spec/components/date-picker.md:33 /tokens/root.bg-hover
diagnostics · partrow.bg-hover—spec/components/diagnostics.md:55 /tokens/row.bg-hover
diff-view · partrow.bg-hover—spec/components/diff-view.md:57 /tokens/row.bg-hover
filterable-table · partrow.bg-hover—spec/components/filterable-table.md:53 /tokens/row.bg-hover
i3-window-frame · partworkspace.bg-hover—spec/components/i3-window-frame.md:40 /tokens/workspace.bg-hover
list · partrow.bg-hover—spec/components/list.md:38 /tokens/row.bg-hover
menu · partbutton.bg-hover—spec/components/menu.md:39 /tokens/button.bg-hover
multiselect · partdependency.role-color-interaction-hover-bg—spec/components/multiselect.md:42 /tokens/dependency.role-color-interaction-hover-bg
number-field · partroot.bg-hover—spec/components/number-field.md:32 /tokens/root.bg-hover
pagination · partlink.bg-hover—spec/components/pagination.md:30 /tokens/link.bg-hover
radio-group · partbox.bg-hover—spec/components/radio-group.md:33 /tokens/box.bg-hover
search-field · partroot.bg-hover—spec/components/search-field.md:33 /tokens/root.bg-hover
segmented-control · partdependency.role-color-interaction-hover-bg—spec/components/segmented-control.md:40 /tokens/dependency.role-color-interaction-hover-bg
select · partroot.bg-hover—spec/components/select.md:35 /tokens/root.bg-hover
settings-panel · partnav.bg-hover—spec/components/settings-panel.md:34 /tokens/nav.bg-hover
sidebar-nav · partlink.bg-hover—spec/components/sidebar-nav.md:38 /tokens/link.bg-hover
switch · parttrack.bg-hover—spec/components/switch.md:34 /tokens/track.bg-hover
table · partrow.bg-hover—spec/components/table.md:46 /tokens/row.bg-hover
tabs · parttab.bg-hover—spec/components/tabs.md:36 /tokens/tab.bg-hover
text-field · partroot.bg-hover—spec/components/text-field.md:44 /tokens/root.bg-hover
textarea · partroot.bg-hover—spec/components/textarea.md:35 /tokens/root.bg-hover
time-picker · partroot.bg-hover—spec/components/time-picker.md:29 /tokens/root.bg-hover
toolbar · partbutton.bg-hover—spec/components/toolbar.md:32 /tokens/button.bg-hover
wizard · partstep.bg-hover—spec/components/wizard.md:31 /tokens/step.bg-hover
card · statebghover · color.interaction.hover.bgspec/components/card.md:45 /stateTokens/hover/bg
checkbox · statebghover · color.interaction.hover.bgspec/components/checkbox.md:52 /stateTokens/hover/bg
chip · statebghover · color.interaction.hover.bgspec/components/chip.md:49 /stateTokens/hover/bg
data-table · statebghover · color.interaction.hover.bgspec/components/data-table.md:57 /stateTokens/hover/bg
date-picker · statebghover · color.interaction.hover.bgspec/components/date-picker.md:62 /stateTokens/hover/bg
diagnostics · statebghover · color.interaction.hover.bgspec/components/diagnostics.md:66 /stateTokens/hover/bg
diff-view · statebghover · color.interaction.hover.bgspec/components/diff-view.md:64 /stateTokens/hover/bg
filterable-table · statebghover · color.interaction.hover.bgspec/components/filterable-table.md:75 /stateTokens/hover/bg
list · statebghover · color.interaction.hover.bgspec/components/list.md:51 /stateTokens/hover/bg
number-field · statebghover · color.interaction.hover.bgspec/components/number-field.md:54 /stateTokens/hover/bg
pagination · statebghover · color.interaction.hover.bgspec/components/pagination.md:42 /stateTokens/hover/bg
radio-group · statebghover · color.interaction.hover.bgspec/components/radio-group.md:50 /stateTokens/hover/bg
search-field · statebghover · color.interaction.hover.bgspec/components/search-field.md:53 /stateTokens/hover/bg
select · statebghover · color.interaction.hover.bgspec/components/select.md:56 /stateTokens/hover/bg
sidebar-nav · statebghover · color.interaction.hover.bgspec/components/sidebar-nav.md:53 /stateTokens/hover/bg
switch · statebghover · color.interaction.hover.bgspec/components/switch.md:49 /stateTokens/hover/bg
table · statebghover · color.interaction.hover.bgspec/components/table.md:57 /stateTokens/hover/bg
tabs · statebghover · color.interaction.hover.bgspec/components/tabs.md:45 /stateTokens/hover/bg
text-field · statebghover · color.interaction.hover.bgspec/components/text-field.md:69 /stateTokens/hover/bg
textarea · statebghover · color.interaction.hover.bgspec/components/textarea.md:58 /stateTokens/hover/bg
time-picker · statebghover · color.interaction.hover.bgspec/components/time-picker.md:48 /stateTokens/hover/bg
toolbar · statebghover · color.interaction.hover.bgspec/components/toolbar.md:43 /stateTokens/hover/bg
wizard · statebghover · color.interaction.hover.bgspec/components/wizard.md:56 /stateTokens/hover/bg

Relevant contrast declarations

heritage-ansi · heritage

Resolved value
#1c0a09
Status
observed
Consumption
historical-only — Historical fidelity only; preserve all documented limitations and deprecations.
Decisions
None pending.
Source
tokens/semantic.tokens.json:337 /color/interaction/hover/bg
Alias chain
color.primitive.ink.40
Used by aliases
No declared aliases depend on this role.

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
card · contrast—hover · color.interaction.hover.bgspec/components/card.md:52 /contrast/2
card · contrast—hover · color.interaction.hover.bgspec/components/card.md:53 /contrast/3
diagnostics · contrast—hover · color.interaction.hover.bgspec/components/diagnostics.md:92 /contrast/19
diagnostics · contrast—hover · color.interaction.hover.bgspec/components/diagnostics.md:93 /contrast/20
list · contrast—hover · color.interaction.hover.bgspec/components/list.md:58 /contrast/1
switch · contrast—hover · color.interaction.hover.bgspec/components/switch.md:55 /contrast/1
breadcrumbs · partellipsis.bg-hover—spec/components/breadcrumbs.md:37 /tokens/ellipsis.bg-hover
card · partroot.bg-hover—spec/components/card.md:34 /tokens/root.bg-hover
checkbox · partbox.bg-hover—spec/components/checkbox.md:35 /tokens/box.bg-hover
chip · partroot.bg-hover—spec/components/chip.md:35 /tokens/root.bg-hover
combobox · partroot.bg-hover—spec/components/combobox.md:37 /tokens/root.bg-hover
data-table · partrow.bg-hover—spec/components/data-table.md:42 /tokens/row.bg-hover
date-picker · partroot.bg-hover—spec/components/date-picker.md:33 /tokens/root.bg-hover
diagnostics · partrow.bg-hover—spec/components/diagnostics.md:55 /tokens/row.bg-hover
diff-view · partrow.bg-hover—spec/components/diff-view.md:57 /tokens/row.bg-hover
filterable-table · partrow.bg-hover—spec/components/filterable-table.md:53 /tokens/row.bg-hover
i3-window-frame · partworkspace.bg-hover—spec/components/i3-window-frame.md:40 /tokens/workspace.bg-hover
list · partrow.bg-hover—spec/components/list.md:38 /tokens/row.bg-hover
menu · partbutton.bg-hover—spec/components/menu.md:39 /tokens/button.bg-hover
multiselect · partdependency.role-color-interaction-hover-bg—spec/components/multiselect.md:42 /tokens/dependency.role-color-interaction-hover-bg
number-field · partroot.bg-hover—spec/components/number-field.md:32 /tokens/root.bg-hover
pagination · partlink.bg-hover—spec/components/pagination.md:30 /tokens/link.bg-hover
radio-group · partbox.bg-hover—spec/components/radio-group.md:33 /tokens/box.bg-hover
search-field · partroot.bg-hover—spec/components/search-field.md:33 /tokens/root.bg-hover
segmented-control · partdependency.role-color-interaction-hover-bg—spec/components/segmented-control.md:40 /tokens/dependency.role-color-interaction-hover-bg
select · partroot.bg-hover—spec/components/select.md:35 /tokens/root.bg-hover
settings-panel · partnav.bg-hover—spec/components/settings-panel.md:34 /tokens/nav.bg-hover
sidebar-nav · partlink.bg-hover—spec/components/sidebar-nav.md:38 /tokens/link.bg-hover
switch · parttrack.bg-hover—spec/components/switch.md:34 /tokens/track.bg-hover
table · partrow.bg-hover—spec/components/table.md:46 /tokens/row.bg-hover
tabs · parttab.bg-hover—spec/components/tabs.md:36 /tokens/tab.bg-hover
text-field · partroot.bg-hover—spec/components/text-field.md:44 /tokens/root.bg-hover
textarea · partroot.bg-hover—spec/components/textarea.md:35 /tokens/root.bg-hover
time-picker · partroot.bg-hover—spec/components/time-picker.md:29 /tokens/root.bg-hover
toolbar · partbutton.bg-hover—spec/components/toolbar.md:32 /tokens/button.bg-hover
wizard · partstep.bg-hover—spec/components/wizard.md:31 /tokens/step.bg-hover
card · statebghover · color.interaction.hover.bgspec/components/card.md:45 /stateTokens/hover/bg
checkbox · statebghover · color.interaction.hover.bgspec/components/checkbox.md:52 /stateTokens/hover/bg
chip · statebghover · color.interaction.hover.bgspec/components/chip.md:49 /stateTokens/hover/bg
data-table · statebghover · color.interaction.hover.bgspec/components/data-table.md:57 /stateTokens/hover/bg
date-picker · statebghover · color.interaction.hover.bgspec/components/date-picker.md:62 /stateTokens/hover/bg
diagnostics · statebghover · color.interaction.hover.bgspec/components/diagnostics.md:66 /stateTokens/hover/bg
diff-view · statebghover · color.interaction.hover.bgspec/components/diff-view.md:64 /stateTokens/hover/bg
filterable-table · statebghover · color.interaction.hover.bgspec/components/filterable-table.md:75 /stateTokens/hover/bg
list · statebghover · color.interaction.hover.bgspec/components/list.md:51 /stateTokens/hover/bg
number-field · statebghover · color.interaction.hover.bgspec/components/number-field.md:54 /stateTokens/hover/bg
pagination · statebghover · color.interaction.hover.bgspec/components/pagination.md:42 /stateTokens/hover/bg
radio-group · statebghover · color.interaction.hover.bgspec/components/radio-group.md:50 /stateTokens/hover/bg
search-field · statebghover · color.interaction.hover.bgspec/components/search-field.md:53 /stateTokens/hover/bg
select · statebghover · color.interaction.hover.bgspec/components/select.md:56 /stateTokens/hover/bg
sidebar-nav · statebghover · color.interaction.hover.bgspec/components/sidebar-nav.md:53 /stateTokens/hover/bg
switch · statebghover · color.interaction.hover.bgspec/components/switch.md:49 /stateTokens/hover/bg
table · statebghover · color.interaction.hover.bgspec/components/table.md:57 /stateTokens/hover/bg
tabs · statebghover · color.interaction.hover.bgspec/components/tabs.md:45 /stateTokens/hover/bg
text-field · statebghover · color.interaction.hover.bgspec/components/text-field.md:69 /stateTokens/hover/bg
textarea · statebghover · color.interaction.hover.bgspec/components/textarea.md:58 /stateTokens/hover/bg
time-picker · statebghover · color.interaction.hover.bgspec/components/time-picker.md:48 /stateTokens/hover/bg
toolbar · statebghover · color.interaction.hover.bgspec/components/toolbar.md:43 /stateTokens/hover/bg
wizard · statebghover · color.interaction.hover.bgspec/components/wizard.md:56 /stateTokens/hover/bg

Relevant contrast declarations

extended · proposed

Resolved value
#1c0a09
Status
observed
Consumption
blocked — Proposed profile: preview only, not downstream delivery.
Decisions
None pending.
Source
tokens/semantic.tokens.json:337 /color/interaction/hover/bg
Alias chain
color.primitive.ink.40
Used by aliases
No declared aliases depend on this role.

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
card · contrast—hover · color.interaction.hover.bgspec/components/card.md:52 /contrast/2
card · contrast—hover · color.interaction.hover.bgspec/components/card.md:53 /contrast/3
diagnostics · contrast—hover · color.interaction.hover.bgspec/components/diagnostics.md:92 /contrast/19
diagnostics · contrast—hover · color.interaction.hover.bgspec/components/diagnostics.md:93 /contrast/20
list · contrast—hover · color.interaction.hover.bgspec/components/list.md:58 /contrast/1
switch · contrast—hover · color.interaction.hover.bgspec/components/switch.md:55 /contrast/1
breadcrumbs · partellipsis.bg-hover—spec/components/breadcrumbs.md:37 /tokens/ellipsis.bg-hover
card · partroot.bg-hover—spec/components/card.md:34 /tokens/root.bg-hover
checkbox · partbox.bg-hover—spec/components/checkbox.md:35 /tokens/box.bg-hover
chip · partroot.bg-hover—spec/components/chip.md:35 /tokens/root.bg-hover
combobox · partroot.bg-hover—spec/components/combobox.md:37 /tokens/root.bg-hover
data-table · partrow.bg-hover—spec/components/data-table.md:42 /tokens/row.bg-hover
date-picker · partroot.bg-hover—spec/components/date-picker.md:33 /tokens/root.bg-hover
diagnostics · partrow.bg-hover—spec/components/diagnostics.md:55 /tokens/row.bg-hover
diff-view · partrow.bg-hover—spec/components/diff-view.md:57 /tokens/row.bg-hover
filterable-table · partrow.bg-hover—spec/components/filterable-table.md:53 /tokens/row.bg-hover
i3-window-frame · partworkspace.bg-hover—spec/components/i3-window-frame.md:40 /tokens/workspace.bg-hover
list · partrow.bg-hover—spec/components/list.md:38 /tokens/row.bg-hover
menu · partbutton.bg-hover—spec/components/menu.md:39 /tokens/button.bg-hover
multiselect · partdependency.role-color-interaction-hover-bg—spec/components/multiselect.md:42 /tokens/dependency.role-color-interaction-hover-bg
number-field · partroot.bg-hover—spec/components/number-field.md:32 /tokens/root.bg-hover
pagination · partlink.bg-hover—spec/components/pagination.md:30 /tokens/link.bg-hover
radio-group · partbox.bg-hover—spec/components/radio-group.md:33 /tokens/box.bg-hover
search-field · partroot.bg-hover—spec/components/search-field.md:33 /tokens/root.bg-hover
segmented-control · partdependency.role-color-interaction-hover-bg—spec/components/segmented-control.md:40 /tokens/dependency.role-color-interaction-hover-bg
select · partroot.bg-hover—spec/components/select.md:35 /tokens/root.bg-hover
settings-panel · partnav.bg-hover—spec/components/settings-panel.md:34 /tokens/nav.bg-hover
sidebar-nav · partlink.bg-hover—spec/components/sidebar-nav.md:38 /tokens/link.bg-hover
switch · parttrack.bg-hover—spec/components/switch.md:34 /tokens/track.bg-hover
table · partrow.bg-hover—spec/components/table.md:46 /tokens/row.bg-hover
tabs · parttab.bg-hover—spec/components/tabs.md:36 /tokens/tab.bg-hover
text-field · partroot.bg-hover—spec/components/text-field.md:44 /tokens/root.bg-hover
textarea · partroot.bg-hover—spec/components/textarea.md:35 /tokens/root.bg-hover
time-picker · partroot.bg-hover—spec/components/time-picker.md:29 /tokens/root.bg-hover
toolbar · partbutton.bg-hover—spec/components/toolbar.md:32 /tokens/button.bg-hover
wizard · partstep.bg-hover—spec/components/wizard.md:31 /tokens/step.bg-hover
card · statebghover · color.interaction.hover.bgspec/components/card.md:45 /stateTokens/hover/bg
checkbox · statebghover · color.interaction.hover.bgspec/components/checkbox.md:52 /stateTokens/hover/bg
chip · statebghover · color.interaction.hover.bgspec/components/chip.md:49 /stateTokens/hover/bg
data-table · statebghover · color.interaction.hover.bgspec/components/data-table.md:57 /stateTokens/hover/bg
date-picker · statebghover · color.interaction.hover.bgspec/components/date-picker.md:62 /stateTokens/hover/bg
diagnostics · statebghover · color.interaction.hover.bgspec/components/diagnostics.md:66 /stateTokens/hover/bg
diff-view · statebghover · color.interaction.hover.bgspec/components/diff-view.md:64 /stateTokens/hover/bg
filterable-table · statebghover · color.interaction.hover.bgspec/components/filterable-table.md:75 /stateTokens/hover/bg
list · statebghover · color.interaction.hover.bgspec/components/list.md:51 /stateTokens/hover/bg
number-field · statebghover · color.interaction.hover.bgspec/components/number-field.md:54 /stateTokens/hover/bg
pagination · statebghover · color.interaction.hover.bgspec/components/pagination.md:42 /stateTokens/hover/bg
radio-group · statebghover · color.interaction.hover.bgspec/components/radio-group.md:50 /stateTokens/hover/bg
search-field · statebghover · color.interaction.hover.bgspec/components/search-field.md:53 /stateTokens/hover/bg
select · statebghover · color.interaction.hover.bgspec/components/select.md:56 /stateTokens/hover/bg
sidebar-nav · statebghover · color.interaction.hover.bgspec/components/sidebar-nav.md:53 /stateTokens/hover/bg
switch · statebghover · color.interaction.hover.bgspec/components/switch.md:49 /stateTokens/hover/bg
table · statebghover · color.interaction.hover.bgspec/components/table.md:57 /stateTokens/hover/bg
tabs · statebghover · color.interaction.hover.bgspec/components/tabs.md:45 /stateTokens/hover/bg
text-field · statebghover · color.interaction.hover.bgspec/components/text-field.md:69 /stateTokens/hover/bg
textarea · statebghover · color.interaction.hover.bgspec/components/textarea.md:58 /stateTokens/hover/bg
time-picker · statebghover · color.interaction.hover.bgspec/components/time-picker.md:48 /stateTokens/hover/bg
toolbar · statebghover · color.interaction.hover.bgspec/components/toolbar.md:43 /stateTokens/hover/bg
wizard · statebghover · color.interaction.hover.bgspec/components/wizard.md:56 /stateTokens/hover/bg

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