PolarisTokens
| Token name | Current value | Figma usage | Description | |
|---|---|---|---|---|
--p-color-border-inverse-active | rgba(227, 227, 227, 1) | - | — | |
--p-color-border-inverse-hover | rgba(204, 204, 204, 1) | - | — | |
--p-color-border-warning | rgba(255, 200, 121, 1) | - | — | |
--p-color-checkbox-icon-disabled | rgba(255, 255, 255, 1) | - | — | |
--p-color-checkbox-bg-surface-disabled | rgba(0, 0, 0, 0.08) | - | — | |
--p-color-bg-fill-active | rgba(247, 247, 247, 1) | - | — | |
--p-color-bg-fill-brand-selected | rgba(48, 48, 48, 1) | - | — | |
--p-color-bg-fill-caution-active | rgba(225, 203, 0, 1) | - | — | |
--p-color-bg-fill-caution-hover | rgba(234, 211, 0, 1) | - | — | |
--p-color-bg-fill-critical-selected | rgba(142, 31, 11, 1) | - | — | |
--p-color-bg-fill-emphasis-active | rgba(0, 46, 106, 1) | - | — | |
--p-color-bg-fill-emphasis-hover | rgba(0, 66, 153, 1) | - | — | |
--p-color-bg-fill-emphasis | rgba(0, 91, 211, 1) | - | — | |
--p-color-bg-fill-hover | rgba(250, 250, 250, 1) | - | — | |
--p-color-bg-fill-info-active | rgba(0, 148, 213, 1) | - | — | |
--p-color-bg-fill-info-hover | rgba(81, 192, 255, 1) | - | — | |
--p-color-bg-fill-secondary-active | rgba(227, 227, 227, 1) | - | — | |
--p-color-bg-fill-secondary-hover | rgba(235, 235, 235, 1) | - | — | |
--p-color-bg-fill-selected | rgba(204, 204, 204, 1) | - | — | |
--p-color-bg-fill-transparent-secondary-active | rgba(0, 0, 0, 0.11) | - | — | |
--p-color-bg-fill-transparent-secondary-hover | rgba(0, 0, 0, 0.08) | - | — | |
--p-color-bg-fill-transparent-selected | rgba(0, 0, 0, 0.06) | - | — | |
--p-color-bg-fill-transparent | rgba(0, 0, 0, 0) | - | — | |
--p-color-bg-fill-warning-active | rgba(178, 132, 0, 1) | - | — | |
--p-color-bg-fill-warning-hover | rgba(229, 165, 0, 1) | - | — | |
--p-color-bg-fill | rgba(255, 255, 255, 1) | - | — | |
--p-color-icon-secondary-active | rgba(74, 74, 74, 1) | - | — | |
--p-color-icon-secondary-hover | rgba(97, 97, 97, 1) | - | — | |
--p-color-text-link-active | rgba(0, 46, 106, 1) | - | — | |
--p-color-text-link-hover | rgba(0, 66, 153, 1) | - | — | |
--p-color-text-link | rgba(0, 91, 211, 1) | - | — | |
--p-color-nav-bg | rgba(235, 235, 235, 1) | - | — | |
--p-color-nav-bg-surface-active | rgba(250, 250, 250, 1) | - | — | |
--p-color-nav-bg-surface-hover | rgba(241, 241, 241, 1) | - | — | |
--p-color-nav-bg-surface-selected | rgba(250, 250, 250, 1) | - | — | |
--p-color-nav-bg-surface | rgba(0, 0, 0, 0.02) | - | — | |
--p-color-radio-button-icon-disabled | rgba(255, 255, 255, 1) | - | — | |
--p-color-radio-button-bg-surface-disabled | rgba(0, 0, 0, 0.08) | - | — | |
--p-color-bg-surface-emphasis-active | rgba(226, 231, 255, 1) | - | — | |
--p-color-bg-surface-emphasis-hover | rgba(234, 237, 255, 1) | - | — | |
--p-color-bg-surface-emphasis | rgba(240, 242, 255, 1) | - | — | |
--p-color-bg-surface-inverse | rgba(48, 48, 48, 1) | - | — | |
--p-color-bg-surface-magic-active | rgba(228, 222, 255, 1) | - | — | |
--p-color-bg-surface-secondary-selected | rgba(235, 235, 235, 1) | - | — | |
--p-color-bg-surface-tertiary-active | rgba(227, 227, 227, 1) | - | — | |
--p-color-bg-surface-tertiary-hover | rgba(235, 235, 235, 1) | - | — | |
--p-color-bg-surface-warning-active | rgba(255, 228, 198, 1) | - | — | |
--p-color-bg-surface-warning-hover | rgba(255, 235, 213, 1) | - | — | |
--p-color-text-brand-on-bg-fill-active | rgba(204, 204, 204, 1) | - | — | |
--p-color-text-brand-on-bg-fill-disabled | rgba(255, 255, 255, 1) | - | — | |
--p-color-text-brand-on-bg-fill-hover | rgba(227, 227, 227, 1) | - | — | |
--p-color-text-brand-on-bg-fill | rgba(255, 255, 255, 1) | - | — | |
--p-color-text-caution-active | rgba(31, 28, 0, 1) | - | — | |
--p-color-text-caution-hover | rgba(51, 46, 0, 1) | - | — | |
--p-color-text-caution-on-bg-fill | rgba(51, 46, 0, 1) | - | — | |
--p-color-text-critical-on-bg-fill | rgba(255, 251, 251, 1) | - | — | |
--p-color-text-emphasis-on-bg-fill-active | rgba(213, 220, 255, 1) | - | — | |
--p-color-text-emphasis-on-bg-fill-hover | rgba(226, 231, 255, 1) | - | — | |
--p-color-text-emphasis-on-bg-fill | rgba(252, 253, 255, 1) | - | — | |
--p-color-text-info-active | rgba(0, 33, 51, 1) | - | — | |
--p-color-text-info-hover | rgba(0, 58, 90, 1) | - | — | |
--p-color-text-magic-on-bg-fill | rgba(253, 253, 255, 1) | - | — | |
--p-color-text-success-active | rgba(9, 42, 27, 1) | - | — | |
--p-color-text-success-hover | rgba(8, 61, 37, 1) | - | — | |
--p-color-text-success-on-bg-fill | rgba(248, 255, 251, 1) | - | — | |
--p-color-text-warning-active | rgba(37, 26, 0, 1) | - | — | |
--p-color-text-warning-hover | rgba(65, 45, 0, 1) | - | — | |
--p-color-text-warning-on-bg-fill | rgba(37, 26, 0, 1) | - | — | |
--p-color-video-thumbnail-play-button-bg-fill-hover | rgba(0, 0, 0, 0.81) | - | — | |
--p-color-video-thumbnail-play-button-bg-fill | rgba(0, 0, 0, 0.71) | - | — | |
--p-color-video-thumbnail-play-button-text-on-bg-fill | rgba(255, 255, 255, 1) | - | — | |
--p-color-bg-surface | var(--p-color-bg) | — | — | |
--p-color-bg-surface-hover | rgba(247, 247, 247, 1) | - | — | |
--p-color-bg-surface-active | rgba(243, 243, 243, 1) | - | — | |
--p-color-bg-surface-disabled | rgba(0, 0, 0, 0.05) | - | — | |
--p-color-bg-surface-secondary | var(--p-color-bg-subdued) | — | — | |
--p-color-bg-surface-secondary-hover | var(--p-color-bg-subdued-hover) | — | — | |
--p-color-bg-surface-secondary-active | var(--p-color-bg-subdued-active) | — | — | |
--p-color-bg-surface-tertiary | var(--p-color-bg-secondary-experimental) | — | — | |
--p-color-bg-fill-tertiary | var(--p-color-bg-strong) | — | — | |
--p-color-bg-fill-tertiary-hover | var(--p-color-bg-strong-hover) | — | — | |
--p-color-bg-fill-tertiary-active | var(--p-color-bg-strong-active) | — | — | |
--p-color-input-bg-surface | var(--p-color-bg-input) | — | — | |
--p-color-input-bg-surface-hover | var(--p-color-bg-input-hover-experimental) | — | — | |
--p-color-input-bg-surface-active | var(--p-color-bg-input-active-experimental) | — | — | |
--p-color-bg-fill-brand | rgba(48, 48, 48, 1) | - | — | |
--p-color-bg-fill-brand-hover | rgba(26, 26, 26, 1) | - | — | |
--p-color-bg-fill-brand-active | rgba(26, 26, 26, 1) | - | — | |
--p-color-bg-surface-brand | rgba(227, 227, 227, 1) | - | — | |
--p-color-bg-surface-brand-hover | rgba(235, 235, 235, 1) | - | — | |
--p-color-bg-surface-brand-active | rgba(241, 241, 241, 1) | - | — | |
--p-color-bg-surface-brand-selected | rgba(241, 241, 241, 1) | - | — | |
--p-color-bg-surface-selected | var(--p-color-bg-app-selected) | — | — | |
--p-color-bg-fill-success | var(--p-color-bg-success-strong) | — | — | |
--p-color-bg-fill-success-hover | var(--p-color-bg-success-strong-hover-experimental) | — | — | |
--p-color-bg-fill-success-active | var(--p-color-bg-success-strong-active-experimental) | — | — | |
--p-color-bg-fill-success-secondary | var(--p-color-bg-success) | — | — | |
--p-color-bg-surface-success | var(--p-color-bg-success-subdued) | — | — | |
--p-color-bg-surface-success-hover | var(--p-color-bg-success-subdued-hover) | — | — | |
--p-color-bg-surface-success-active | var(--p-color-bg-success-subdued-active) | — | — | |
--p-color-bg-fill-critical | var(--p-color-bg-critical-strong) | — | — | |
--p-color-bg-fill-critical-hover | var(--p-color-bg-critical-strong-hover) | — | — | |
--p-color-bg-fill-critical-active | var(--p-color-bg-critical-strong-active) | — | — | |
--p-color-bg-fill-critical-secondary | var(--p-color-bg-critical) | — | — | |
--p-color-bg-surface-critical | var(--p-color-bg-critical-subdued) | — | — | |
--p-color-bg-surface-critical-hover | var(--p-color-bg-critical-subdued-hover) | — | — | |
--p-color-bg-surface-critical-active | var(--p-color-bg-critical-subdued-active) | — | — | |
--p-color-bg-fill-caution | var(--p-color-bg-caution-strong) | — | — | |
--p-color-bg-fill-caution-secondary | var(--p-color-bg-caution) | — | — | |
--p-color-bg-surface-caution | var(--p-color-bg-caution-subdued) | — | — | |
--p-color-bg-surface-caution-hover | var(--p-color-bg-caution-subdued-hover) | — | — | |
--p-color-bg-surface-caution-active | var(--p-color-bg-caution-subdued-active) | — | — | |
--p-color-bg-fill-info | var(--p-color-bg-info-strong) | — | — | |
--p-color-bg-fill-info-secondary | var(--p-color-bg-info) | — | — | |
--p-color-bg-surface-info | var(--p-color-bg-info-subdued) | — | — | |
--p-color-bg-surface-info-hover | var(--p-color-bg-info-subdued-hover) | — | — | |
--p-color-bg-surface-info-active | var(--p-color-bg-info-subdued-active) | — | — | |
--p-color-bg-fill-warning | var(--p-color-bg-warning-strong-experimental) | — | — | |
--p-color-bg-fill-warning-secondary | var(--p-color-bg-warning) | — | — | |
--p-color-bg-surface-warning | var(--p-color-bg-warning-subdued-experimental) | — | — | |
--p-color-bg-fill-magic | var(--p-color-bg-magic-strong) | — | — | |
--p-color-bg-fill-magic-secondary | var(--p-color-bg-magic) | — | — | |
--p-color-bg-fill-magic-secondary-hover | var(--p-color-bg-magic-hover) | — | — | |
--p-color-bg-fill-magic-secondary-active | var(--p-color-bg-magic-active) | — | — | |
--p-color-bg-surface-magic | rgba(243, 241, 255, 1) | - | — | |
--p-color-bg-surface-magic-hover | var(--p-color-bg-magic-subdued-hover) | — | — | |
--p-color-bg-fill-secondary | var(--p-color-bg-inset) | — | — | |
--p-color-bg-fill-inverse | var(--p-color-bg-inset-strong) | — | — | |
--p-color-bg-fill-inverse-hover | var(--p-color-bg-inverse-hover) | — | — | |
--p-color-bg-fill-inverse-active | var(--p-color-bg-inverse-active) | — | — | |
--p-color-bg-surface-transparent | var(--p-color-bg-transparent-experimental) | — | — | |
--p-color-bg-fill-transparent-hover | var(--p-color-bg-transparent-hover-experimental) | — | — | |
--p-color-bg-fill-transparent-active | var(--p-color-bg-transparent-active-experimental) | — | — | |
--p-color-bg-fill-disabled | var(--p-color-bg-transparent-disabled-experimental) | — | — | |
--p-color-bg-fill-transparent-secondary | var(--p-color-bg-transparent-subdued-experimental) | — | — | |
--p-color-bg-fill-brand-disabled | var(--p-color-bg-transparent-primary-disabled-experimental) | — | — | |
--p-color-backdrop-bg | var(--p-color-bg-backdrop-experimental) | — | — | |
--p-color-avatar-bg-fill | var(--p-color-avatar-background-experimental) | — | — | |
--p-color-avatar-one-bg-fill | var(--p-color-avatar-style-one-background-experimental) | — | — | |
--p-color-avatar-two-bg-fill | var(--p-color-avatar-style-two-background-experimental) | — | — | |
--p-color-avatar-three-bg-fill | var(--p-color-avatar-style-three-background-experimental) | — | — | |
--p-color-avatar-four-bg-fill | var(--p-color-avatar-style-four-background-experimental) | — | — | |
--p-color-avatar-five-bg-fill | var(--p-color-avatar-style-five-background-experimental) | — | — | |
--p-color-text-secondary | var(--p-color-text-subdued) | — | — | |
--p-color-text-emphasis | var(--p-color-text-interactive) | — | — | |
--p-color-text-emphasis-hover | var(--p-color-text-interactive-hover) | — | — | |
--p-color-text-emphasis-active | var(--p-color-text-interactive-active) | — | — | |
--p-color-text-brand | var(--p-color-text-primary) | — | — | |
--p-color-text-brand-hover | var(--p-color-text-primary-hover) | — | — | |
--p-color-text-critical-hover | rgba(95, 21, 7, 1) | - | — | |
--p-color-text-info-on-bg-fill | var(--p-color-text-info-strong) | — | — | |
--p-color-text-warning | rgba(94, 66, 0, 1) | - | — | |
--p-color-text-inverse-secondary | var(--p-color-text-inverse-subdued) | — | — | |
--p-color-text-link-inverse | rgba(197, 208, 255, 1) | - | — | |
--p-color-avatar-text-on-bg-fill | var(--p-color-avatar-color-experimental) | — | — | |
--p-color-avatar-one-text-on-bg-fill | var(--p-color-avatar-style-one-color-experimental) | — | — | |
--p-color-avatar-two-text-on-bg-fill | var(--p-color-avatar-style-two-color-experimental) | — | — | |
--p-color-avatar-three-text-on-bg-fill | var(--p-color-avatar-style-three-color-experimental) | — | — | |
--p-color-avatar-four-text-on-bg-fill | var(--p-color-avatar-style-four-color-experimental) | — | — | |
--p-color-avatar-five-text-on-bg-fill | var(--p-color-avatar-style-five-color-experimental) | — | — | |
--p-color-icon-secondary | var(--p-color-icon-subdued) | — | — | |
--p-color-icon-emphasis | var(--p-color-icon-interactive) | — | — | |
--p-color-icon-emphasis-hover | var(--p-color-icon-interactive-hover) | — | — | |
--p-color-icon-emphasis-active | var(--p-color-icon-interactive-active) | — | — | |
--p-color-icon-brand | var(--p-color-icon-primary) | — | — | |
--p-color-border-secondary | var(--p-color-border-subdued) | — | — | |
--p-color-border-tertiary | rgba(204, 204, 204, 1) | - | — | |
--p-color-input-border | var(--p-color-border-input) | — | — | |
--p-color-input-border-hover | var(--p-color-border-input-hover) | — | — | |
--p-color-input-border-active | var(--p-color-border-input-active-experimental) | — | — | |
--p-color-border-emphasis | rgba(0, 91, 211, 1) | - | — | |
--p-color-border-emphasis-hover | var(--p-color-border-interactive-hover) | — | — | |
--p-color-border-emphasis-active | var(--p-color-border-interactive-active) | — | — | |
--p-color-border-focus | var(--p-color-border-interactive-focus) | — | — | |
--p-color-border-brand | var(--p-color-border-primary) | — | — | |
--p-color-border-critical-secondary | var(--p-color-border-critical-strong-experimental) | — | — | |
--p-color-border-magic-secondary | var(--p-color-border-magic-strong) | — | — | |
--p-color-bg-inverse | rgba(31, 33, 36, 1) | - | — | |
--p-color-bg-inset-strong | rgba(97, 106, 117, 1) | - | — | |
--p-color-bg-inverse-hover | rgba(97, 106, 117, 1) | - | — | |
--p-color-bg-inverse-active | rgba(135, 144, 155, 1) | - | — | |
--p-color-bg-strong-hover | rgba(202, 206, 211, 1) | - | — | |
--p-color-bg-strong-active | rgba(202, 206, 211, 1) | - | — | |
--p-color-bg-strong | rgba(221, 224, 228, 1) | - | — | |
--p-color-bg-subdued-active | rgba(235, 236, 239, 1) | - | — | |
--p-color-bg-disabled | rgba(235, 236, 239, 1) | - | — | |
--p-color-bg-interactive-disabled | rgba(235, 236, 239, 1) | - | — | |
--p-color-bg-app | rgba(241, 242, 244, 1) | - | — | |
--p-color-bg-app-active | rgba(221, 224, 228, 1) | - | — | |
--p-color-bg-app-hover | rgba(235, 236, 239, 1) | - | — | |
--p-color-bg-app-selected | rgba(235, 236, 239, 1) | - | — | |
--p-color-bg-active | rgba(235, 236, 239, 1) | - | — | |
--p-color-bg-subdued-hover | rgba(241, 242, 244, 1) | - | — | |
--p-color-bg-inset | rgba(241, 242, 244, 1) | - | — | |
--p-color-bg-hover | rgba(241, 242, 244, 1) | - | — | |
--p-color-bg-subdued | rgba(249, 250, 251, 1) | - | — | |
--p-color-bg-input | rgba(255, 255, 255, 1) | - | — | |
--p-color-bg | rgba(255, 255, 255, 1) | - | — | |
--p-color-bg-primary-active | rgba(12, 59, 47, 1) | - | — | |
--p-color-bg-primary-hover | rgba(18, 84, 67, 1) | - | — | |
--p-color-bg-primary | rgba(0, 122, 92, 1) | - | — | |
--p-color-bg-success-strong | rgba(22, 166, 121, 1) | - | — | |
--p-color-bg-success | rgba(161, 237, 208, 1) | - | — | |
--p-color-bg-primary-subdued-active | rgba(192, 242, 221, 1) | - | — | |
--p-color-bg-success-subdued-active | rgba(192, 242, 221, 1) | - | — | |
--p-color-bg-success-subdued | rgba(224, 248, 238, 1) | - | — | |
--p-color-bg-primary-subdued-hover | rgba(224, 248, 238, 1) | - | — | |
--p-color-bg-success-subdued-hover | rgba(240, 253, 248, 1) | - | — | |
--p-color-bg-primary-subdued | rgba(240, 253, 248, 1) | - | — | |
--p-color-bg-primary-subdued-selected | rgba(240, 253, 248, 1) | - | — | |
--p-color-bg-critical-strong-active | rgba(115, 24, 7, 1) | - | — | |
--p-color-bg-critical-strong-hover | rgba(159, 32, 10, 1) | - | — | |
--p-color-bg-critical-strong | rgba(197, 40, 12, 1) | - | — | |
--p-color-bg-critical-subdued-active | rgba(251, 197, 188, 1) | - | — | |
--p-color-bg-critical | rgba(251, 197, 188, 1) | - | — | |
--p-color-bg-critical-subdued | rgba(253, 226, 221, 1) | - | — | |
--p-color-bg-critical-subdued-hover | rgba(254, 243, 241, 1) | - | — | |
--p-color-bg-caution-strong | rgba(216, 155, 13, 1) | - | — | |
--p-color-bg-caution | rgba(248, 217, 144, 1) | - | — | |
--p-color-bg-caution-subdued-active | rgba(250, 229, 178, 1) | - | — | |
--p-color-bg-caution-subdued | rgba(252, 240, 212, 1) | - | — | |
--p-color-bg-caution-subdued-hover | rgba(254, 248, 236, 1) | - | — | |
--p-color-bg-info-strong | rgba(42, 172, 187, 1) | - | — | |
--p-color-bg-info-subdued-active | rgba(184, 233, 239, 1) | - | — | |
--p-color-bg-info | rgba(184, 233, 239, 1) | - | — | |
--p-color-bg-info-subdued | rgba(222, 245, 247, 1) | - | — | |
--p-color-bg-info-subdued-hover | rgba(238, 250, 251, 1) | - | — | |
--p-color-bg-interactive-active | rgba(14, 53, 108, 1) | - | — | |
--p-color-bg-interactive-hover | rgba(20, 73, 149, 1) | - | — | |
--p-color-bg-interactive | rgba(36, 99, 188, 1) | - | — | |
--p-color-bg-interactive-subdued-active | rgba(187, 212, 247, 1) | - | — | |
--p-color-bg-interactive-subdued-hover | rgba(232, 240, 253, 1) | - | — | |
--p-color-bg-interactive-subdued | rgba(240, 245, 253, 1) | - | — | |
--p-color-bg-interactive-selected | rgba(240, 245, 253, 1) | - | — | |
--p-color-bg-warning | rgba(250, 201, 168, 1) | - | — | |
--p-color-bg-magic-strong | rgba(121, 69, 227, 1) | - | — | |
--p-color-bg-magic-hover | rgba(226, 214, 250, 1) | - | — | |
--p-color-bg-magic-active | rgba(203, 180, 248, 1) | - | — | |
--p-color-bg-magic | rgba(236, 227, 253, 1) | - | — | |
--p-color-bg-magic-subdued-hover | rgba(236, 227, 253, 1) | - | — | |
--p-color-bg-magic-subdued-active | rgba(226, 214, 250, 1) | - | — | |
--p-color-bg-magic-subdued | rgba(242, 237, 253, 1) | - | — | |
--p-color-border-input-hover | rgba(97, 106, 117, 1) | - | — | |
--p-color-border-inverse | rgba(97, 106, 117, 1) | - | — | |
--p-color-border-strong-hover | rgba(135, 144, 155, 1) | - | — | |
--p-color-border-input | rgba(171, 177, 186, 1) | - | — | |
--p-color-border-hover | rgba(171, 177, 186, 1) | - | — | |
--p-color-border-strong | rgba(171, 177, 186, 1) | - | — | |
--p-color-border | rgba(202, 206, 211, 1) | - | — | |
--p-color-border-disabled | rgba(221, 224, 228, 1) | - | — | |
--p-color-border-subdued | rgba(221, 224, 228, 1) | - | — | |
--p-color-border-interactive-disabled | rgba(221, 224, 228, 1) | - | — | |
--p-color-border-primary | rgba(0, 122, 92, 1) | - | — | |
--p-color-border-success | rgba(22, 166, 121, 1) | - | — | |
--p-color-border-success-subdued | rgba(80, 220, 169, 1) | - | — | |
--p-color-border-critical-active | rgba(67, 14, 4, 1) | - | — | |
--p-color-border-critical-hover | rgba(115, 24, 7, 1) | - | — | |
--p-color-border-critical | rgba(197, 40, 12, 1) | - | — | |
--p-color-border-critical-subdued | rgba(245, 107, 82, 1) | - | — | |
--p-color-border-caution | rgba(216, 155, 13, 1) | - | — | |
--p-color-border-caution-subdued | rgba(245, 196, 82, 1) | - | — | |
--p-color-border-info | rgba(59, 195, 211, 1) | - | — | |
--p-color-border-info-subdued | rgba(109, 211, 222, 1) | - | — | |
--p-color-border-interactive-active | rgba(14, 53, 108, 1) | - | — | |
--p-color-border-interactive-hover | rgba(20, 73, 149, 1) | - | — | |
--p-color-border-interactive | rgba(62, 125, 213, 1) | - | — | |
--p-color-border-interactive-focus | rgba(62, 125, 213, 1) | - | — | |
--p-color-border-interactive-subdued | rgba(187, 212, 247, 1) | - | — | |
--p-color-border-magic-strong | rgba(121, 69, 227, 1) | - | — | |
--p-color-border-magic | rgba(173, 139, 241, 1) | - | — | |
--p-color-icon-hover | rgba(31, 33, 36, 1) | - | — | |
--p-color-icon | rgba(97, 106, 117, 1) | - | — | |
--p-color-icon-active | rgba(31, 33, 36, 1) | - | — | |
--p-color-icon-subdued | rgba(135, 144, 155, 1) | - | — | |
--p-color-icon-disabled | rgba(171, 177, 186, 1) | - | — | |
--p-color-icon-interactive-disabled | rgba(171, 177, 186, 1) | - | — | |
--p-color-icon-inverse | rgba(221, 224, 228, 1) | - | — | |
--p-color-icon-on-color | rgba(255, 255, 255, 1) | - | — | |
--p-color-icon-primary | rgba(0, 122, 92, 1) | - | — | |
--p-color-icon-success | rgba(22, 166, 121, 1) | - | — | |
--p-color-icon-critical | rgba(197, 40, 12, 1) | - | — | |
--p-color-icon-caution | rgba(183, 126, 11, 1) | - | — | |
--p-color-icon-info | rgba(42, 172, 187, 1) | - | — | |
--p-color-icon-warning | rgba(242, 117, 34, 1) | - | — | |
--p-color-icon-interactive-active | rgba(14, 53, 108, 1) | - | — | |
--p-color-icon-interactive-hover | rgba(20, 73, 149, 1) | - | — | |
--p-color-icon-interactive | rgba(36, 99, 188, 1) | - | — | |
--p-color-icon-interactive-inverse | rgba(102, 153, 225, 1) | - | — | |
--p-color-icon-magic | rgba(121, 69, 227, 1) | - | — | |
--p-color-text | rgba(31, 33, 36, 1) | - | — | |
--p-color-text-subdued | rgba(97, 106, 117, 1) | - | — | |
--p-color-text-disabled | rgba(135, 144, 155, 1) | - | — | |
--p-color-text-interactive-disabled | rgba(135, 144, 155, 1) | - | — | |
--p-color-text-inverse-subdued | rgba(171, 177, 186, 1) | - | — | |
--p-color-text-inverse | rgba(241, 242, 244, 1) | - | — | |
--p-color-text-on-color | rgba(255, 255, 255, 1) | - | — | |
--p-color-text-success-strong | rgba(12, 59, 47, 1) | - | — | |
--p-color-text-success | rgba(0, 122, 92, 1) | - | — | |
--p-color-text-primary | rgba(0, 122, 92, 1) | - | — | |
--p-color-text-primary-hover | rgba(18, 84, 67, 1) | - | — | |
--p-color-text-critical-strong | rgba(67, 14, 4, 1) | - | — | |
--p-color-text-critical-active | rgba(115, 24, 7, 1) | - | — | |
--p-color-text-critical | rgba(197, 40, 12, 1) | - | — | |
--p-color-text-caution-strong | rgba(77, 46, 5, 1) | - | — | |
--p-color-text-caution | rgba(135, 92, 8, 1) | - | — | |
--p-color-text-info-strong | rgba(16, 65, 71, 1) | - | — | |
--p-color-text-info | rgba(32, 130, 141, 1) | - | — | |
--p-color-text-warning-strong | rgba(77, 36, 5, 1) | - | — | |
--p-color-text-interactive-active | rgba(14, 53, 108, 1) | - | — | |
--p-color-text-interactive-hover | rgba(20, 73, 149, 1) | - | — | |
--p-color-text-interactive | rgba(36, 99, 188, 1) | - | — | |
--p-color-text-interactive-inverse | rgba(102, 153, 225, 1) | - | — | |
--p-color-text-magic-strong | rgba(49, 13, 120, 1) | - | — | |
--p-color-text-magic | rgba(90, 36, 205, 1) | - | — |