{ "$schema": "https://cdn.dynamicframework.dev/assets/schema/token-overrides.v1.json", "dynamicUi": "2.12.1", "generatedFrom": "scripts/tokens/_defs-harness.scss (abstracts + root → token values & classification) + scripts/tokens/_full-harness.scss (full src/style/dynamic-ui.scss chain → var(--bs-*) reference/slot scan)", "generatedAt": "2026-10-26T19:46:17Z", "consumption": { "note": "This artifact corresponds to the Dynamic version in 'dynamicUi'. A consumer must fetch the artifact of the SAME version as the CSS bundle it loads (versioned CDN, e.g. assets/2.12.1/ui-react/).", "anchor": ":root, [data-bs-theme=\"dynamic\"]", "howOverrideWins": { "withLayers": "Dynamic emits its tokens WITHOUT a layer (base cascade), and in CSS unlayered styles beat those in any @layer. So if you import Dynamic inside a layer (e.g. @import url(dynamic) layer(framework)), declare your overrides layer AFTER it so it wins among layers: the last declared layer wins, e.g. \"@layer framework, theme;\" (theme wins). If Dynamic stays unlayered, use the withoutLayers path. Full detail at https://docs.modyo.com/en/dynamic/customization/theming.html.", "withoutLayers": "Without @layer, match or exceed the Dynamic selector, in a later rule. NEVER :where() (specificity 0)." }, "colorFormat": "'R, G, B' triplet WITHOUT an rgb() wrapper. The system does rgb(var(--bs-X-rgb)) and rgba(var(--bs-X-rgb), a). A hex or rgb() breaks opacity. Override the -rgb, never the wrappers.", "clientVarBridge": "To wire a brand: --bs--rgb: var(--client--rgb). The --client-* belong to the consumer and do NOT live in this artifact; minimalRebrandSet is the exact list of --bs-* to wire." }, "behaviorClasses": { "override-base": "Override the base --bs-X-rgb. Drags --bs-X and --bs-X-500-rgb along. Does NOT recolor the rest of the ramp.", "override-leaf": "Baked literal. Override one by one; does not follow the base.", "follows": "Auto-derived (alias/wrapper). Do NOT override; it recolors itself.", "not-overridable": "Baked value outside var() (data-URI). Replace the whole variable or treat as a gap." }, "color": { "ramps": { "cyan": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-cyan-rgb", "value": "13, 202, 240", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-cyan-25-rgb", "value": "243, 252, 254", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-cyan-50-rgb", "value": "231, 250, 254", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-cyan-100-rgb", "value": "207, 244, 252", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-cyan-200-rgb", "value": "158, 234, 249", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-cyan-300-rgb", "value": "110, 223, 246", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-cyan-400-rgb", "value": "61, 213, 243", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-cyan-500-rgb", "value": "var(--bs-cyan-rgb)", "class": "follows", "aliasOf": "--bs-cyan-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-cyan-600-rgb", "value": "10, 162, 192", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-cyan-700-rgb", "value": "8, 121, 144", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-cyan-800-rgb", "value": "5, 81, 96", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-cyan-900-rgb", "value": "3, 40, 48", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-cyan-rgb", "--bs-cyan-25-rgb", "--bs-cyan-50-rgb", "--bs-cyan-100-rgb", "--bs-cyan-200-rgb", "--bs-cyan-300-rgb", "--bs-cyan-400-rgb", "--bs-cyan-600-rgb", "--bs-cyan-700-rgb", "--bs-cyan-800-rgb", "--bs-cyan-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "danger": { "kind": "role", "layer": "role", "base": { "cssVar": "--bs-danger-rgb", "value": "220, 53, 69", "class": "override-base", "layer": "role", "aliasOf": "--bs-red-rgb" }, "steps": { "25": { "cssVar": "--bs-danger-25-rgb", "value": "253, 245, 246", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-danger-50-rgb", "value": "252, 235, 236", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-danger-100-rgb", "value": "248, 215, 218", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-danger-200-rgb", "value": "241, 174, 181", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-danger-300-rgb", "value": "234, 134, 143", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-danger-400-rgb", "value": "227, 93, 106", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-danger-500-rgb", "value": "var(--bs-danger-rgb)", "class": "follows", "aliasOf": "--bs-danger-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-danger-600-rgb", "value": "176, 42, 55", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-danger-700-rgb", "value": "132, 32, 41", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-danger-800-rgb", "value": "88, 21, 28", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-danger-900-rgb", "value": "44, 11, 14", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-danger-rgb", "--bs-danger-25-rgb", "--bs-danger-50-rgb", "--bs-danger-100-rgb", "--bs-danger-200-rgb", "--bs-danger-300-rgb", "--bs-danger-400-rgb", "--bs-danger-600-rgb", "--bs-danger-700-rgb", "--bs-danger-800-rgb", "--bs-danger-900-rgb" ], "semanticFollowers": [ "--bs-danger-bg-subtle", "--bs-danger-text-emphasis", "--bs-danger-border-subtle" ], "hue": "red", "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "gray": { "kind": "neutral", "layer": "palette", "base": { "cssVar": "--bs-gray-rgb", "value": "109, 109, 130", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-gray-25-rgb", "value": "251, 251, 252", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-gray-50-rgb", "value": "240, 240, 242", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-gray-100-rgb", "value": "225, 225, 230", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-gray-200-rgb", "value": "196, 196, 205", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-gray-300-rgb", "value": "167, 167, 180", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-gray-400-rgb", "value": "138, 138, 155", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-gray-500-rgb", "value": "109, 109, 130", "class": "override-leaf", "layer": "palette" }, "600": { "cssVar": "--bs-gray-600-rgb", "value": "87, 87, 104", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-gray-700-rgb", "value": "65, 65, 78", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-gray-800-rgb", "value": "43, 43, 52", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-gray-900-rgb", "value": "21, 21, 26", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-gray-rgb", "--bs-gray-25-rgb", "--bs-gray-50-rgb", "--bs-gray-100-rgb", "--bs-gray-200-rgb", "--bs-gray-300-rgb", "--bs-gray-400-rgb", "--bs-gray-500-rgb", "--bs-gray-600-rgb", "--bs-gray-700-rgb", "--bs-gray-800-rgb", "--bs-gray-900-rgb" ], "semanticFollowers": [], "method": "hand-authored", "regenerable": false }, "green": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-green-rgb", "value": "25, 135, 84", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-green-25-rgb", "value": "244, 249, 246", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-green-50-rgb", "value": "232, 243, 238", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-green-100-rgb", "value": "209, 231, 221", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-green-200-rgb", "value": "163, 207, 187", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-green-300-rgb", "value": "117, 183, 152", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-green-400-rgb", "value": "71, 159, 118", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-green-500-rgb", "value": "var(--bs-green-rgb)", "class": "follows", "aliasOf": "--bs-green-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-green-600-rgb", "value": "20, 108, 67", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-green-700-rgb", "value": "15, 81, 50", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-green-800-rgb", "value": "10, 54, 34", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-green-900-rgb", "value": "5, 27, 17", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-green-rgb", "--bs-green-25-rgb", "--bs-green-50-rgb", "--bs-green-100-rgb", "--bs-green-200-rgb", "--bs-green-300-rgb", "--bs-green-400-rgb", "--bs-green-600-rgb", "--bs-green-700-rgb", "--bs-green-800-rgb", "--bs-green-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "indigo": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-indigo-rgb", "value": "102, 16, 242", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-indigo-25-rgb", "value": "247, 243, 254", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-indigo-50-rgb", "value": "240, 231, 254", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-indigo-100-rgb", "value": "224, 207, 252", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-indigo-200-rgb", "value": "194, 159, 250", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-indigo-300-rgb", "value": "163, 112, 247", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-indigo-400-rgb", "value": "133, 64, 245", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-indigo-500-rgb", "value": "var(--bs-indigo-rgb)", "class": "follows", "aliasOf": "--bs-indigo-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-indigo-600-rgb", "value": "82, 13, 194", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-indigo-700-rgb", "value": "61, 10, 145", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-indigo-800-rgb", "value": "41, 6, 97", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-indigo-900-rgb", "value": "20, 3, 48", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-indigo-rgb", "--bs-indigo-25-rgb", "--bs-indigo-50-rgb", "--bs-indigo-100-rgb", "--bs-indigo-200-rgb", "--bs-indigo-300-rgb", "--bs-indigo-400-rgb", "--bs-indigo-600-rgb", "--bs-indigo-700-rgb", "--bs-indigo-800-rgb", "--bs-indigo-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "info": { "kind": "role", "layer": "role", "base": { "cssVar": "--bs-info-rgb", "value": "32, 104, 213", "class": "override-base", "layer": "role", "aliasOf": "--bs-blue-rgb" }, "steps": { "25": { "cssVar": "--bs-info-25-rgb", "value": "244, 247, 253", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-info-50-rgb", "value": "233, 240, 251", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-info-100-rgb", "value": "210, 225, 247", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-info-200-rgb", "value": "166, 195, 238", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-info-300-rgb", "value": "121, 164, 230", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-info-400-rgb", "value": "77, 134, 221", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-info-500-rgb", "value": "var(--bs-info-rgb)", "class": "follows", "aliasOf": "--bs-info-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-info-600-rgb", "value": "26, 83, 170", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-info-700-rgb", "value": "19, 62, 128", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-info-800-rgb", "value": "13, 42, 85", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-info-900-rgb", "value": "6, 21, 43", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-info-rgb", "--bs-info-25-rgb", "--bs-info-50-rgb", "--bs-info-100-rgb", "--bs-info-200-rgb", "--bs-info-300-rgb", "--bs-info-400-rgb", "--bs-info-600-rgb", "--bs-info-700-rgb", "--bs-info-800-rgb", "--bs-info-900-rgb" ], "semanticFollowers": [ "--bs-info-bg-subtle", "--bs-info-text-emphasis", "--bs-info-border-subtle" ], "hue": "blue", "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "orange": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-orange-rgb", "value": "253, 126, 20", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-orange-25-rgb", "value": "255, 249, 243", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-orange-50-rgb", "value": "255, 242, 232", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-orange-100-rgb", "value": "255, 229, 208", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-orange-200-rgb", "value": "254, 203, 161", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-orange-300-rgb", "value": "254, 178, 114", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-orange-400-rgb", "value": "253, 152, 67", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-orange-500-rgb", "value": "var(--bs-orange-rgb)", "class": "follows", "aliasOf": "--bs-orange-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-orange-600-rgb", "value": "202, 101, 16", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-orange-700-rgb", "value": "152, 76, 12", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-orange-800-rgb", "value": "101, 50, 8", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-orange-900-rgb", "value": "51, 25, 4", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-orange-rgb", "--bs-orange-25-rgb", "--bs-orange-50-rgb", "--bs-orange-100-rgb", "--bs-orange-200-rgb", "--bs-orange-300-rgb", "--bs-orange-400-rgb", "--bs-orange-600-rgb", "--bs-orange-700-rgb", "--bs-orange-800-rgb", "--bs-orange-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "pink": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-pink-rgb", "value": "216, 27, 96", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-pink-25-rgb", "value": "253, 244, 247", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-pink-50-rgb", "value": "251, 232, 239", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-pink-100-rgb", "value": "247, 209, 223", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-pink-200-rgb", "value": "239, 164, 191", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-pink-300-rgb", "value": "232, 118, 160", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-pink-400-rgb", "value": "224, 73, 128", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-pink-500-rgb", "value": "var(--bs-pink-rgb)", "class": "follows", "aliasOf": "--bs-pink-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-pink-600-rgb", "value": "173, 22, 77", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-pink-700-rgb", "value": "130, 16, 58", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-pink-800-rgb", "value": "86, 11, 38", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-pink-900-rgb", "value": "43, 5, 19", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-pink-rgb", "--bs-pink-25-rgb", "--bs-pink-50-rgb", "--bs-pink-100-rgb", "--bs-pink-200-rgb", "--bs-pink-300-rgb", "--bs-pink-400-rgb", "--bs-pink-600-rgb", "--bs-pink-700-rgb", "--bs-pink-800-rgb", "--bs-pink-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "primary": { "kind": "role", "layer": "role", "base": { "cssVar": "--bs-primary-rgb", "value": "32, 104, 213", "class": "override-base", "layer": "role", "aliasOf": "--bs-blue-rgb" }, "steps": { "25": { "cssVar": "--bs-primary-25-rgb", "value": "244, 247, 253", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-primary-50-rgb", "value": "233, 240, 251", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-primary-100-rgb", "value": "210, 225, 247", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-primary-200-rgb", "value": "166, 195, 238", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-primary-300-rgb", "value": "121, 164, 230", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-primary-400-rgb", "value": "77, 134, 221", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-primary-500-rgb", "value": "var(--bs-primary-rgb)", "class": "follows", "aliasOf": "--bs-primary-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-primary-600-rgb", "value": "26, 83, 170", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-primary-700-rgb", "value": "19, 62, 128", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-primary-800-rgb", "value": "13, 42, 85", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-primary-900-rgb", "value": "6, 21, 43", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-primary-rgb", "--bs-primary-25-rgb", "--bs-primary-50-rgb", "--bs-primary-100-rgb", "--bs-primary-200-rgb", "--bs-primary-300-rgb", "--bs-primary-400-rgb", "--bs-primary-600-rgb", "--bs-primary-700-rgb", "--bs-primary-800-rgb", "--bs-primary-900-rgb" ], "semanticFollowers": [ "--bs-primary-bg-subtle", "--bs-primary-text-emphasis", "--bs-primary-border-subtle" ], "hue": "blue", "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "purple": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-purple-rgb", "value": "72, 72, 183", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-purple-25-rgb", "value": "246, 246, 251", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-purple-50-rgb", "value": "237, 237, 248", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-purple-100-rgb", "value": "218, 218, 241", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-purple-200-rgb", "value": "182, 182, 226", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-purple-300-rgb", "value": "145, 145, 212", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-purple-400-rgb", "value": "109, 109, 197", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-purple-500-rgb", "value": "var(--bs-purple-rgb)", "class": "follows", "aliasOf": "--bs-purple-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-purple-600-rgb", "value": "58, 58, 146", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-purple-700-rgb", "value": "43, 43, 110", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-purple-800-rgb", "value": "29, 29, 73", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-purple-900-rgb", "value": "14, 14, 37", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-purple-rgb", "--bs-purple-25-rgb", "--bs-purple-50-rgb", "--bs-purple-100-rgb", "--bs-purple-200-rgb", "--bs-purple-300-rgb", "--bs-purple-400-rgb", "--bs-purple-600-rgb", "--bs-purple-700-rgb", "--bs-purple-800-rgb", "--bs-purple-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "red": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-red-rgb", "value": "220, 53, 69", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-red-25-rgb", "value": "253, 245, 246", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-red-50-rgb", "value": "252, 235, 236", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-red-100-rgb", "value": "248, 215, 218", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-red-200-rgb", "value": "241, 174, 181", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-red-300-rgb", "value": "234, 134, 143", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-red-400-rgb", "value": "227, 93, 106", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-red-500-rgb", "value": "var(--bs-red-rgb)", "class": "follows", "aliasOf": "--bs-red-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-red-600-rgb", "value": "176, 42, 55", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-red-700-rgb", "value": "132, 32, 41", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-red-800-rgb", "value": "88, 21, 28", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-red-900-rgb", "value": "44, 11, 14", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-red-rgb", "--bs-red-25-rgb", "--bs-red-50-rgb", "--bs-red-100-rgb", "--bs-red-200-rgb", "--bs-red-300-rgb", "--bs-red-400-rgb", "--bs-red-600-rgb", "--bs-red-700-rgb", "--bs-red-800-rgb", "--bs-red-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "secondary": { "kind": "role", "layer": "role", "base": { "cssVar": "--bs-secondary-rgb", "value": "43, 43, 52", "class": "override-base", "layer": "role", "aliasOf": "--bs-gray-800-rgb" }, "steps": { "25": { "cssVar": "--bs-secondary-25-rgb", "value": "251, 251, 252", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-secondary-50-rgb", "value": "240, 240, 242", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-secondary-100-rgb", "value": "225, 225, 230", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-secondary-200-rgb", "value": "196, 196, 205", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-secondary-300-rgb", "value": "167, 167, 180", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-secondary-400-rgb", "value": "138, 138, 155", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-secondary-500-rgb", "value": "var(--bs-secondary-rgb)", "class": "follows", "aliasOf": "--bs-secondary-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-secondary-600-rgb", "value": "87, 87, 104", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-secondary-700-rgb", "value": "65, 65, 78", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-secondary-800-rgb", "value": "43, 43, 52", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-secondary-900-rgb", "value": "21, 21, 26", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-secondary-rgb", "--bs-secondary-25-rgb", "--bs-secondary-50-rgb", "--bs-secondary-100-rgb", "--bs-secondary-200-rgb", "--bs-secondary-300-rgb", "--bs-secondary-400-rgb", "--bs-secondary-600-rgb", "--bs-secondary-700-rgb", "--bs-secondary-800-rgb", "--bs-secondary-900-rgb" ], "semanticFollowers": [ "--bs-secondary-bg-subtle", "--bs-secondary-text-emphasis", "--bs-secondary-border-subtle" ], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "success": { "kind": "role", "layer": "role", "base": { "cssVar": "--bs-success-rgb", "value": "25, 135, 84", "class": "override-base", "layer": "role", "aliasOf": "--bs-green-rgb" }, "steps": { "25": { "cssVar": "--bs-success-25-rgb", "value": "244, 249, 246", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-success-50-rgb", "value": "232, 243, 238", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-success-100-rgb", "value": "209, 231, 221", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-success-200-rgb", "value": "163, 207, 187", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-success-300-rgb", "value": "117, 183, 152", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-success-400-rgb", "value": "71, 159, 118", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-success-500-rgb", "value": "var(--bs-success-rgb)", "class": "follows", "aliasOf": "--bs-success-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-success-600-rgb", "value": "20, 108, 67", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-success-700-rgb", "value": "15, 81, 50", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-success-800-rgb", "value": "10, 54, 34", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-success-900-rgb", "value": "5, 27, 17", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-success-rgb", "--bs-success-25-rgb", "--bs-success-50-rgb", "--bs-success-100-rgb", "--bs-success-200-rgb", "--bs-success-300-rgb", "--bs-success-400-rgb", "--bs-success-600-rgb", "--bs-success-700-rgb", "--bs-success-800-rgb", "--bs-success-900-rgb" ], "semanticFollowers": [ "--bs-success-bg-subtle", "--bs-success-text-emphasis", "--bs-success-border-subtle" ], "hue": "green", "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "teal": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-teal-rgb", "value": "32, 201, 151", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-teal-25-rgb", "value": "244, 252, 250", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-teal-50-rgb", "value": "233, 250, 245", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-teal-100-rgb", "value": "210, 244, 234", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-teal-200-rgb", "value": "166, 233, 213", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-teal-300-rgb", "value": "121, 223, 193", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-teal-400-rgb", "value": "77, 212, 172", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-teal-500-rgb", "value": "var(--bs-teal-rgb)", "class": "follows", "aliasOf": "--bs-teal-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-teal-600-rgb", "value": "26, 161, 121", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-teal-700-rgb", "value": "19, 121, 91", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-teal-800-rgb", "value": "13, 80, 60", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-teal-900-rgb", "value": "6, 40, 30", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-teal-rgb", "--bs-teal-25-rgb", "--bs-teal-50-rgb", "--bs-teal-100-rgb", "--bs-teal-200-rgb", "--bs-teal-300-rgb", "--bs-teal-400-rgb", "--bs-teal-600-rgb", "--bs-teal-700-rgb", "--bs-teal-800-rgb", "--bs-teal-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "warning": { "kind": "role", "layer": "role", "base": { "cssVar": "--bs-warning-rgb", "value": "255, 179, 0", "class": "override-base", "layer": "role", "aliasOf": "--bs-yellow-rgb" }, "steps": { "25": { "cssVar": "--bs-warning-25-rgb", "value": "255, 251, 242", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-warning-50-rgb", "value": "255, 247, 230", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-warning-100-rgb", "value": "255, 240, 204", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-warning-200-rgb", "value": "255, 225, 153", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-warning-300-rgb", "value": "255, 209, 102", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-warning-400-rgb", "value": "255, 194, 51", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-warning-500-rgb", "value": "var(--bs-warning-rgb)", "class": "follows", "aliasOf": "--bs-warning-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-warning-600-rgb", "value": "204, 143, 0", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-warning-700-rgb", "value": "153, 107, 0", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-warning-800-rgb", "value": "102, 72, 0", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-warning-900-rgb", "value": "51, 36, 0", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-warning-rgb", "--bs-warning-25-rgb", "--bs-warning-50-rgb", "--bs-warning-100-rgb", "--bs-warning-200-rgb", "--bs-warning-300-rgb", "--bs-warning-400-rgb", "--bs-warning-600-rgb", "--bs-warning-700-rgb", "--bs-warning-800-rgb", "--bs-warning-900-rgb" ], "semanticFollowers": [ "--bs-warning-bg-subtle", "--bs-warning-text-emphasis", "--bs-warning-border-subtle" ], "hue": "yellow", "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] }, "yellow": { "kind": "family", "layer": "palette", "base": { "cssVar": "--bs-yellow-rgb", "value": "255, 179, 0", "class": "override-base", "layer": "palette" }, "steps": { "25": { "cssVar": "--bs-yellow-25-rgb", "value": "255, 251, 242", "class": "override-leaf", "layer": "palette" }, "50": { "cssVar": "--bs-yellow-50-rgb", "value": "255, 247, 230", "class": "override-leaf", "layer": "palette" }, "100": { "cssVar": "--bs-yellow-100-rgb", "value": "255, 240, 204", "class": "override-leaf", "layer": "palette" }, "200": { "cssVar": "--bs-yellow-200-rgb", "value": "255, 225, 153", "class": "override-leaf", "layer": "palette" }, "300": { "cssVar": "--bs-yellow-300-rgb", "value": "255, 209, 102", "class": "override-leaf", "layer": "palette" }, "400": { "cssVar": "--bs-yellow-400-rgb", "value": "255, 194, 51", "class": "override-leaf", "layer": "palette" }, "500": { "cssVar": "--bs-yellow-500-rgb", "value": "var(--bs-yellow-rgb)", "class": "follows", "aliasOf": "--bs-yellow-rgb", "layer": "palette" }, "600": { "cssVar": "--bs-yellow-600-rgb", "value": "204, 143, 0", "class": "override-leaf", "layer": "palette" }, "700": { "cssVar": "--bs-yellow-700-rgb", "value": "153, 107, 0", "class": "override-leaf", "layer": "palette" }, "800": { "cssVar": "--bs-yellow-800-rgb", "value": "102, 72, 0", "class": "override-leaf", "layer": "palette" }, "900": { "cssVar": "--bs-yellow-900-rgb", "value": "51, 36, 0", "class": "override-leaf", "layer": "palette" } }, "minimalRebrandSet": [ "--bs-yellow-rgb", "--bs-yellow-25-rgb", "--bs-yellow-50-rgb", "--bs-yellow-100-rgb", "--bs-yellow-200-rgb", "--bs-yellow-300-rgb", "--bs-yellow-400-rgb", "--bs-yellow-600-rgb", "--bs-yellow-700-rgb", "--bs-yellow-800-rgb", "--bs-yellow-900-rgb" ], "semanticFollowers": [], "rampMethod": "bootstrap-mix-srgb", "rampWeights": [ 95, 90, 80, 60, 40, 20, 0, -20, -40, -60, -80 ] } }, "hueGroups": { "red": [ "danger", "red" ], "blue": [ "info", "primary" ], "green": [ "green", "success" ], "yellow": [ "warning", "yellow" ] }, "rebrandScope": { "default": "role", "role": "Override only --bs--* (the minimalRebrandSet: 1 base + 10 leaves). Other ramps of the same hue do NOT change.", "hue": "Override ALL ramps in the hueGroup + the base --bs--rgb. See hueGroups.", "agentMustAsk": "If the change targets a hue that surfaces in several ramps (see hueGroups), confirm with the requester whether the state roles (e.g. info) follow the new brand or stay as a semantic state color. Without confirmation, apply the \"role\" default.", "warning": "Changing ONLY a role's base (what the 'override Layer 2' guidance suggests) leaves the ramp leaves (bg-subtle, hover/active -600/-700) on the old hue. For a faithful brand, override the full minimalRebrandSet, not just the base." } }, "typography": { "fontFamily": { "cssVar": "--bs-font-sans-serif", "value": "\"Jost\", sans-serif", "class": "override-leaf", "layer": "role" }, "fontMonospace": { "cssVar": "--bs-font-monospace", "value": "SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace", "class": "override-leaf" }, "weights": { "lighter": { "cssVar": "--bs-fw-lighter", "value": "lighter", "class": "override-leaf" }, "light": { "cssVar": "--bs-fw-light", "value": "200", "class": "override-leaf" }, "normal": { "cssVar": "--bs-fw-normal", "value": "400", "class": "override-leaf" }, "semibold": { "cssVar": "--bs-fw-semibold", "value": "500", "class": "override-leaf" }, "bold": { "cssVar": "--bs-fw-bold", "value": "600", "class": "override-leaf" }, "bolder": { "cssVar": "--bs-fw-bolder", "value": "600", "class": "override-leaf" } }, "lineHeight": { "base": { "cssVar": "--bs-lh-base", "value": "1.5", "class": "override-leaf" }, "sm": { "cssVar": "--bs-lh-sm", "value": "1.25", "class": "override-leaf" }, "lg": { "cssVar": "--bs-lh-lg", "value": "2", "class": "override-leaf" } }, "scale": { "note": "RFS gotcha: --bs-fs-N -> var(--bs-rfs-fs-N) and --bs-fs-display-N -> var(--bs-rfs-display-N). Levels with hasResponsiveRedef=true have a responsive redefinition (calc(... + ...vw)) inside an @media (min-width: 1200px). Overriding the size means also beating the media-query rule; overriding only the base value is not enough on large viewports. The overridable target is --bs-rfs-{fs,display}-N (not --bs-fs-{,display-}N, which are follows).", "display-1": { "cssVar": "--bs-rfs-display-1", "value": "calc(1.725rem + 5.7vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "display-2": { "cssVar": "--bs-rfs-display-2", "value": "calc(1.675rem + 5.1vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "display-3": { "cssVar": "--bs-rfs-display-3", "value": "calc(1.625rem + 4.5vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "display-4": { "cssVar": "--bs-rfs-display-4", "value": "calc(1.575rem + 3.9vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "display-5": { "cssVar": "--bs-rfs-display-5", "value": "calc(1.525rem + 3.3vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "display-6": { "cssVar": "--bs-rfs-display-6", "value": "calc(1.475rem + 2.7vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "fs-1": { "cssVar": "--bs-rfs-fs-1", "value": "calc(1.425rem + 2.1vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "fs-2": { "cssVar": "--bs-rfs-fs-2", "value": "calc(1.375rem + 1.5vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "fs-3": { "cssVar": "--bs-rfs-fs-3", "value": "calc(1.325rem + 0.9vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "fs-4": { "cssVar": "--bs-rfs-fs-4", "value": "calc(1.275rem + 0.3vw)", "class": "override-leaf", "hasResponsiveRedef": true }, "fs-5": { "cssVar": "--bs-rfs-fs-5", "value": "1.25rem", "class": "override-leaf", "hasResponsiveRedef": false }, "fs-6": { "cssVar": "--bs-rfs-fs-6", "value": "1rem", "class": "override-leaf", "hasResponsiveRedef": false }, "fs-small": { "cssVar": "--bs-rfs-fs-small", "value": "0.875em", "class": "override-leaf", "hasResponsiveRedef": false } } }, "spacing": { "note": "31 literal levels --bs-ref-spacer-0..30. Derived from $spacer at build time; at runtime they are plain literals you can override directly.", "levels": { "0": { "cssVar": "--bs-ref-spacer-0", "value": "0", "class": "override-leaf" }, "1": { "cssVar": "--bs-ref-spacer-1", "value": "0.25rem", "class": "override-leaf" }, "2": { "cssVar": "--bs-ref-spacer-2", "value": "0.5rem", "class": "override-leaf" }, "3": { "cssVar": "--bs-ref-spacer-3", "value": "0.75rem", "class": "override-leaf" }, "4": { "cssVar": "--bs-ref-spacer-4", "value": "1rem", "class": "override-leaf" }, "5": { "cssVar": "--bs-ref-spacer-5", "value": "1.25rem", "class": "override-leaf" }, "6": { "cssVar": "--bs-ref-spacer-6", "value": "1.5rem", "class": "override-leaf" }, "7": { "cssVar": "--bs-ref-spacer-7", "value": "1.75rem", "class": "override-leaf" }, "8": { "cssVar": "--bs-ref-spacer-8", "value": "2rem", "class": "override-leaf" }, "9": { "cssVar": "--bs-ref-spacer-9", "value": "2.25rem", "class": "override-leaf" }, "10": { "cssVar": "--bs-ref-spacer-10", "value": "2.5rem", "class": "override-leaf" }, "11": { "cssVar": "--bs-ref-spacer-11", "value": "2.75rem", "class": "override-leaf" }, "12": { "cssVar": "--bs-ref-spacer-12", "value": "3rem", "class": "override-leaf" }, "13": { "cssVar": "--bs-ref-spacer-13", "value": "3.25rem", "class": "override-leaf" }, "14": { "cssVar": "--bs-ref-spacer-14", "value": "3.5rem", "class": "override-leaf" }, "15": { "cssVar": "--bs-ref-spacer-15", "value": "3.75rem", "class": "override-leaf" }, "16": { "cssVar": "--bs-ref-spacer-16", "value": "4rem", "class": "override-leaf" }, "17": { "cssVar": "--bs-ref-spacer-17", "value": "4.25rem", "class": "override-leaf" }, "18": { "cssVar": "--bs-ref-spacer-18", "value": "4.5rem", "class": "override-leaf" }, "19": { "cssVar": "--bs-ref-spacer-19", "value": "4.75rem", "class": "override-leaf" }, "20": { "cssVar": "--bs-ref-spacer-20", "value": "5rem", "class": "override-leaf" }, "21": { "cssVar": "--bs-ref-spacer-21", "value": "5.25rem", "class": "override-leaf" }, "22": { "cssVar": "--bs-ref-spacer-22", "value": "5.5rem", "class": "override-leaf" }, "23": { "cssVar": "--bs-ref-spacer-23", "value": "5.75rem", "class": "override-leaf" }, "24": { "cssVar": "--bs-ref-spacer-24", "value": "6rem", "class": "override-leaf" }, "25": { "cssVar": "--bs-ref-spacer-25", "value": "6.25rem", "class": "override-leaf" }, "26": { "cssVar": "--bs-ref-spacer-26", "value": "6.5rem", "class": "override-leaf" }, "27": { "cssVar": "--bs-ref-spacer-27", "value": "6.75rem", "class": "override-leaf" }, "28": { "cssVar": "--bs-ref-spacer-28", "value": "7rem", "class": "override-leaf" }, "29": { "cssVar": "--bs-ref-spacer-29", "value": "7.25rem", "class": "override-leaf" }, "30": { "cssVar": "--bs-ref-spacer-30", "value": "7.5rem", "class": "override-leaf" } } }, "radius": { "note": "Independent literal variants (including \"default\" = --bs-border-radius, the most used), NOT a derived scale.", "variants": { "default": { "cssVar": "--bs-border-radius", "value": "0.5rem", "class": "override-leaf" }, "sm": { "cssVar": "--bs-border-radius-sm", "value": "0.25rem", "class": "override-leaf" }, "lg": { "cssVar": "--bs-border-radius-lg", "value": "1rem", "class": "override-leaf" }, "xl": { "cssVar": "--bs-border-radius-xl", "value": "1.5rem", "class": "override-leaf" }, "xxl": { "cssVar": "--bs-border-radius-xxl", "value": "2rem", "class": "override-leaf" }, "2xl": { "cssVar": "--bs-border-radius-2xl", "value": "var(--bs-border-radius-xxl)", "class": "follows" }, "pill": { "cssVar": "--bs-border-radius-pill", "value": "50rem", "class": "override-leaf" } } }, "shadow": { "coverage": "partial", "note": "Only --bs-box-shadow-lg is a Dynamic-owned override in this version. The rest inherit Bootstrap defaults.", "variants": { "default": { "cssVar": "--bs-box-shadow", "value": "0 0.5rem 1rem rgba(0, 0, 0, 0.15)", "class": "override-leaf" }, "sm": { "cssVar": "--bs-box-shadow-sm", "value": "0 0.125rem 0.25rem rgba(0, 0, 0, 0.075)", "class": "override-leaf" }, "lg": { "cssVar": "--bs-box-shadow-lg", "value": "0 1rem 3rem rgba(0, 0, 0, 0.175)", "class": "override-leaf" }, "inset": { "cssVar": "--bs-box-shadow-inset", "value": "inset 0 1px 2px rgba(0, 0, 0, 0.075)", "class": "override-leaf" } } }, "slots": { "note": "Vars the code REFERENCES but does NOT define anywhere in the compiled CSS (R - Dall). suspected=false only for the regular family-hue semantic-follower pattern; the rest are candidates to verify (theme slot, Bootstrap runtime, or dead reference). Malformed typos go in denylist, not here.", "vars": [ { "cssVar": "--bs-alert-icon-color", "referencedBy": [ "base/alert" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-body-text-align", "referencedBy": [ "root/root" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-breadcrumb-divider", "referencedBy": [ "abstracts/variables/breadcrumb", "base/breadcrumb" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-breadcrumb-font-size", "referencedBy": [], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-btn-gap", "referencedBy": [ "base/buttons" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-columns", "referencedBy": [ "base/tables" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-cyan-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-cyan-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-cyan-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-datepicker-font-size", "referencedBy": [ "components/d-datepicker" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-datepicker-text-color", "referencedBy": [ "components/d-datepicker" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-focus-ring-blur", "referencedBy": [ "abstracts/variables/+import" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-focus-ring-x", "referencedBy": [], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-focus-ring-y", "referencedBy": [], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-font-size-sm", "referencedBy": [ "abstracts/variables/+import", "abstracts/variables/buttons", "abstracts/variables/forms", "abstracts/variables/input-phone", "abstracts/variables/tooltip", "abstracts/variables/typography", "base/buttons", "base/tooltip" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-form-control-component-text-align", "referencedBy": [ "base/form-control" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-form-range-component-value", "referencedBy": [ "base/form-range" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-fs-body-tiny", "referencedBy": [ "components/d-stepper-desktop", "components/d-stepper-mobile" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-fs-sm", "referencedBy": [ "abstracts/variables/datepicker", "abstracts/variables/input-phone", "abstracts/variables/progress", "abstracts/variables/tooltip", "abstracts/variables/typography", "base/badge", "components/d-table-head", "components/d-timeline", "root/root" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-gap", "referencedBy": [ "abstracts/variables/alerts", "abstracts/variables/badges", "abstracts/variables/box-file", "abstracts/variables/buttons", "abstracts/variables/chips", "abstracts/variables/collapse-icon-text", "abstracts/variables/datepicker", "abstracts/variables/modals", "abstracts/variables/navs", "abstracts/variables/offcanvas", "abstracts/variables/skeleton", "base/alert", "base/badge", "base/buttons", "base/collapse", "base/form-check", "base/label", "base/list-group", "base/pagination", "base/toast", "components/d-box-file", "components/d-card-account", "components/d-carousel", "components/d-chip", "components/d-confirm-modal", "components/d-data-state-wrapper", "components/d-datepicker", "components/d-error-boundary", "components/d-input-pin", "components/d-modal", "components/d-offcanvas", "components/d-otp", "components/d-password-strength-meter", "components/d-select", "components/d-skeleton", "components/d-stepper-desktop", "components/d-stepper-mobile", "components/d-voucher" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-green-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-green-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-green-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-highlight-color", "referencedBy": [], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-icon-component-loading-duration", "referencedBy": [ "components/d-icon" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-icon-link-transform", "referencedBy": [], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-indigo-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-indigo-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-indigo-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-input-currency-component-symbol-color", "referencedBy": [ "components/d-input-currency" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-orange-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-orange-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-orange-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-pink-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-pink-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-pink-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-popover-component-min-width", "referencedBy": [ "components/d-popover" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-purple-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-purple-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-purple-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-red-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-red-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-red-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-ref-fs-6", "referencedBy": [ "components/d-credit-card" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-rows", "referencedBy": [ "abstracts/variables/typography", "base/list-group", "base/tables", "components/d-carousel" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-scroll-height", "referencedBy": [], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-teal-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-teal-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-teal-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-toast-icon-color", "referencedBy": [ "base/toast" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-transparent", "referencedBy": [ "abstracts/mixins", "abstracts/variables/+import", "abstracts/variables/buttons", "abstracts/variables/cards", "abstracts/variables/forms", "abstracts/variables/input-phone", "abstracts/variables/list-group", "abstracts/variables/modals", "abstracts/variables/pagination", "abstracts/variables/tables", "base/backdrop", "base/buttons", "base/collapse", "base/list-group", "base/nav", "base/tables", "components/d-chip", "components/d-close", "components/d-credit-card", "components/d-datepicker", "components/d-input-phone", "components/d-input-pin", "components/d-select", "components/d-stepper-desktop", "components/d-table-head", "root/root", "shame" ], "suspected": true, "note": "Referenced but not defined anywhere. May be a theme slot, a Bootstrap runtime/utility var (set at the usage site), or a dead reference. Check referencedBy." }, { "cssVar": "--bs-yellow-bg-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-yellow-border-subtle", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." }, { "cssVar": "--bs-yellow-text-emphasis", "referencedBy": [], "suspected": false, "note": "Family-hue semantic follower not defined by Dynamic (only the 8 theme colors have it). The consumer can define it if they use these utility classes." } ], "denylist": [], "denylistNote": "Malformed refs (double prefix --bs-bs- or leading dash --bs--). These are source typos, not slots. Known: --bs---bs-ref-spacer-4 (_d-carousel.scss:53), --bs-bs-gray-400 (_forms.scss:3). Report as separate CSS bugs." }, "gaps": { "secondary": { "state": "broken-ramp", "overridable": "manual-only", "monotonic": false, "detail": "Non-monotonic ramp: the role anchor (--bs-secondary-rgb = gray-800) and the special -500 case (alias of the base) inject a dark tone into the middle of the ramp, so -500 ends up darker than -600/-700. Overriding the base does NOT fix the ramp shape.", "workaround": "The agent either (1) overrides the 10 leaves by hand with a coherent ramp, or (2) treats secondary as not rebrandable via override. Do NOT expect overriding the base to fix the ramp.", "horizon": "To be fixed in a future version (role-anchor refactor). Not available in this version (see dynamicUi)." }, "icons-data-uri": { "state": "not-overridable-by-color", "overridable": "replace-whole-variable", "vars": [ "--bs-form-feedback-icon-valid", "--bs-form-feedback-icon-invalid", "--bs-default-accordion-btn-icon", "--bs-default-accordion-btn-active-icon" ], "detail": "The color is baked into the data-URI SVG. Overriding the color role (--bs-success/--bs-danger/...) does NOT recolor them.", "workaround": "The agent CAN replace the whole variable with a new data-URI that bakes in the new color." }, "tracking": { "state": "not-tokenized", "detail": "There is no brand letter-spacing token." }, "shadow": { "state": "partial", "detail": "Only --bs-box-shadow-lg is a Dynamic-owned override; the rest inherit Bootstrap." } }, "componentTokens": { "status": "deferred", "deferredCount": 703, "note": "Layer 3 (--bs-{component}-{prop}, e.g. --bs-btn-bg, --bs-card-bg) is NOT enumerated in this version (see dynamicUi). Pattern for the agent: override them in the component selector, not in :root. To theme a specific component, inspect its --bs-{comp}-* vars in the component CSS and override them scoped. Full enumeration: candidate for a future minor." } }