j3w1 / color.interaction.selection.textVue · HTML · React · Astro

J3W1 / DESIGN SYSTEM

color.interaction.selection.text

Text on the selection.

Source revision 1faefcf014c8bf01a6b27308ea796da968773a81

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

Report an issue with this token

color.interaction.selection.text
--color-interaction-selection-text

default · approved

Resolved value
#f4eeee
Status
observed
Consumption
use — Use within the role's documented scope and restrictions.
Decisions
None pending.
Source
tokens/semantic.tokens.json:313 /color/interaction/selection/text
Alias chain
color.primitive.paper.90
Used by aliases
No declared aliases depend on this role.

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
date-picker · contrast—— · color.interaction.selection.bgspec/components/date-picker.md:111 /contrast/6
select · contrast—— · color.interaction.selection.bgspec/components/select.md:65 /contrast/3
Shared rule · contrast—— · color.interaction.selection.bgspec/contrast.json:21 /pairs/17
card · partselected.text—spec/components/card.md:41 /tokens/selected.text
chip · partselected.text—spec/components/chip.md:42 /tokens/selected.text
combobox · partoption.text-selected—spec/components/combobox.md:57 /tokens/option.text-selected
command-palette · partdependency.role-color-interaction-selection-text—spec/components/command-palette.md:39 /tokens/dependency.role-color-interaction-selection-text
data-table · partselected.text—spec/components/data-table.md:45 /tokens/selected.text
date-picker · partcalendar.selected-text—spec/components/date-picker.md:54 /tokens/calendar.selected-text
diagnostics · partrow.text-selected—spec/components/diagnostics.md:58 /tokens/row.text-selected
diff-view · partrow.text-selected—spec/components/diff-view.md:60 /tokens/row.text-selected
filterable-table · partrow.selected-text—spec/components/filterable-table.md:56 /tokens/row.selected-text
i3-window-frame · partworkspace.selected-text—spec/components/i3-window-frame.md:39 /tokens/workspace.selected-text
icon-button · partroot.text-toggled—spec/components/icon-button.md:31 /tokens/root.text-toggled
list · partcheck.glyph—spec/components/list.md:47 /tokens/check.glyph
list · partselected.text—spec/components/list.md:43 /tokens/selected.text
menu · partactive.text—spec/components/menu.md:50 /tokens/active.text
segmented-control · partdependency.role-color-interaction-selection-text—spec/components/segmented-control.md:42 /tokens/dependency.role-color-interaction-selection-text
select · partoption.text-selected—spec/components/select.md:48 /tokens/option.text-selected
sidebar-nav · partselected.text—spec/components/sidebar-nav.md:45 /tokens/selected.text
table · partselected.text—spec/components/table.md:48 /tokens/selected.text
tree · partdependency.role-color-interaction-selection-text—spec/components/tree.md:39 /tokens/dependency.role-color-interaction-selection-text
card · statefgselected · color.interaction.selection.bgspec/components/card.md:47 /stateTokens/selected/fg
card · statefgselected+focus-visible · color.interaction.selection.bgspec/components/card.md:48 /stateTokens/selected+focus-visible/fg
chip · statefgselected · color.interaction.selection.bgspec/components/chip.md:51 /stateTokens/selected/fg
chip · statefgselected+focus-visible · color.interaction.selection.bgspec/components/chip.md:52 /stateTokens/selected+focus-visible/fg
combobox · statefgselected · color.interaction.selection.bgspec/components/combobox.md:69 /stateTokens/selected/fg
data-table · statefgselected · color.interaction.selection.bgspec/components/data-table.md:59 /stateTokens/selected/fg
data-table · statefgselected+focus-visible · color.interaction.selection.bgspec/components/data-table.md:60 /stateTokens/selected+focus-visible/fg
diagnostics · statefgselected · color.interaction.selection.bgspec/components/diagnostics.md:68 /stateTokens/selected/fg
diagnostics · statefgselected+focus-visible · color.interaction.selection.bgspec/components/diagnostics.md:69 /stateTokens/selected+focus-visible/fg
diff-view · statefgselected · color.interaction.selection.bgspec/components/diff-view.md:65 /stateTokens/selected/fg
filterable-table · statefgselected · color.interaction.selection.bgspec/components/filterable-table.md:77 /stateTokens/selected/fg
i3-window-frame · statefgselected · color.interaction.selection.bgspec/components/i3-window-frame.md:67 /stateTokens/selected/fg
icon-button · statefgtoggled · color.interaction.selection.bgspec/components/icon-button.md:43 /stateTokens/toggled/fg
icon-button · statefgtoggled+focus-visible · color.interaction.selection.bgspec/components/icon-button.md:44 /stateTokens/toggled+focus-visible/fg
list · statefgselected · color.interaction.selection.bgspec/components/list.md:53 /stateTokens/selected/fg
list · statefgselected+focus-visible · color.interaction.selection.bgspec/components/list.md:54 /stateTokens/selected+focus-visible/fg
menu · statefgselected · color.interaction.selection.bgspec/components/menu.md:63 /stateTokens/selected/fg
sidebar-nav · statefgselected · color.interaction.selection.bgspec/components/sidebar-nav.md:56 /stateTokens/selected/fg
table · statefgselected · color.interaction.selection.bgspec/components/table.md:58 /stateTokens/selected/fg
table · statefgselected+focus-visible · color.interaction.selection.bgspec/components/table.md:59 /stateTokens/selected+focus-visible/fg

