PatternFly 6: density token view

Generated from the normalized JSON extract. Edit the JSON source and rerun the parent render-markdown.ps1 renderer; do not edit this page by hand.

  • Scope: density-relevant public tokens and component modifiers
  • Architecture model: component-local compact modifiers remap component custom properties
  • Evidence: repository
  • Exact token coverage: high for compact-enabled components
  • System report
  • Source record
  • Authoritative JSON

Snapshot

FieldValue
patternflyCommit8eb57cacd9ad5ccfec4edf2e25c51baffc0ace63
reactCommit9e6456bf4b493cf8546212e70feb116a798ba79c
retrieved2026-08-11

How density is activated

MechanismPublic implementation
dataListDescriptionListToggleGroupisCompact boolean -> .pf-m-compact
tablevariant=‘compact’ -> compact modifier
card.pf-m-compact modifier
globalDensityModenot available

Density-relevant tokens and values

Token or mappingTypePublic values and metadataSource
—pf-t—global—spacer—100dimensionvalue: 0.25rem; derivedPx: 4; semanticAlias: —pf-t—global—spacer—xssources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—spacer—200dimensionvalue: 0.5rem; derivedPx: 8; semanticAlias: —pf-t—global—spacer—smsources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—spacer—300dimensionvalue: 1rem; derivedPx: 16; semanticAlias: —pf-t—global—spacer—mdsources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—spacer—400dimensionvalue: 1.5rem; derivedPx: 24; semanticAlias: —pf-t—global—spacer—lgsources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—spacer—500dimensionvalue: 2rem; derivedPx: 32; semanticAlias: —pf-t—global—spacer—xlsources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—font—size—100dimensionvalue: 0.75rem; derivedPx: 12; semanticAlias: —pf-t—global—font—size—xs / body—smsources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—font—size—200dimensionvalue: 0.875rem; derivedPx: 14; semanticAlias: —pf-t—global—font—size—sm / body—defaultsources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—font—size—300dimensionvalue: 1rem; derivedPx: 16; semanticAlias: —pf-t—global—font—size—md / body—lgsources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—spacer—control—vertical—compactaliasvalue: —pf-t—global—spacer—xs; resolvedPx: 4sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-t—global—spacer—control—vertical—plainaliasvalue: —pf-t—global—spacer—sm; resolvedPx: 8sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss
—pf-v6-c-data-list__cell—PaddingBlockStart/Endcomponent-mode-mapvalues: default: —pf-t—global—spacer—lg; compact: —pf-t—global—spacer—sm; resolvedPx: default: 24; compact: 8sources/patternfly/upstream/patternfly/src/patternfly/components/DataList/data-list.scss
—pf-v6-c-data-list—FontSizecomponent-mode-mapvalues: default: —pf-t—global—font—size—body—default; compact: —pf-t—global—font—size—body—sm; resolvedPx: default: 14; compact: 12sources/patternfly/upstream/patternfly/src/patternfly/components/DataList/data-list.scss
—pf-v6-c-table—cell—Padding—basecomponent-tokenvalue: —pf-t—global—spacer—md; resolvedPx: 16sources/patternfly/upstream/patternfly/src/patternfly/components/Table/table.scss
—pf-v6-c-table—m-compact—cell—PaddingBlockStart/Endcomponent-tokenvalue: —pf-t—global—spacer—sm; resolvedPx: 8sources/patternfly/upstream/patternfly/src/patternfly/components/Table/table.scss
—pf-v6-c-table—m-compact__td—m-action—PaddingBlockStart/Endcomponent-tokenvalue: —pf-t—global—spacer—xs; resolvedPx: 4sources/patternfly/upstream/patternfly/src/patternfly/components/Table/table.scss
—pf-v6-c-card—child paddingcomponent-mode-mapvalues: default: —pf-t—global—spacer—lg; compact: —pf-t—global—spacer—md; resolvedPx: default: 24; compact: 16sources/patternfly/upstream/patternfly/src/patternfly/components/Card/card.scss
—pf-v6-c-card__footer—FontSizecomponent-mode-mapvalues: default: —pf-t—global—font—size—body—default; compact: —pf-t—global—font—size—body—sm; resolvedPx: default: 14; compact: 12sources/patternfly/upstream/patternfly/src/patternfly/components/Card/card.scss

How tokens reach components

Component or boundaryMapping
dataListisCompact -> .pf-m-compact -> component custom properties remap spacing and type aliases
tablevariant=‘compact’ -> compact class -> component cell padding remaps; body typography remains default
cardcompact modifier -> component padding remaps and smaller footer type; title/body type remain invariant
coexistencecompact behavior is local to opted-in components

Public evidence gaps

  • No public system-wide density mode or Figma density mechanism was found in the inspected sources.

Embedded authoritative JSON