Relevant contrast declarations

heritage-ansi · heritage

Resolved value
#f4eeee
Status
observed
Consumption
historical-only — Historical fidelity only; preserve all documented limitations and deprecations.
Decisions
None pending.
Source
tokens/semantic.tokens.json:313 /color/interaction/selection/text
Alias chain
color.primitive.paper.90
Used by aliases
No declared aliases depend on this role.

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
date-picker · contrast—— · color.interaction.selection.bgspec/components/date-picker.md:111 /contrast/6
select · contrast—— · color.interaction.selection.bgspec/components/select.md:65 /contrast/3
Shared rule · contrast—— · color.interaction.selection.bgspec/contrast.json:21 /pairs/17
card · partselected.text—spec/components/card.md:41 /tokens/selected.text
chip · partselected.text—spec/components/chip.md:42 /tokens/selected.text
combobox · partoption.text-selected—spec/components/combobox.md:57 /tokens/option.text-selected
command-palette · partdependency.role-color-interaction-selection-text—spec/components/command-palette.md:39 /tokens/dependency.role-color-interaction-selection-text
data-table · partselected.text—spec/components/data-table.md:45 /tokens/selected.text
date-picker · partcalendar.selected-text—spec/components/date-picker.md:54 /tokens/calendar.selected-text
diagnostics · partrow.text-selected—spec/components/diagnostics.md:58 /tokens/row.text-selected
diff-view · partrow.text-selected—spec/components/diff-view.md:60 /tokens/row.text-selected
filterable-table · partrow.selected-text—spec/components/filterable-table.md:56 /tokens/row.selected-text
i3-window-frame · partworkspace.selected-text—spec/components/i3-window-frame.md:39 /tokens/workspace.selected-text
icon-button · partroot.text-toggled—spec/components/icon-button.md:31 /tokens/root.text-toggled
list · partcheck.glyph—spec/components/list.md:47 /tokens/check.glyph
list · partselected.text—spec/components/list.md:43 /tokens/selected.text
menu · partactive.text—spec/components/menu.md:50 /tokens/active.text
segmented-control · partdependency.role-color-interaction-selection-text—spec/components/segmented-control.md:42 /tokens/dependency.role-color-interaction-selection-text
select · partoption.text-selected—spec/components/select.md:48 /tokens/option.text-selected
sidebar-nav · partselected.text—spec/components/sidebar-nav.md:45 /tokens/selected.text
table · partselected.text—spec/components/table.md:48 /tokens/selected.text
tree · partdependency.role-color-interaction-selection-text—spec/components/tree.md:39 /tokens/dependency.role-color-interaction-selection-text
card · statefgselected · color.interaction.selection.bgspec/components/card.md:47 /stateTokens/selected/fg
card · statefgselected+focus-visible · color.interaction.selection.bgspec/components/card.md:48 /stateTokens/selected+focus-visible/fg
chip · statefgselected · color.interaction.selection.bgspec/components/chip.md:51 /stateTokens/selected/fg
chip · statefgselected+focus-visible · color.interaction.selection.bgspec/components/chip.md:52 /stateTokens/selected+focus-visible/fg
combobox · statefgselected · color.interaction.selection.bgspec/components/combobox.md:69 /stateTokens/selected/fg
data-table · statefgselected · color.interaction.selection.bgspec/components/data-table.md:59 /stateTokens/selected/fg
data-table · statefgselected+focus-visible · color.interaction.selection.bgspec/components/data-table.md:60 /stateTokens/selected+focus-visible/fg
diagnostics · statefgselected · color.interaction.selection.bgspec/components/diagnostics.md:68 /stateTokens/selected/fg
diagnostics · statefgselected+focus-visible · color.interaction.selection.bgspec/components/diagnostics.md:69 /stateTokens/selected+focus-visible/fg
diff-view · statefgselected · color.interaction.selection.bgspec/components/diff-view.md:65 /stateTokens/selected/fg
filterable-table · statefgselected · color.interaction.selection.bgspec/components/filterable-table.md:77 /stateTokens/selected/fg
i3-window-frame · statefgselected · color.interaction.selection.bgspec/components/i3-window-frame.md:67 /stateTokens/selected/fg
icon-button · statefgtoggled · color.interaction.selection.bgspec/components/icon-button.md:43 /stateTokens/toggled/fg
icon-button · statefgtoggled+focus-visible · color.interaction.selection.bgspec/components/icon-button.md:44 /stateTokens/toggled+focus-visible/fg
list · statefgselected · color.interaction.selection.bgspec/components/list.md:53 /stateTokens/selected/fg
list · statefgselected+focus-visible · color.interaction.selection.bgspec/components/list.md:54 /stateTokens/selected+focus-visible/fg
menu · statefgselected · color.interaction.selection.bgspec/components/menu.md:63 /stateTokens/selected/fg
sidebar-nav · statefgselected · color.interaction.selection.bgspec/components/sidebar-nav.md:56 /stateTokens/selected/fg
table · statefgselected · color.interaction.selection.bgspec/components/table.md:58 /stateTokens/selected/fg
table · statefgselected+focus-visible · color.interaction.selection.bgspec/components/table.md:59 /stateTokens/selected+focus-visible/fg

Relevant contrast declarations

extended · proposed

Resolved value
#f4eeee
Status
observed
Consumption
blocked — Proposed profile: preview only, not downstream delivery.
Decisions
None pending.
Source
tokens/semantic.tokens.json:313 /color/interaction/selection/text
Alias chain
color.primitive.paper.90
Used by aliases
No declared aliases depend on this role.

Provenance and restrictions

null

Declared component and port usage

Consumer / kindPart / variantState / surfaceSource declaration
date-picker · contrast—— · color.interaction.selection.bgspec/components/date-picker.md:111 /contrast/6
select · contrast—— · color.interaction.selection.bgspec/components/select.md:65 /contrast/3
Shared rule · contrast—— · color.interaction.selection.bgspec/contrast.json:21 /pairs/17
card · partselected.text—spec/components/card.md:41 /tokens/selected.text
chip · partselected.text—spec/components/chip.md:42 /tokens/selected.text
combobox · partoption.text-selected—spec/components/combobox.md:57 /tokens/option.text-selected
command-palette · partdependency.role-color-interaction-selection-text—spec/components/command-palette.md:39 /tokens/dependency.role-color-interaction-selection-text
data-table · partselected.text—spec/components/data-table.md:45 /tokens/selected.text
date-picker · partcalendar.selected-text—spec/components/date-picker.md:54 /tokens/calendar.selected-text
diagnostics · partrow.text-selected—spec/components/diagnostics.md:58 /tokens/row.text-selected
diff-view · partrow.text-selected—spec/components/diff-view.md:60 /tokens/row.text-selected
filterable-table · partrow.selected-text—spec/components/filterable-table.md:56 /tokens/row.selected-text
i3-window-frame · partworkspace.selected-text—spec/components/i3-window-frame.md:39 /tokens/workspace.selected-text
icon-button · partroot.text-toggled—spec/components/icon-button.md:31 /tokens/root.text-toggled
list · partcheck.glyph—spec/components/list.md:47 /tokens/check.glyph
list · partselected.text—spec/components/list.md:43 /tokens/selected.text
menu · partactive.text—spec/components/menu.md:50 /tokens/active.text
segmented-control · partdependency.role-color-interaction-selection-text—spec/components/segmented-control.md:42 /tokens/dependency.role-color-interaction-selection-text
select · partoption.text-selected—spec/components/select.md:48 /tokens/option.text-selected
sidebar-nav · partselected.text—spec/components/sidebar-nav.md:45 /tokens/selected.text
table · partselected.text—spec/components/table.md:48 /tokens/selected.text
tree · partdependency.role-color-interaction-selection-text—spec/components/tree.md:39 /tokens/dependency.role-color-interaction-selection-text
card · statefgselected · color.interaction.selection.bgspec/components/card.md:47 /stateTokens/selected/fg
card · statefgselected+focus-visible · color.interaction.selection.bgspec/components/card.md:48 /stateTokens/selected+focus-visible/fg
chip · statefgselected · color.interaction.selection.bgspec/components/chip.md:51 /stateTokens/selected/fg
chip · statefgselected+focus-visible · color.interaction.selection.bgspec/components/chip.md:52 /stateTokens/selected+focus-visible/fg
combobox · statefgselected · color.interaction.selection.bgspec/components/combobox.md:69 /stateTokens/selected/fg
data-table · statefgselected · color.interaction.selection.bgspec/components/data-table.md:59 /stateTokens/selected/fg
data-table · statefgselected+focus-visible · color.interaction.selection.bgspec/components/data-table.md:60 /stateTokens/selected+focus-visible/fg
diagnostics · statefgselected · color.interaction.selection.bgspec/components/diagnostics.md:68 /stateTokens/selected/fg
diagnostics · statefgselected+focus-visible · color.interaction.selection.bgspec/components/diagnostics.md:69 /stateTokens/selected+focus-visible/fg
diff-view · statefgselected · color.interaction.selection.bgspec/components/diff-view.md:65 /stateTokens/selected/fg
filterable-table · statefgselected · color.interaction.selection.bgspec/components/filterable-table.md:77 /stateTokens/selected/fg
i3-window-frame · statefgselected · color.interaction.selection.bgspec/components/i3-window-frame.md:67 /stateTokens/selected/fg
icon-button · statefgtoggled · color.interaction.selection.bgspec/components/icon-button.md:43 /stateTokens/toggled/fg
icon-button · statefgtoggled+focus-visible · color.interaction.selection.bgspec/components/icon-button.md:44 /stateTokens/toggled+focus-visible/fg
list · statefgselected · color.interaction.selection.bgspec/components/list.md:53 /stateTokens/selected/fg
list · statefgselected+focus-visible · color.interaction.selection.bgspec/components/list.md:54 /stateTokens/selected+focus-visible/fg
menu · statefgselected · color.interaction.selection.bgspec/components/menu.md:63 /stateTokens/selected/fg
sidebar-nav · statefgselected · color.interaction.selection.bgspec/components/sidebar-nav.md:56 /stateTokens/selected/fg
table · statefgselected · color.interaction.selection.bgspec/components/table.md:58 /stateTokens/selected/fg
table · statefgselected+focus-visible · color.interaction.selection.bgspec/components/table.md:59 /stateTokens/selected+focus-visible/fg

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