Show raw JSON
{
  "system": "PatternFly 6",
  "scope": "density-relevant public tokens and component modifiers",
  "model": "component-local compact modifiers remap component custom properties",
  "snapshot": {
    "patternflyCommit": "8eb57cacd9ad5ccfec4edf2e25c51baffc0ace63",
    "reactCommit": "9e6456bf4b493cf8546212e70feb116a798ba79c",
    "retrieved": "2026-08-11"
  },
  "activation": {
    "dataListDescriptionListToggleGroup": "isCompact boolean -> .pf-m-compact",
    "table": "variant='compact' -> compact modifier",
    "card": ".pf-m-compact modifier",
    "globalDensityMode": null
  },
  "tokens": [
    {"name": "--pf-t--global--spacer--100", "type": "dimension", "value": "0.25rem", "derivedPx": 4, "semanticAlias": "--pf-t--global--spacer--xs", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--spacer--200", "type": "dimension", "value": "0.5rem", "derivedPx": 8, "semanticAlias": "--pf-t--global--spacer--sm", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--spacer--300", "type": "dimension", "value": "1rem", "derivedPx": 16, "semanticAlias": "--pf-t--global--spacer--md", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--spacer--400", "type": "dimension", "value": "1.5rem", "derivedPx": 24, "semanticAlias": "--pf-t--global--spacer--lg", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--spacer--500", "type": "dimension", "value": "2rem", "derivedPx": 32, "semanticAlias": "--pf-t--global--spacer--xl", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--font--size--100", "type": "dimension", "value": "0.75rem", "derivedPx": 12, "semanticAlias": "--pf-t--global--font--size--xs / body--sm", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--font--size--200", "type": "dimension", "value": "0.875rem", "derivedPx": 14, "semanticAlias": "--pf-t--global--font--size--sm / body--default", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--font--size--300", "type": "dimension", "value": "1rem", "derivedPx": 16, "semanticAlias": "--pf-t--global--font--size--md / body--lg", "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--spacer--control--vertical--compact", "type": "alias", "value": "--pf-t--global--spacer--xs", "resolvedPx": 4, "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-t--global--spacer--control--vertical--plain", "type": "alias", "value": "--pf-t--global--spacer--sm", "resolvedPx": 8, "source": "sources/patternfly/upstream/patternfly/src/patternfly/base/tokens/tokens-default.scss"},
    {"name": "--pf-v6-c-data-list__cell--PaddingBlockStart/End", "type": "component-mode-map", "values": {"default": "--pf-t--global--spacer--lg", "compact": "--pf-t--global--spacer--sm"}, "resolvedPx": {"default": 24, "compact": 8}, "source": "sources/patternfly/upstream/patternfly/src/patternfly/components/DataList/data-list.scss"},
    {"name": "--pf-v6-c-data-list--FontSize", "type": "component-mode-map", "values": {"default": "--pf-t--global--font--size--body--default", "compact": "--pf-t--global--font--size--body--sm"}, "resolvedPx": {"default": 14, "compact": 12}, "source": "sources/patternfly/upstream/patternfly/src/patternfly/components/DataList/data-list.scss"},
    {"name": "--pf-v6-c-table--cell--Padding--base", "type": "component-token", "value": "--pf-t--global--spacer--md", "resolvedPx": 16, "source": "sources/patternfly/upstream/patternfly/src/patternfly/components/Table/table.scss"},
    {"name": "--pf-v6-c-table--m-compact--cell--PaddingBlockStart/End", "type": "component-token", "value": "--pf-t--global--spacer--sm", "resolvedPx": 8, "source": "sources/patternfly/upstream/patternfly/src/patternfly/components/Table/table.scss"},
    {"name": "--pf-v6-c-table--m-compact__td--m-action--PaddingBlockStart/End", "type": "component-token", "value": "--pf-t--global--spacer--xs", "resolvedPx": 4, "source": "sources/patternfly/upstream/patternfly/src/patternfly/components/Table/table.scss"},
    {"name": "--pf-v6-c-card--child padding", "type": "component-mode-map", "values": {"default": "--pf-t--global--spacer--lg", "compact": "--pf-t--global--spacer--md"}, "resolvedPx": {"default": 24, "compact": 16}, "source": "sources/patternfly/upstream/patternfly/src/patternfly/components/Card/card.scss"},
    {"name": "--pf-v6-c-card__footer--FontSize", "type": "component-mode-map", "values": {"default": "--pf-t--global--font--size--body--default", "compact": "--pf-t--global--font--size--body--sm"}, "resolvedPx": {"default": 14, "compact": 12}, "source": "sources/patternfly/upstream/patternfly/src/patternfly/components/Card/card.scss"}
  ],
  "componentMappings": {
    "dataList": "isCompact -> .pf-m-compact -> component custom properties remap spacing and type aliases",
    "table": "variant='compact' -> compact class -> component cell padding remaps; body typography remains default",
    "card": "compact modifier -> component padding remaps and smaller footer type; title/body type remain invariant",
    "coexistence": "compact behavior is local to opted-in components"
  },
  "unavailable": ["No public system-wide density mode or Figma density mechanism was found in the inspected sources."]
}