These variables are used in Amplify UI. You can override these values to update the look and feel.
| Amplify CSS Variable | Default Value |
|---|---|
| --amplify-border-widths-large | 3px |
| --amplify-border-widths-medium | 2px |
| --amplify-border-widths-small | 1px |
| --amplify-colors-background-disabled | var(--amplify-colors-background-tertiary) |
| --amplify-colors-background-error | var(--amplify-colors-red-10) |
| --amplify-colors-background-info | var(--amplify-colors-blue-10) |
| --amplify-colors-background-primary | var(--amplify-colors-white) |
| --amplify-colors-background-quaternary | var(--amplify-colors-neutral-60) |
| --amplify-colors-background-secondary | var(--amplify-colors-neutral-10) |
| --amplify-colors-background-success | var(--amplify-colors-green-10) |
| --amplify-colors-background-tertiary | var(--amplify-colors-neutral-20) |
| --amplify-colors-background-warning | var(--amplify-colors-orange-10) |
| --amplify-colors-black | hsl(0, 0%, 0%) |
| --amplify-colors-blue-10 | hsl(220, 95%, 95%) |
| --amplify-colors-blue-100 | hsl(220, 100%, 15%) |
| --amplify-colors-blue-20 | hsl(220, 85%, 85%) |
| --amplify-colors-blue-40 | hsl(220, 70%, 70%) |
| --amplify-colors-blue-60 | hsl(220, 50%, 50%) |
| --amplify-colors-blue-80 | hsl(220, 95%, 30%) |
| --amplify-colors-blue-90 | hsl(220, 100%, 20%) |
| --amplify-colors-border-disabled | var(--amplify-colors-border-tertiary) |
| --amplify-colors-border-error | var(--amplify-colors-red-80) |
| --amplify-colors-border-focus | var(--amplify-colors-primary-100) |
| --amplify-colors-border-info | var(--amplify-colors-blue-80) |
| --amplify-colors-border-pressed | var(--amplify-colors-primary-100) |
| --amplify-colors-border-primary | var(--amplify-colors-neutral-60) |
| --amplify-colors-border-secondary | var(--amplify-colors-neutral-40) |
| --amplify-colors-border-success | var(--amplify-colors-green-80) |
| --amplify-colors-border-tertiary | var(--amplify-colors-neutral-20) |
| --amplify-colors-border-warning | var(--amplify-colors-orange-80) |
| --amplify-colors-font-active | var(--amplify-colors-primary-100) |
| --amplify-colors-font-disabled | var(--amplify-colors-neutral-60) |
| --amplify-colors-font-error | var(--amplify-colors-red-90) |
| --amplify-colors-font-focus | var(--amplify-colors-primary-100) |
| --amplify-colors-font-hover | var(--amplify-colors-primary-90) |
| --amplify-colors-font-info | var(--amplify-colors-blue-90) |
| --amplify-colors-font-interactive | var(--amplify-colors-primary-80) |
| --amplify-colors-font-inverse | var(--amplify-colors-white) |
| --amplify-colors-font-primary | var(--amplify-colors-neutral-100) |
| --amplify-colors-font-secondary | var(--amplify-colors-neutral-90) |
| --amplify-colors-font-success | var(--amplify-colors-green-90) |
| --amplify-colors-font-tertiary | var(--amplify-colors-neutral-80) |
| --amplify-colors-font-warning | var(--amplify-colors-orange-90) |
| --amplify-colors-green-10 | hsl(130, 60%, 95%) |
| --amplify-colors-green-100 | hsl(130, 22%, 23%) |
| --amplify-colors-green-20 | hsl(130, 60%, 90%) |
| --amplify-colors-green-40 | hsl(130, 44%, 63%) |
| --amplify-colors-green-60 | hsl(130, 43%, 46%) |
| --amplify-colors-green-80 | hsl(130, 33%, 37%) |
| --amplify-colors-green-90 | hsl(130, 27%, 29%) |
| --amplify-colors-neutral-10 | hsl(210, 5%, 98%) |
| --amplify-colors-neutral-100 | hsl(210, 50%, 10%) |
| --amplify-colors-neutral-20 | hsl(210, 5%, 94%) |
| --amplify-colors-neutral-40 | hsl(210, 5%, 87%) |
| --amplify-colors-neutral-60 | hsl(210, 10%, 58%) |
| --amplify-colors-neutral-80 | hsl(210, 10%, 40%) |
| --amplify-colors-neutral-90 | hsl(210, 25%, 25%) |
| --amplify-colors-orange-10 | hsl(30, 75%, 95%) |
| --amplify-colors-orange-100 | hsl(30, 100%, 15%) |
| --amplify-colors-orange-20 | hsl(30, 75%, 85%) |
| --amplify-colors-orange-40 | hsl(30, 75%, 75%) |
| --amplify-colors-orange-60 | hsl(30, 50%, 50%) |
| --amplify-colors-orange-80 | hsl(30, 95%, 30%) |
| --amplify-colors-orange-90 | hsl(30, 100%, 20%) |
| --amplify-colors-overlay-10 | hsla(0, 0%, 0%, 0.1) |
| --amplify-colors-overlay-20 | hsla(0, 0%, 0%, 0.2) |
| --amplify-colors-overlay-30 | hsla(0, 0%, 0%, 0.3) |
| --amplify-colors-overlay-40 | hsla(0, 0%, 0%, 0.4) |
| --amplify-colors-overlay-5 | hsla(0, 0%, 0%, 0.05) |
| --amplify-colors-overlay-50 | hsla(0, 0%, 0%, 0.5) |
| --amplify-colors-overlay-60 | hsla(0, 0%, 0%, 0.6) |
| --amplify-colors-overlay-70 | hsla(0, 0%, 0%, 0.7) |
| --amplify-colors-overlay-80 | hsla(0, 0%, 0%, 0.8) |
| --amplify-colors-overlay-90 | hsla(0, 0%, 0%, 0.9) |
| --amplify-colors-pink-10 | hsl(340, 95%, 95%) |
| --amplify-colors-pink-100 | hsl(340, 100%, 15%) |
| --amplify-colors-pink-20 | hsl(340, 90%, 85%) |
| --amplify-colors-pink-40 | hsl(340, 70%, 70%) |
| --amplify-colors-pink-60 | hsl(340, 50%, 50%) |
| --amplify-colors-pink-80 | hsl(340, 95%, 30%) |
| --amplify-colors-pink-90 | hsl(340, 100%, 20%) |
| --amplify-colors-primary-10 | var(--amplify-colors-teal-10) |
| --amplify-colors-primary-100 | var(--amplify-colors-teal-100) |
| --amplify-colors-primary-20 | var(--amplify-colors-teal-20) |
| --amplify-colors-primary-40 | var(--amplify-colors-teal-40) |
| --amplify-colors-primary-60 | var(--amplify-colors-teal-60) |
| --amplify-colors-primary-80 | var(--amplify-colors-teal-80) |
| --amplify-colors-primary-90 | var(--amplify-colors-teal-90) |
| --amplify-colors-purple-10 | hsl(300, 95%, 95%) |
| --amplify-colors-purple-100 | hsl(300, 100%, 15%) |
| --amplify-colors-purple-20 | hsl(300, 85%, 85%) |
| --amplify-colors-purple-40 | hsl(300, 70%, 70%) |
| --amplify-colors-purple-60 | hsl(300, 50%, 50%) |
| --amplify-colors-purple-80 | hsl(300, 95%, 30%) |
| --amplify-colors-purple-90 | hsl(300, 100%, 20%) |
| --amplify-colors-red-10 | hsl(0, 75%, 95%) |
| --amplify-colors-red-100 | hsl(0, 100%, 15%) |
| --amplify-colors-red-20 | hsl(0, 75%, 85%) |
| --amplify-colors-red-40 | hsl(0, 75%, 75%) |
| --amplify-colors-red-60 | hsl(0, 50%, 50%) |
| --amplify-colors-red-80 | hsl(0, 95%, 30%) |
| --amplify-colors-red-90 | hsl(0, 100%, 20%) |
| --amplify-colors-secondary-10 | var(--amplify-colors-purple-10) |
| --amplify-colors-secondary-100 | var(--amplify-colors-purple-100) |
| --amplify-colors-secondary-20 | var(--amplify-colors-purple-20) |
| --amplify-colors-secondary-40 | var(--amplify-colors-purple-40) |
| --amplify-colors-secondary-60 | var(--amplify-colors-purple-60) |
| --amplify-colors-secondary-80 | var(--amplify-colors-purple-80) |
| --amplify-colors-secondary-90 | var(--amplify-colors-purple-90) |
| --amplify-colors-shadow-primary | hsla(210, 50%, 10%, 0.25) |
| --amplify-colors-shadow-secondary | hsla(210, 50%, 10%, 0.15) |
| --amplify-colors-shadow-tertiary | hsla(210, 50%, 10%, 0.05) |
| --amplify-colors-teal-10 | hsl(190, 75%, 95%) |
| --amplify-colors-teal-100 | hsl(190, 100%, 15%) |
| --amplify-colors-teal-20 | hsl(190, 75%, 85%) |
| --amplify-colors-teal-40 | hsl(190, 70%, 70%) |
| --amplify-colors-teal-60 | hsl(190, 50%, 50%) |
| --amplify-colors-teal-80 | hsl(190, 95%, 30%) |
| --amplify-colors-teal-90 | hsl(190, 100%, 20%) |
| --amplify-colors-transparent | transparent |
| --amplify-colors-white | hsl(0, 0%, 100%) |
| --amplify-colors-yellow-10 | hsl(60, 75%, 95%) |
| --amplify-colors-yellow-100 | hsl(60, 100%, 15%) |
| --amplify-colors-yellow-20 | hsl(60, 75%, 85%) |
| --amplify-colors-yellow-40 | hsl(60, 75%, 75%) |
| --amplify-colors-yellow-60 | hsl(60, 50%, 50%) |
| --amplify-colors-yellow-80 | hsl(60, 95%, 30%) |
| --amplify-colors-yellow-90 | hsl(60, 100%, 20%) |
| --amplify-components-accordion-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-accordion-item-border-color | var(--amplify-colors-border-secondary) |
| --amplify-components-accordion-item-border-radius | var(--amplify-radii-small) |
| --amplify-components-accordion-item-border-style | solid |
| --amplify-components-accordion-item-border-width | var(--amplify-border-widths-small) |
| --amplify-components-accordion-item-content-color | inherit |
| --amplify-components-accordion-item-content-padding-block-end | var(--amplify-space-small) |
| --amplify-components-accordion-item-content-padding-block-start | var(--amplify-space-xxxs) |
| --amplify-components-accordion-item-content-padding-inline | var(--amplify-space-small) |
| --amplify-components-accordion-item-icon-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-accordion-item-icon-transition-duration | var(--amplify-time-medium) |
| --amplify-components-accordion-item-icon-transition-timing-function | cubic-bezier(0.87, 0, 0.13, 1) |
| --amplify-components-accordion-item-trigger-align-items | center |
| --amplify-components-accordion-item-trigger-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-accordion-item-trigger-color | inherit |
| --amplify-components-accordion-item-trigger-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-accordion-item-trigger-focus-box-shadow | 0 0 0 2px var(--amplify-colors-border-focus) |
| --amplify-components-accordion-item-trigger-gap | var(--amplify-space-small) |
| --amplify-components-accordion-item-trigger-hover-background-color | var(--amplify-colors-overlay-5) |
| --amplify-components-accordion-item-trigger-hover-color | inherit |
| --amplify-components-accordion-item-trigger-justify-content | space-between |
| --amplify-components-accordion-item-trigger-padding-block | var(--amplify-space-xs) |
| --amplify-components-accordion-item-trigger-padding-inline | var(--amplify-space-small) |
| --amplify-components-ai-conversation-attachment-border-color | var(--amplify-colors-border-secondary) |
| --amplify-components-ai-conversation-attachment-border-radius | var(--amplify-radii-small) |
| --amplify-components-ai-conversation-attachment-border-width | var(--amplify-border-widths-small) |
| --amplify-components-ai-conversation-attachment-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-ai-conversation-attachment-gap | var(--amplify-space-xs) |
| --amplify-components-ai-conversation-attachment-image-height | var(--amplify-font-sizes-medium) |
| --amplify-components-ai-conversation-attachment-image-width | var(--amplify-font-sizes-medium) |
| --amplify-components-ai-conversation-attachment-list-gap | var(--amplify-space-xxs) |
| --amplify-components-ai-conversation-attachment-list-padding | var(--amplify-space-xs) |
| --amplify-components-ai-conversation-attachment-list-padding-block-start | 0 |
| --amplify-components-ai-conversation-attachment-name-color | var(--amplify-colors-font-primary) |
| --amplify-components-ai-conversation-attachment-name-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-ai-conversation-attachment-name-font-weight | var(--amplify-font-weights-normal) |
| --amplify-components-ai-conversation-attachment-padding-block | var(--amplify-space-xxxs) |
| --amplify-components-ai-conversation-attachment-padding-inline | var(--amplify-space-xs) |
| --amplify-components-ai-conversation-attachment-remove-padding | var(--amplify-space-xxs) |
| --amplify-components-ai-conversation-attachment-size-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-ai-conversation-attachment-size-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-ai-conversation-attachment-size-font-weight | var(--amplify-font-weights-normal) |
| --amplify-components-ai-conversation-form-gap | var(--amplify-space-small) |
| --amplify-components-ai-conversation-form-padding | var(--amplify-space-small) |
| --amplify-components-ai-conversation-message-actions-gap | var(--amplify-space-xs) |
| --amplify-components-ai-conversation-message-assistant-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-ai-conversation-message-background-color | var(--amplify-colors-background-secondary) |
| --amplify-components-ai-conversation-message-body-gap | var(--amplify-space-xs) |
| --amplify-components-ai-conversation-message-border-radius | var(--amplify-radii-large) |
| --amplify-components-ai-conversation-message-gap | var(--amplify-space-small) |
| --amplify-components-ai-conversation-message-padding-block | var(--amplify-space-small) |
| --amplify-components-ai-conversation-message-padding-inline | var(--amplify-space-small) |
| --amplify-components-ai-conversation-message-sender-gap | var(--amplify-space-small) |
| --amplify-components-ai-conversation-message-sender-timestamp-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-ai-conversation-message-sender-timestamp-font-size | inherit |
| --amplify-components-ai-conversation-message-sender-timestamp-font-weight | inherit |
| --amplify-components-ai-conversation-message-sender-username-color | var(--amplify-colors-font-primary) |
| --amplify-components-ai-conversation-message-sender-username-font-size | inherit |
| --amplify-components-ai-conversation-message-sender-username-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-ai-conversation-message-user-background-color | var(--amplify-colors-background-secondary) |
| --amplify-components-alert-align-items | center |
| --amplify-components-alert-background-color | var(--amplify-colors-background-tertiary) |
| --amplify-components-alert-color | var(--amplify-colors-font-primary) |
| --amplify-components-alert-error-background-color | var(--amplify-colors-background-error) |
| --amplify-components-alert-error-color | var(--amplify-colors-font-error) |
| --amplify-components-alert-heading-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-alert-heading-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-alert-icon-size | var(--amplify-font-sizes-xl) |
| --amplify-components-alert-info-background-color | var(--amplify-colors-background-info) |
| --amplify-components-alert-info-color | var(--amplify-colors-font-info) |
| --amplify-components-alert-justify-content | space-between |
| --amplify-components-alert-padding-block | var(--amplify-space-small) |
| --amplify-components-alert-padding-inline | var(--amplify-space-medium) |
| --amplify-components-alert-success-background-color | var(--amplify-colors-background-success) |
| --amplify-components-alert-success-color | var(--amplify-colors-font-success) |
| --amplify-components-alert-warning-background-color | var(--amplify-colors-background-warning) |
| --amplify-components-alert-warning-color | var(--amplify-colors-font-warning) |
| --amplify-components-authenticator-container-width-max | 30rem |
| --amplify-components-authenticator-footer-padding-bottom | var(--amplify-space-medium) |
| --amplify-components-authenticator-form-padding | var(--amplify-space-xl) |
| --amplify-components-authenticator-max-width | 60rem |
| --amplify-components-authenticator-modal-background-color | var(--amplify-colors-overlay-50) |
| --amplify-components-authenticator-modal-height | var(--amplify-space-relative-full) |
| --amplify-components-authenticator-modal-left | var(--amplify-space-zero) |
| --amplify-components-authenticator-modal-top | var(--amplify-space-zero) |
| --amplify-components-authenticator-modal-width | var(--amplify-space-relative-full) |
| --amplify-components-authenticator-or-container-color | var(--amplify-colors-neutral-80) |
| --amplify-components-authenticator-or-container-or-line-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-authenticator-router-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-authenticator-router-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-authenticator-router-border-style | solid |
| --amplify-components-authenticator-router-border-width | var(--amplify-border-widths-small) |
| --amplify-components-authenticator-router-box-shadow | var(--amplify-shadows-medium) |
| --amplify-components-authenticator-state-inactive-background-color | var(--amplify-colors-background-secondary) |
| --amplify-components-autocomplete-menu-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-autocomplete-menu-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-autocomplete-menu-border-radius | var(--amplify-radii-small) |
| --amplify-components-autocomplete-menu-border-style | solid |
| --amplify-components-autocomplete-menu-border-width | var(--amplify-border-widths-small) |
| --amplify-components-autocomplete-menu-empty-display | flex |
| --amplify-components-autocomplete-menu-loading-align-items | center |
| --amplify-components-autocomplete-menu-loading-display | flex |
| --amplify-components-autocomplete-menu-loading-gap | var(--amplify-space-xxxs) |
| --amplify-components-autocomplete-menu-margin-block-start | var(--amplify-space-xxxs) |
| --amplify-components-autocomplete-menu-option-active-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-autocomplete-menu-option-active-color | var(--amplify-colors-white) |
| --amplify-components-autocomplete-menu-option-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-autocomplete-menu-option-color | currentcolor |
| --amplify-components-autocomplete-menu-option-cursor | pointer |
| --amplify-components-autocomplete-menu-option-transition-duration | var(--amplify-time-short) |
| --amplify-components-autocomplete-menu-option-transition-property | background-color, color |
| --amplify-components-autocomplete-menu-option-transition-timing-function | ease |
| --amplify-components-autocomplete-menu-options-display | flex |
| --amplify-components-autocomplete-menu-options-flex-direction | column |
| --amplify-components-autocomplete-menu-options-max-height | 300px |
| --amplify-components-autocomplete-menu-space-shared-padding-block | var(--amplify-space-xs) |
| --amplify-components-autocomplete-menu-space-shared-padding-inline | var(--amplify-space-small) |
| --amplify-components-autocomplete-menu-width | 100% |
| --amplify-components-avatar-background-color | var(--amplify-colors-background-tertiary) |
| --amplify-components-avatar-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-avatar-border-radius | 100% |
| --amplify-components-avatar-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-avatar-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-avatar-error-background-color | var(--amplify-colors-background-error) |
| --amplify-components-avatar-error-border-color | var(--amplify-colors-border-error) |
| --amplify-components-avatar-error-color | var(--amplify-colors-font-error) |
| --amplify-components-avatar-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-avatar-font-weight | var(--amplify-font-weights-semibold) |
| --amplify-components-avatar-height | var(--amplify-font-sizes-xxl) |
| --amplify-components-avatar-info-background-color | var(--amplify-colors-background-info) |
| --amplify-components-avatar-info-border-color | var(--amplify-colors-border-info) |
| --amplify-components-avatar-info-color | var(--amplify-colors-font-info) |
| --amplify-components-avatar-large-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-avatar-large-height | var(--amplify-font-sizes-xxxl) |
| --amplify-components-avatar-large-width | var(--amplify-font-sizes-xxxl) |
| --amplify-components-avatar-line-height | 1 |
| --amplify-components-avatar-small-font-size | var(--amplify-font-sizes-xs) |
| --amplify-components-avatar-small-height | var(--amplify-font-sizes-xl) |
| --amplify-components-avatar-small-width | var(--amplify-font-sizes-xl) |
| --amplify-components-avatar-success-background-color | var(--amplify-colors-background-success) |
| --amplify-components-avatar-success-border-color | var(--amplify-colors-border-success) |
| --amplify-components-avatar-success-color | var(--amplify-colors-font-success) |
| --amplify-components-avatar-text-align | center |
| --amplify-components-avatar-warning-background-color | var(--amplify-colors-background-warning) |
| --amplify-components-avatar-warning-border-color | var(--amplify-colors-border-warning) |
| --amplify-components-avatar-warning-color | var(--amplify-colors-font-warning) |
| --amplify-components-avatar-width | var(--amplify-font-sizes-xxl) |
| --amplify-components-badge-background-color | var(--amplify-colors-background-tertiary) |
| --amplify-components-badge-border-radius | var(--amplify-radii-xl) |
| --amplify-components-badge-color | var(--amplify-colors-font-primary) |
| --amplify-components-badge-error-background-color | var(--amplify-colors-background-error) |
| --amplify-components-badge-error-color | var(--amplify-colors-font-error) |
| --amplify-components-badge-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-badge-font-weight | var(--amplify-font-weights-semibold) |
| --amplify-components-badge-info-background-color | var(--amplify-colors-background-info) |
| --amplify-components-badge-info-color | var(--amplify-colors-font-info) |
| --amplify-components-badge-large-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-badge-large-padding-horizontal | var(--amplify-space-medium) |
| --amplify-components-badge-large-padding-vertical | var(--amplify-space-small) |
| --amplify-components-badge-line-height | 1 |
| --amplify-components-badge-padding-horizontal | var(--amplify-space-small) |
| --amplify-components-badge-padding-vertical | var(--amplify-space-xs) |
| --amplify-components-badge-small-font-size | var(--amplify-font-sizes-xs) |
| --amplify-components-badge-small-padding-horizontal | var(--amplify-space-xs) |
| --amplify-components-badge-small-padding-vertical | var(--amplify-space-xxs) |
| --amplify-components-badge-success-background-color | var(--amplify-colors-background-success) |
| --amplify-components-badge-success-color | var(--amplify-colors-font-success) |
| --amplify-components-badge-text-align | center |
| --amplify-components-badge-warning-background-color | var(--amplify-colors-background-warning) |
| --amplify-components-badge-warning-color | var(--amplify-colors-font-warning) |
| --amplify-components-breadcrumbs-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-breadcrumbs-flex-direction | row |
| --amplify-components-breadcrumbs-flex-wrap | wrap |
| --amplify-components-breadcrumbs-gap | 0 |
| --amplify-components-breadcrumbs-item-align-items | center |
| --amplify-components-breadcrumbs-item-color | inherit |
| --amplify-components-breadcrumbs-item-flex-direction | row |
| --amplify-components-breadcrumbs-item-font-size | inherit |
| --amplify-components-breadcrumbs-item-line-height | 1 |
| --amplify-components-breadcrumbs-link-color | var(--amplify-components-link-color) |
| --amplify-components-breadcrumbs-link-current-color | inherit |
| --amplify-components-breadcrumbs-link-current-font-size | inherit |
| --amplify-components-breadcrumbs-link-current-font-weight | normal |
| --amplify-components-breadcrumbs-link-current-text-decoration | none |
| --amplify-components-breadcrumbs-link-font-size | inherit |
| --amplify-components-breadcrumbs-link-font-weight | normal |
| --amplify-components-breadcrumbs-link-padding-block | var(--amplify-space-xxs) |
| --amplify-components-breadcrumbs-link-padding-inline | var(--amplify-space-xs) |
| --amplify-components-breadcrumbs-link-text-decoration | none |
| --amplify-components-breadcrumbs-separator-color | inherit |
| --amplify-components-breadcrumbs-separator-font-size | inherit |
| --amplify-components-breadcrumbs-separator-padding-inline | var(--amplify-space-xxs) |
| --amplify-components-button-active-background-color | var(--amplify-colors-primary-20) |
| --amplify-components-button-active-border-color | var(--amplify-colors-primary-100) |
| --amplify-components-button-active-color | var(--amplify-colors-font-active) |
| --amplify-components-button-background-color | transparent |
| --amplify-components-button-border-color | var(--amplify-components-fieldcontrol-border-color) |
| --amplify-components-button-border-radius | var(--amplify-components-fieldcontrol-border-radius) |
| --amplify-components-button-border-style | var(--amplify-components-fieldcontrol-border-style) |
| --amplify-components-button-border-width | var(--amplify-components-fieldcontrol-border-width) |
| --amplify-components-button-color | var(--amplify-colors-font-primary) |
| --amplify-components-button-destructive-active-background-color | var(--amplify-colors-red-100) |
| --amplify-components-button-destructive-active-border-color | transparent |
| --amplify-components-button-destructive-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-destructive-background-color | var(--amplify-colors-red-60) |
| --amplify-components-button-destructive-border-color | transparent |
| --amplify-components-button-destructive-border-style | solid |
| --amplify-components-button-destructive-border-width | var(--amplify-border-widths-small) |
| --amplify-components-button-destructive-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-destructive-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-button-destructive-disabled-border-color | transparent |
| --amplify-components-button-destructive-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-destructive-focus-background-color | var(--amplify-colors-red-80) |
| --amplify-components-button-destructive-focus-border-color | transparent |
| --amplify-components-button-destructive-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-button-destructive-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-destructive-hover-background-color | var(--amplify-colors-red-80) |
| --amplify-components-button-destructive-hover-border-color | transparent |
| --amplify-components-button-destructive-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-destructive-loading-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-button-destructive-loading-border-color | transparent |
| --amplify-components-button-destructive-loading-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-disabled-background-color | transparent |
| --amplify-components-button-disabled-border-color | var(--amplify-colors-border-tertiary) |
| --amplify-components-button-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-focus-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-button-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-button-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-button-focus-color | var(--amplify-colors-font-focus) |
| --amplify-components-button-font-size | var(--amplify-components-fieldcontrol-font-size) |
| --amplify-components-button-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-button-hover-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-button-hover-border-color | var(--amplify-colors-primary-60) |
| --amplify-components-button-hover-color | var(--amplify-colors-font-focus) |
| --amplify-components-button-large-font-size | var(--amplify-components-fieldcontrol-large-font-size) |
| --amplify-components-button-large-padding-block-end | var(--amplify-components-fieldcontrol-large-padding-block-end) |
| --amplify-components-button-large-padding-block-start | var(--amplify-components-fieldcontrol-large-padding-block-start) |
| --amplify-components-button-large-padding-inline-end | var(--amplify-components-fieldcontrol-large-padding-inline-end) |
| --amplify-components-button-large-padding-inline-start | var(--amplify-components-fieldcontrol-large-padding-inline-start) |
| --amplify-components-button-line-height | var(--amplify-components-fieldcontrol-line-height) |
| --amplify-components-button-link-active-background-color | var(--amplify-colors-primary-20) |
| --amplify-components-button-link-active-border-color | transparent |
| --amplify-components-button-link-active-color | var(--amplify-colors-font-active) |
| --amplify-components-button-link-background-color | transparent |
| --amplify-components-button-link-border-color | transparent |
| --amplify-components-button-link-border-width | var(--amplify-border-widths-small) |
| --amplify-components-button-link-color | var(--amplify-colors-font-interactive) |
| --amplify-components-button-link-disabled-background-color | transparent |
| --amplify-components-button-link-disabled-border-color | transparent |
| --amplify-components-button-link-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-link-error-active-background-color | var(--amplify-colors-red-20) |
| --amplify-components-button-link-error-active-border-color | transparent |
| --amplify-components-button-link-error-active-color | var(--amplify-colors-red-100) |
| --amplify-components-button-link-error-background-color | transparent |
| --amplify-components-button-link-error-border-color | transparent |
| --amplify-components-button-link-error-color | var(--amplify-colors-red-100) |
| --amplify-components-button-link-error-focus-background-color | var(--amplify-colors-red-10) |
| --amplify-components-button-link-error-focus-border-color | transparent |
| --amplify-components-button-link-error-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-button-link-error-focus-color | var(--amplify-colors-red-100) |
| --amplify-components-button-link-error-hover-background-color | var(--amplify-colors-red-10) |
| --amplify-components-button-link-error-hover-border-color | transparent |
| --amplify-components-button-link-error-hover-color | var(--amplify-colors-red-90) |
| --amplify-components-button-link-focus-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-button-link-focus-border-color | transparent |
| --amplify-components-button-link-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-button-link-focus-color | var(--amplify-colors-font-focus) |
| --amplify-components-button-link-hover-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-button-link-hover-border-color | transparent |
| --amplify-components-button-link-hover-color | var(--amplify-colors-font-hover) |
| --amplify-components-button-link-info-active-background-color | var(--amplify-colors-blue-20) |
| --amplify-components-button-link-info-active-border-color | transparent |
| --amplify-components-button-link-info-active-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-link-info-background-color | transparent |
| --amplify-components-button-link-info-border-color | transparent |
| --amplify-components-button-link-info-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-link-info-focus-background-color | var(--amplify-colors-blue-10) |
| --amplify-components-button-link-info-focus-border-color | transparent |
| --amplify-components-button-link-info-focus-box-shadow | var(--amplify-components-fieldcontrol-info-focus-box-shadow) |
| --amplify-components-button-link-info-focus-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-link-info-hover-background-color | var(--amplify-colors-blue-10) |
| --amplify-components-button-link-info-hover-border-color | transparent |
| --amplify-components-button-link-info-hover-color | var(--amplify-colors-blue-90) |
| --amplify-components-button-link-loading-background-color | transparent |
| --amplify-components-button-link-loading-border-color | transparent |
| --amplify-components-button-link-loading-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-link-overlay-active-background-color | var(--amplify-colors-overlay-10) |
| --amplify-components-button-link-overlay-active-border-color | transparent |
| --amplify-components-button-link-overlay-active-color | var(--amplify-colors-overlay-90) |
| --amplify-components-button-link-overlay-background-color | transparent |
| --amplify-components-button-link-overlay-border-color | transparent |
| --amplify-components-button-link-overlay-color | var(--amplify-colors-neutral-100) |
| --amplify-components-button-link-overlay-focus-background-color | var(--amplify-colors-overlay-5) |
| --amplify-components-button-link-overlay-focus-border-color | transparent |
| --amplify-components-button-link-overlay-focus-box-shadow | var(--amplify-components-fieldcontrol-overlay-focus-box-shadow) |
| --amplify-components-button-link-overlay-focus-color | var(--amplify-colors-overlay-90) |
| --amplify-components-button-link-overlay-hover-background-color | var(--amplify-colors-overlay-5) |
| --amplify-components-button-link-overlay-hover-border-color | transparent |
| --amplify-components-button-link-overlay-hover-color | var(--amplify-colors-overlay-80) |
| --amplify-components-button-link-success-active-background-color | var(--amplify-colors-green-20) |
| --amplify-components-button-link-success-active-border-color | transparent |
| --amplify-components-button-link-success-active-color | var(--amplify-colors-green-100) |
| --amplify-components-button-link-success-background-color | transparent |
| --amplify-components-button-link-success-border-color | transparent |
| --amplify-components-button-link-success-color | var(--amplify-colors-green-100) |
| --amplify-components-button-link-success-focus-background-color | var(--amplify-colors-green-10) |
| --amplify-components-button-link-success-focus-border-color | transparent |
| --amplify-components-button-link-success-focus-box-shadow | var(--amplify-components-fieldcontrol-success-focus-box-shadow) |
| --amplify-components-button-link-success-focus-color | var(--amplify-colors-green-100) |
| --amplify-components-button-link-success-hover-background-color | var(--amplify-colors-green-10) |
| --amplify-components-button-link-success-hover-border-color | transparent |
| --amplify-components-button-link-success-hover-color | var(--amplify-colors-green-90) |
| --amplify-components-button-link-warning-active-background-color | var(--amplify-colors-orange-20) |
| --amplify-components-button-link-warning-active-border-color | transparent |
| --amplify-components-button-link-warning-active-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-link-warning-background-color | transparent |
| --amplify-components-button-link-warning-border-color | transparent |
| --amplify-components-button-link-warning-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-link-warning-focus-background-color | var(--amplify-colors-orange-10) |
| --amplify-components-button-link-warning-focus-border-color | transparent |
| --amplify-components-button-link-warning-focus-box-shadow | var(--amplify-components-fieldcontrol-warning-focus-box-shadow) |
| --amplify-components-button-link-warning-focus-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-link-warning-hover-background-color | var(--amplify-colors-orange-10) |
| --amplify-components-button-link-warning-hover-border-color | transparent |
| --amplify-components-button-link-warning-hover-color | var(--amplify-colors-orange-90) |
| --amplify-components-button-loader-wrapper-align-items | center |
| --amplify-components-button-loader-wrapper-gap | var(--amplify-space-xs) |
| --amplify-components-button-loading-background-color | transparent |
| --amplify-components-button-loading-border-color | var(--amplify-colors-border-tertiary) |
| --amplify-components-button-loading-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-menu-active-background-color | var(--amplify-colors-primary-90) |
| --amplify-components-button-menu-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-menu-background-color | transparent |
| --amplify-components-button-menu-border-width | var(--amplify-space-zero) |
| --amplify-components-button-menu-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-menu-focus-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-button-menu-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-menu-hover-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-button-menu-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-menu-justify-content | start |
| --amplify-components-button-outlined-error-active-background-color | var(--amplify-colors-red-20) |
| --amplify-components-button-outlined-error-active-border-color | var(--amplify-colors-red-100) |
| --amplify-components-button-outlined-error-active-color | var(--amplify-colors-red-100) |
| --amplify-components-button-outlined-error-background-color | transparent |
| --amplify-components-button-outlined-error-border-color | var(--amplify-colors-red-80) |
| --amplify-components-button-outlined-error-color | var(--amplify-colors-red-100) |
| --amplify-components-button-outlined-error-focus-background-color | var(--amplify-colors-red-10) |
| --amplify-components-button-outlined-error-focus-border-color | var(--amplify-colors-red-100) |
| --amplify-components-button-outlined-error-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-button-outlined-error-focus-color | var(--amplify-colors-red-100) |
| --amplify-components-button-outlined-error-hover-background-color | var(--amplify-colors-red-10) |
| --amplify-components-button-outlined-error-hover-border-color | var(--amplify-colors-red-80) |
| --amplify-components-button-outlined-error-hover-color | var(--amplify-colors-red-100) |
| --amplify-components-button-outlined-info-active-background-color | var(--amplify-colors-blue-20) |
| --amplify-components-button-outlined-info-active-border-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-outlined-info-active-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-outlined-info-background-color | transparent |
| --amplify-components-button-outlined-info-border-color | var(--amplify-colors-blue-60) |
| --amplify-components-button-outlined-info-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-outlined-info-focus-background-color | var(--amplify-colors-blue-10) |
| --amplify-components-button-outlined-info-focus-border-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-outlined-info-focus-box-shadow | var(--amplify-components-fieldcontrol-info-focus-box-shadow) |
| --amplify-components-button-outlined-info-focus-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-outlined-info-hover-background-color | var(--amplify-colors-blue-10) |
| --amplify-components-button-outlined-info-hover-border-color | var(--amplify-colors-blue-60) |
| --amplify-components-button-outlined-info-hover-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-outlined-overlay-active-background-color | var(--amplify-colors-overlay-10) |
| --amplify-components-button-outlined-overlay-active-border-color | var(--amplify-colors-overlay-90) |
| --amplify-components-button-outlined-overlay-active-color | var(--amplify-colors-neutral-100) |
| --amplify-components-button-outlined-overlay-background-color | transparent |
| --amplify-components-button-outlined-overlay-border-color | var(--amplify-colors-overlay-60) |
| --amplify-components-button-outlined-overlay-color | var(--amplify-colors-font-primary) |
| --amplify-components-button-outlined-overlay-focus-background-color | var(--amplify-colors-overlay-5) |
| --amplify-components-button-outlined-overlay-focus-border-color | var(--amplify-colors-overlay-90) |
| --amplify-components-button-outlined-overlay-focus-box-shadow | var(--amplify-components-fieldcontrol-overlay-focus-box-shadow) |
| --amplify-components-button-outlined-overlay-focus-color | var(--amplify-colors-neutral-90) |
| --amplify-components-button-outlined-overlay-hover-background-color | var(--amplify-colors-overlay-5) |
| --amplify-components-button-outlined-overlay-hover-border-color | var(--amplify-colors-overlay-60) |
| --amplify-components-button-outlined-overlay-hover-color | var(--amplify-colors-neutral-90) |
| --amplify-components-button-outlined-success-active-background-color | var(--amplify-colors-green-20) |
| --amplify-components-button-outlined-success-active-border-color | var(--amplify-colors-green-100) |
| --amplify-components-button-outlined-success-active-color | var(--amplify-colors-green-100) |
| --amplify-components-button-outlined-success-background-color | transparent |
| --amplify-components-button-outlined-success-border-color | var(--amplify-colors-green-60) |
| --amplify-components-button-outlined-success-color | var(--amplify-colors-green-100) |
| --amplify-components-button-outlined-success-focus-background-color | var(--amplify-colors-green-10) |
| --amplify-components-button-outlined-success-focus-border-color | var(--amplify-colors-green-100) |
| --amplify-components-button-outlined-success-focus-box-shadow | var(--amplify-components-fieldcontrol-success-focus-box-shadow) |
| --amplify-components-button-outlined-success-focus-color | var(--amplify-colors-green-100) |
| --amplify-components-button-outlined-success-hover-background-color | var(--amplify-colors-green-10) |
| --amplify-components-button-outlined-success-hover-border-color | var(--amplify-colors-green-60) |
| --amplify-components-button-outlined-success-hover-color | var(--amplify-colors-green-100) |
| --amplify-components-button-outlined-warning-active-background-color | var(--amplify-colors-orange-20) |
| --amplify-components-button-outlined-warning-active-border-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-outlined-warning-active-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-outlined-warning-background-color | transparent |
| --amplify-components-button-outlined-warning-border-color | var(--amplify-colors-orange-60) |
| --amplify-components-button-outlined-warning-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-outlined-warning-focus-background-color | var(--amplify-colors-orange-10) |
| --amplify-components-button-outlined-warning-focus-border-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-outlined-warning-focus-box-shadow | var(--amplify-components-fieldcontrol-warning-focus-box-shadow) |
| --amplify-components-button-outlined-warning-focus-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-outlined-warning-hover-background-color | var(--amplify-colors-orange-10) |
| --amplify-components-button-outlined-warning-hover-border-color | var(--amplify-colors-orange-60) |
| --amplify-components-button-outlined-warning-hover-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-padding-block-end | var(--amplify-components-fieldcontrol-padding-block-end) |
| --amplify-components-button-padding-block-start | var(--amplify-components-fieldcontrol-padding-block-start) |
| --amplify-components-button-padding-inline-end | var(--amplify-components-fieldcontrol-padding-inline-end) |
| --amplify-components-button-padding-inline-start | var(--amplify-components-fieldcontrol-padding-inline-start) |
| --amplify-components-button-primary-active-background-color | var(--amplify-colors-primary-100) |
| --amplify-components-button-primary-active-border-color | transparent |
| --amplify-components-button-primary-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-button-primary-border-color | transparent |
| --amplify-components-button-primary-border-style | solid |
| --amplify-components-button-primary-border-width | var(--amplify-border-widths-small) |
| --amplify-components-button-primary-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-button-primary-disabled-border-color | transparent |
| --amplify-components-button-primary-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-primary-error-active-background-color | var(--amplify-colors-red-100) |
| --amplify-components-button-primary-error-active-border-color | transparent |
| --amplify-components-button-primary-error-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-error-background-color | var(--amplify-colors-red-80) |
| --amplify-components-button-primary-error-border-color | transparent |
| --amplify-components-button-primary-error-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-error-focus-background-color | var(--amplify-colors-red-90) |
| --amplify-components-button-primary-error-focus-border-color | transparent |
| --amplify-components-button-primary-error-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-button-primary-error-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-error-hover-background-color | var(--amplify-colors-red-90) |
| --amplify-components-button-primary-error-hover-border-color | transparent |
| --amplify-components-button-primary-error-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-focus-background-color | var(--amplify-colors-primary-90) |
| --amplify-components-button-primary-focus-border-color | transparent |
| --amplify-components-button-primary-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-button-primary-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-hover-background-color | var(--amplify-colors-primary-90) |
| --amplify-components-button-primary-hover-border-color | transparent |
| --amplify-components-button-primary-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-info-active-background-color | var(--amplify-colors-blue-100) |
| --amplify-components-button-primary-info-active-border-color | transparent |
| --amplify-components-button-primary-info-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-info-background-color | var(--amplify-colors-blue-80) |
| --amplify-components-button-primary-info-border-color | transparent |
| --amplify-components-button-primary-info-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-info-focus-background-color | var(--amplify-colors-blue-90) |
| --amplify-components-button-primary-info-focus-border-color | transparent |
| --amplify-components-button-primary-info-focus-box-shadow | var(--amplify-components-fieldcontrol-info-focus-box-shadow) |
| --amplify-components-button-primary-info-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-info-hover-background-color | var(--amplify-colors-blue-90) |
| --amplify-components-button-primary-info-hover-border-color | transparent |
| --amplify-components-button-primary-info-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-loading-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-button-primary-loading-border-color | transparent |
| --amplify-components-button-primary-loading-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-primary-overlay-active-background-color | var(--amplify-colors-overlay-90) |
| --amplify-components-button-primary-overlay-active-border-color | transparent |
| --amplify-components-button-primary-overlay-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-overlay-background-color | var(--amplify-colors-overlay-70) |
| --amplify-components-button-primary-overlay-border-color | transparent |
| --amplify-components-button-primary-overlay-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-overlay-focus-background-color | var(--amplify-colors-overlay-90) |
| --amplify-components-button-primary-overlay-focus-border-color | transparent |
| --amplify-components-button-primary-overlay-focus-box-shadow | var(--amplify-components-fieldcontrol-overlay-focus-box-shadow) |
| --amplify-components-button-primary-overlay-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-overlay-hover-background-color | var(--amplify-colors-overlay-90) |
| --amplify-components-button-primary-overlay-hover-border-color | transparent |
| --amplify-components-button-primary-overlay-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-success-active-background-color | var(--amplify-colors-green-100) |
| --amplify-components-button-primary-success-active-border-color | transparent |
| --amplify-components-button-primary-success-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-success-background-color | var(--amplify-colors-green-80) |
| --amplify-components-button-primary-success-border-color | transparent |
| --amplify-components-button-primary-success-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-success-focus-background-color | var(--amplify-colors-green-90) |
| --amplify-components-button-primary-success-focus-border-color | transparent |
| --amplify-components-button-primary-success-focus-box-shadow | var(--amplify-components-fieldcontrol-success-focus-box-shadow) |
| --amplify-components-button-primary-success-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-success-hover-background-color | var(--amplify-colors-green-90) |
| --amplify-components-button-primary-success-hover-border-color | transparent |
| --amplify-components-button-primary-success-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-warning-active-background-color | var(--amplify-colors-orange-100) |
| --amplify-components-button-primary-warning-active-border-color | transparent |
| --amplify-components-button-primary-warning-active-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-warning-background-color | var(--amplify-colors-orange-80) |
| --amplify-components-button-primary-warning-border-color | transparent |
| --amplify-components-button-primary-warning-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-warning-focus-background-color | var(--amplify-colors-orange-90) |
| --amplify-components-button-primary-warning-focus-border-color | transparent |
| --amplify-components-button-primary-warning-focus-box-shadow | var(--amplify-components-fieldcontrol-overlay-focus-box-shadow) |
| --amplify-components-button-primary-warning-focus-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-primary-warning-hover-background-color | var(--amplify-colors-orange-90) |
| --amplify-components-button-primary-warning-hover-border-color | transparent |
| --amplify-components-button-primary-warning-hover-color | var(--amplify-colors-font-inverse) |
| --amplify-components-button-small-font-size | var(--amplify-components-fieldcontrol-small-font-size) |
| --amplify-components-button-small-padding-block-end | var(--amplify-components-fieldcontrol-small-padding-block-end) |
| --amplify-components-button-small-padding-block-start | var(--amplify-components-fieldcontrol-small-padding-block-start) |
| --amplify-components-button-small-padding-inline-end | var(--amplify-components-fieldcontrol-small-padding-inline-end) |
| --amplify-components-button-small-padding-inline-start | var(--amplify-components-fieldcontrol-small-padding-inline-start) |
| --amplify-components-button-transition-duration | var(--amplify-components-fieldcontrol-transition-duration) |
| --amplify-components-button-warning-active-background-color | var(--amplify-colors-red-20) |
| --amplify-components-button-warning-active-border-color | var(--amplify-colors-red-100) |
| --amplify-components-button-warning-active-color | var(--amplify-colors-red-100) |
| --amplify-components-button-warning-background-color | transparent |
| --amplify-components-button-warning-border-color | var(--amplify-colors-red-60) |
| --amplify-components-button-warning-border-width | var(--amplify-border-widths-small) |
| --amplify-components-button-warning-color | var(--amplify-colors-red-60) |
| --amplify-components-button-warning-disabled-background-color | transparent |
| --amplify-components-button-warning-disabled-border-color | var(--amplify-colors-border-tertiary) |
| --amplify-components-button-warning-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-button-warning-focus-background-color | var(--amplify-colors-red-10) |
| --amplify-components-button-warning-focus-border-color | var(--amplify-colors-red-80) |
| --amplify-components-button-warning-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-button-warning-focus-color | var(--amplify-colors-red-80) |
| --amplify-components-button-warning-hover-background-color | var(--amplify-colors-red-10) |
| --amplify-components-button-warning-hover-border-color | var(--amplify-colors-red-80) |
| --amplify-components-button-warning-hover-color | var(--amplify-colors-font-error) |
| --amplify-components-button-warning-loading-background-color | transparent |
| --amplify-components-button-warning-loading-border-color | var(--amplify-colors-border-tertiary) |
| --amplify-components-button-warning-loading-color | var(--amplify-colors-font-disabled) |
| --amplify-components-card-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-card-border-color | transparent |
| --amplify-components-card-border-radius | var(--amplify-radii-xs) |
| --amplify-components-card-border-style | solid |
| --amplify-components-card-border-width | 0 |
| --amplify-components-card-box-shadow | none |
| --amplify-components-card-elevated-background-color | var(--amplify-components-card-background-color) |
| --amplify-components-card-elevated-border-color | transparent |
| --amplify-components-card-elevated-border-radius | var(--amplify-radii-xs) |
| --amplify-components-card-elevated-border-style | solid |
| --amplify-components-card-elevated-border-width | 0 |
| --amplify-components-card-elevated-box-shadow | var(--amplify-shadows-medium) |
| --amplify-components-card-outlined-background-color | var(--amplify-components-card-background-color) |
| --amplify-components-card-outlined-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-card-outlined-border-radius | var(--amplify-radii-xs) |
| --amplify-components-card-outlined-border-style | solid |
| --amplify-components-card-outlined-border-width | var(--amplify-border-widths-small) |
| --amplify-components-card-outlined-box-shadow | var(--amplify-components-card-box-shadow) |
| --amplify-components-card-padding | var(--amplify-space-medium) |
| --amplify-components-checkbox-align-items | center |
| --amplify-components-checkbox-button-align-items | center |
| --amplify-components-checkbox-button-before-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-checkbox-button-before-border-radius | 20% |
| --amplify-components-checkbox-button-before-border-style | solid |
| --amplify-components-checkbox-button-before-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-checkbox-button-before-height | 100% |
| --amplify-components-checkbox-button-before-width | 100% |
| --amplify-components-checkbox-button-color | var(--amplify-colors-font-inverse) |
| --amplify-components-checkbox-button-disabled-border-color | var(--amplify-colors-border-disabled) |
| --amplify-components-checkbox-button-error-border-color | var(--amplify-colors-border-error) |
| --amplify-components-checkbox-button-error-focus-border-color | var(--amplify-colors-border-error) |
| --amplify-components-checkbox-button-error-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-checkbox-button-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-checkbox-button-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-checkbox-button-focus-outline-color | var(--amplify-colors-transparent) |
| --amplify-components-checkbox-button-focus-outline-offset | var(--amplify-outline-offsets-medium) |
| --amplify-components-checkbox-button-focus-outline-style | solid |
| --amplify-components-checkbox-button-focus-outline-width | var(--amplify-outline-widths-medium) |
| --amplify-components-checkbox-button-justify-content | center |
| --amplify-components-checkbox-button-position | relative |
| --amplify-components-checkbox-cursor | pointer |
| --amplify-components-checkbox-disabled-cursor | not-allowed |
| --amplify-components-checkbox-icon-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-checkbox-icon-border-radius | 20% |
| --amplify-components-checkbox-icon-checked-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-checkbox-icon-checked-opacity | var(--amplify-opacities-100) |
| --amplify-components-checkbox-icon-checked-transform | scale(1) |
| --amplify-components-checkbox-icon-indeterminate-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-checkbox-icon-indeterminate-opacity | var(--amplify-opacities-100) |
| --amplify-components-checkbox-icon-indeterminate-transform | scale(1) |
| --amplify-components-checkbox-icon-opacity | var(--amplify-opacities-0) |
| --amplify-components-checkbox-icon-transform | scale(0) |
| --amplify-components-checkbox-icon-transition-duration | var(--amplify-time-short) |
| --amplify-components-checkbox-icon-transition-property | all |
| --amplify-components-checkbox-icon-transition-timing-function | ease-in-out |
| --amplify-components-checkbox-label-color | var(--amplify-components-text-color) |
| --amplify-components-checkbox-label-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-checkboxfield-align-content | center |
| --amplify-components-checkboxfield-align-items | flex-start |
| --amplify-components-checkboxfield-flex-direction | column |
| --amplify-components-checkboxfield-justify-content | center |
| --amplify-components-collection-pagination-button-color | var(--amplify-components-pagination-button-color) |
| --amplify-components-collection-pagination-button-disabled-color | var(--amplify-components-pagination-button-disabled-color) |
| --amplify-components-collection-pagination-button-hover-background-color | var(--amplify-components-pagination-button-hover-background-color) |
| --amplify-components-collection-pagination-button-hover-color | var(--amplify-components-pagination-button-hover-color) |
| --amplify-components-collection-pagination-current-background-color | var(--amplify-components-pagination-current-background-color) |
| --amplify-components-collection-pagination-current-color | var(--amplify-components-pagination-current-color) |
| --amplify-components-collection-search-button-active-background-color | var(--amplify-components-searchfield-button-active-background-color) |
| --amplify-components-collection-search-button-active-border-color | var(--amplify-components-searchfield-button-active-border-color) |
| --amplify-components-collection-search-button-active-color | var(--amplify-components-searchfield-button-active-color) |
| --amplify-components-collection-search-button-color | var(--amplify-components-searchfield-button-color) |
| --amplify-components-collection-search-button-disabled-background-color | var(--amplify-components-searchfield-button-disabled-background-color) |
| --amplify-components-collection-search-button-disabled-border-color | var(--amplify-components-searchfield-button-disabled-border-color) |
| --amplify-components-collection-search-button-disabled-color | var(--amplify-components-searchfield-button-disabled-color) |
| --amplify-components-collection-search-button-focus-background-color | var(--amplify-components-searchfield-button-focus-background-color) |
| --amplify-components-collection-search-button-focus-border-color | var(--amplify-components-searchfield-button-focus-border-color) |
| --amplify-components-collection-search-button-focus-color | var(--amplify-components-searchfield-button-focus-color) |
| --amplify-components-collection-search-button-hover-background-color | var(--amplify-components-searchfield-button-hover-background-color) |
| --amplify-components-collection-search-button-hover-border-color | var(--amplify-components-searchfield-button-hover-border-color) |
| --amplify-components-collection-search-button-hover-color | var(--amplify-components-searchfield-button-hover-color) |
| --amplify-components-collection-search-input-color | var(--amplify-components-searchfield-color) |
| --amplify-components-copy-font-size | var(--amplify-font-sizes-xs) |
| --amplify-components-copy-gap | var(--amplify-space-relative-medium) |
| --amplify-components-copy-svg-path-fill | var(--amplify-colors-font-primary) |
| --amplify-components-copy-tool-tip-bottom | var(--amplify-space-large) |
| --amplify-components-copy-tool-tip-color | var(--amplify-colors-teal-100) |
| --amplify-components-copy-tool-tip-font-size | var(--amplify-font-sizes-xxs) |
| --amplify-components-countrycodeselect-height | var(--amplify-space-relative-full) |
| --amplify-components-divider-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-divider-border-style | solid |
| --amplify-components-divider-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-divider-label-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-divider-label-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-divider-label-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-divider-label-padding-inline | var(--amplify-space-medium) |
| --amplify-components-divider-large-border-width | var(--amplify-border-widths-large) |
| --amplify-components-divider-opacity | var(--amplify-opacities-60) |
| --amplify-components-divider-small-border-width | var(--amplify-border-widths-small) |
| --amplify-components-dropzone-accepted-background-color | var(--amplify-colors-background-success) |
| --amplify-components-dropzone-accepted-border-color | var(--amplify-colors-border-success) |
| --amplify-components-dropzone-accepted-border-radius | var(--amplify-components-dropzone-border-radius) |
| --amplify-components-dropzone-accepted-border-style | var(--amplify-components-dropzone-border-style) |
| --amplify-components-dropzone-accepted-border-width | var(--amplify-components-dropzone-border-width) |
| --amplify-components-dropzone-accepted-color | var(--amplify-colors-font-success) |
| --amplify-components-dropzone-active-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-dropzone-active-border-color | var(--amplify-colors-border-pressed) |
| --amplify-components-dropzone-active-border-radius | var(--amplify-components-dropzone-border-radius) |
| --amplify-components-dropzone-active-border-style | var(--amplify-components-dropzone-border-style) |
| --amplify-components-dropzone-active-border-width | var(--amplify-components-dropzone-border-width) |
| --amplify-components-dropzone-active-color | var(--amplify-colors-font-primary) |
| --amplify-components-dropzone-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-dropzone-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-dropzone-border-radius | var(--amplify-radii-small) |
| --amplify-components-dropzone-border-style | dashed |
| --amplify-components-dropzone-border-width | var(--amplify-border-widths-small) |
| --amplify-components-dropzone-color | var(--amplify-colors-font-primary) |
| --amplify-components-dropzone-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-dropzone-disabled-border-color | var(--amplify-colors-border-disabled) |
| --amplify-components-dropzone-disabled-border-radius | var(--amplify-components-dropzone-border-radius) |
| --amplify-components-dropzone-disabled-border-style | var(--amplify-components-dropzone-border-style) |
| --amplify-components-dropzone-disabled-border-width | var(--amplify-components-dropzone-border-width) |
| --amplify-components-dropzone-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-dropzone-gap | var(--amplify-space-small) |
| --amplify-components-dropzone-padding-block | var(--amplify-space-xl) |
| --amplify-components-dropzone-padding-inline | var(--amplify-space-large) |
| --amplify-components-dropzone-rejected-background-color | var(--amplify-colors-background-error) |
| --amplify-components-dropzone-rejected-border-color | var(--amplify-colors-border-pressed) |
| --amplify-components-dropzone-rejected-border-radius | var(--amplify-components-dropzone-border-radius) |
| --amplify-components-dropzone-rejected-border-style | var(--amplify-components-dropzone-border-style) |
| --amplify-components-dropzone-rejected-border-width | var(--amplify-components-dropzone-border-width) |
| --amplify-components-dropzone-rejected-color | var(--amplify-colors-font-error) |
| --amplify-components-dropzone-text-align | center |
| --amplify-components-field-flex-direction | column |
| --amplify-components-field-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-field-gap | var(--amplify-space-xs) |
| --amplify-components-field-label-color | var(--amplify-colors-font-secondary) |
| --amplify-components-field-large-font-size | var(--amplify-font-sizes-large) |
| --amplify-components-field-large-gap | var(--amplify-space-small) |
| --amplify-components-field-small-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-field-small-gap | var(--amplify-space-xxxs) |
| --amplify-components-fieldcontrol-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-fieldcontrol-border-radius | var(--amplify-radii-small) |
| --amplify-components-fieldcontrol-border-style | solid |
| --amplify-components-fieldcontrol-border-width | var(--amplify-border-widths-small) |
| --amplify-components-fieldcontrol-color | var(--amplify-colors-font-primary) |
| --amplify-components-fieldcontrol-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-fieldcontrol-disabled-border-color | var(--amplify-colors-transparent) |
| --amplify-components-fieldcontrol-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-fieldcontrol-disabled-cursor | not-allowed |
| --amplify-components-fieldcontrol-error-border-color | var(--amplify-colors-border-error) |
| --amplify-components-fieldcontrol-error-color | var(--amplify-colors-font-error) |
| --amplify-components-fieldcontrol-error-focus-box-shadow | 0px 0px 0px 2px var(--amplify-colors-border-error) |
| --amplify-components-fieldcontrol-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-fieldcontrol-focus-box-shadow | 0px 0px 0px 2px var(--amplify-colors-border-focus) |
| --amplify-components-fieldcontrol-font-size | var(--amplify-components-field-font-size) |
| --amplify-components-fieldcontrol-info-focus-box-shadow | 0px 0px 0px 2px var(--amplify-colors-blue-100) |
| --amplify-components-fieldcontrol-large-font-size | var(--amplify-components-field-large-font-size) |
| --amplify-components-fieldcontrol-large-padding-block-end | var(--amplify-space-xs) |
| --amplify-components-fieldcontrol-large-padding-block-start | var(--amplify-space-xs) |
| --amplify-components-fieldcontrol-large-padding-inline-end | var(--amplify-space-medium) |
| --amplify-components-fieldcontrol-large-padding-inline-start | var(--amplify-space-medium) |
| --amplify-components-fieldcontrol-line-height | var(--amplify-line-heights-medium) |
| --amplify-components-fieldcontrol-outline-color | var(--amplify-colors-transparent) |
| --amplify-components-fieldcontrol-outline-offset | var(--amplify-outline-offsets-medium) |
| --amplify-components-fieldcontrol-outline-style | solid |
| --amplify-components-fieldcontrol-outline-width | var(--amplify-outline-widths-medium) |
| --amplify-components-fieldcontrol-overlay-focus-box-shadow | 0px 0px 0px 2px var(--amplify-colors-overlay-90) |
| --amplify-components-fieldcontrol-padding-block-end | var(--amplify-space-xs) |
| --amplify-components-fieldcontrol-padding-block-start | var(--amplify-space-xs) |
| --amplify-components-fieldcontrol-padding-inline-end | var(--amplify-space-medium) |
| --amplify-components-fieldcontrol-padding-inline-start | var(--amplify-space-medium) |
| --amplify-components-fieldcontrol-quiet-border-block-start | none |
| --amplify-components-fieldcontrol-quiet-border-inline-end | none |
| --amplify-components-fieldcontrol-quiet-border-inline-start | none |
| --amplify-components-fieldcontrol-quiet-border-radius | 0 |
| --amplify-components-fieldcontrol-quiet-border-style | none |
| --amplify-components-fieldcontrol-quiet-error-border-block-end-color | var(--amplify-colors-border-error) |
| --amplify-components-fieldcontrol-quiet-error-focus-border-block-end-color | transparent |
| --amplify-components-fieldcontrol-quiet-error-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-fieldcontrol-quiet-focus-border-block-end-color | transparent |
| --amplify-components-fieldcontrol-quiet-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-fieldcontrol-small-font-size | var(--amplify-components-field-small-font-size) |
| --amplify-components-fieldcontrol-small-padding-block-end | var(--amplify-space-xxs) |
| --amplify-components-fieldcontrol-small-padding-block-start | var(--amplify-space-xxs) |
| --amplify-components-fieldcontrol-small-padding-inline-end | var(--amplify-space-small) |
| --amplify-components-fieldcontrol-small-padding-inline-start | var(--amplify-space-small) |
| --amplify-components-fieldcontrol-success-focus-box-shadow | 0px 0px 0px 2px var(--amplify-colors-green-100) |
| --amplify-components-fieldcontrol-transition-duration | var(--amplify-time-medium) |
| --amplify-components-fieldcontrol-warning-focus-box-shadow | 0px 0px 0px 2px var(--amplify-colors-orange-100) |
| --amplify-components-fieldgroup-gap | var(--amplify-space-zero) |
| --amplify-components-fieldgroup-outer-align-items | center |
| --amplify-components-fieldgroup-vertical-align-items | center |
| --amplify-components-fieldmessages-description-color | var(--amplify-colors-font-secondary) |
| --amplify-components-fieldmessages-description-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-fieldmessages-description-font-style | italic |
| --amplify-components-fieldmessages-error-color | var(--amplify-colors-font-error) |
| --amplify-components-fieldmessages-error-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-fieldset-background-color | transparent |
| --amplify-components-fieldset-border-radius | var(--amplify-radii-xs) |
| --amplify-components-fieldset-flex-direction | column |
| --amplify-components-fieldset-gap | var(--amplify-components-field-gap) |
| --amplify-components-fieldset-large-gap | var(--amplify-components-field-large-gap) |
| --amplify-components-fieldset-legend-color | var(--amplify-colors-font-primary) |
| --amplify-components-fieldset-legend-font-size | var(--amplify-components-field-font-size) |
| --amplify-components-fieldset-legend-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-fieldset-legend-large-font-size | var(--amplify-components-field-large-font-size) |
| --amplify-components-fieldset-legend-line-height | var(--amplify-line-heights-medium) |
| --amplify-components-fieldset-legend-small-font-size | var(--amplify-components-field-small-font-size) |
| --amplify-components-fieldset-outlined-border-color | var(--amplify-colors-neutral-40) |
| --amplify-components-fieldset-outlined-border-style | solid |
| --amplify-components-fieldset-outlined-border-width | var(--amplify-border-widths-small) |
| --amplify-components-fieldset-outlined-large-padding | var(--amplify-space-large) |
| --amplify-components-fieldset-outlined-padding | var(--amplify-space-medium) |
| --amplify-components-fieldset-outlined-small-padding | var(--amplify-space-small) |
| --amplify-components-fieldset-small-gap | var(--amplify-components-field-small-gap) |
| --amplify-components-fileuploader-dropzone-active-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-fileuploader-dropzone-active-border-color | var(--amplify-colors-border-pressed) |
| --amplify-components-fileuploader-dropzone-active-border-radius | var(--amplify-components-fileuploader-dropzone-border-radius) |
| --amplify-components-fileuploader-dropzone-active-border-style | var(--amplify-components-fileuploader-dropzone-border-style) |
| --amplify-components-fileuploader-dropzone-active-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-fileuploader-dropzone-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-fileuploader-dropzone-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-fileuploader-dropzone-border-radius | var(--amplify-radii-small) |
| --amplify-components-fileuploader-dropzone-border-style | dashed |
| --amplify-components-fileuploader-dropzone-border-width | var(--amplify-border-widths-small) |
| --amplify-components-fileuploader-dropzone-gap | var(--amplify-space-small) |
| --amplify-components-fileuploader-dropzone-icon-color | var(--amplify-colors-border-primary) |
| --amplify-components-fileuploader-dropzone-icon-font-size | var(--amplify-font-sizes-xxl) |
| --amplify-components-fileuploader-dropzone-padding-block | var(--amplify-space-xl) |
| --amplify-components-fileuploader-dropzone-padding-inline | var(--amplify-space-large) |
| --amplify-components-fileuploader-dropzone-text-align | center |
| --amplify-components-fileuploader-dropzone-text-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-fileuploader-dropzone-text-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-fileuploader-dropzone-text-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-fileuploader-file-align-items | baseline |
| --amplify-components-fileuploader-file-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-fileuploader-file-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-fileuploader-file-border-radius | var(--amplify-radii-small) |
| --amplify-components-fileuploader-file-border-style | solid |
| --amplify-components-fileuploader-file-border-width | var(--amplify-border-widths-small) |
| --amplify-components-fileuploader-file-gap | var(--amplify-space-small) |
| --amplify-components-fileuploader-file-image-background-color | var(--amplify-colors-background-secondary) |
| --amplify-components-fileuploader-file-image-border-radius | var(--amplify-radii-small) |
| --amplify-components-fileuploader-file-image-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-fileuploader-file-image-height | var(--amplify-space-xxl) |
| --amplify-components-fileuploader-file-image-width | var(--amplify-space-xxl) |
| --amplify-components-fileuploader-file-name-color | var(--amplify-colors-font-primary) |
| --amplify-components-fileuploader-file-name-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-fileuploader-file-name-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-fileuploader-file-padding-block | var(--amplify-space-xs) |
| --amplify-components-fileuploader-file-padding-inline | var(--amplify-space-small) |
| --amplify-components-fileuploader-file-size-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-fileuploader-file-size-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-fileuploader-file-size-font-weight | var(--amplify-font-weights-normal) |
| --amplify-components-fileuploader-filelist-flex-direction | column |
| --amplify-components-fileuploader-filelist-gap | var(--amplify-space-small) |
| --amplify-components-fileuploader-loader-stroke-empty | var(--amplify-colors-border-secondary) |
| --amplify-components-fileuploader-loader-stroke-filled | var(--amplify-components-loader-stroke-filled) |
| --amplify-components-fileuploader-loader-stroke-linecap | round |
| --amplify-components-fileuploader-loader-stroke-width | var(--amplify-border-widths-large) |
| --amplify-components-fileuploader-previewer-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-fileuploader-previewer-body-gap | var(--amplify-space-small) |
| --amplify-components-fileuploader-previewer-body-padding-block | var(--amplify-space-medium) |
| --amplify-components-fileuploader-previewer-body-padding-inline | var(--amplify-space-medium) |
| --amplify-components-fileuploader-previewer-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-fileuploader-previewer-border-radius | var(--amplify-radii-small) |
| --amplify-components-fileuploader-previewer-border-style | solid |
| --amplify-components-fileuploader-previewer-border-width | var(--amplify-border-widths-small) |
| --amplify-components-fileuploader-previewer-footer-justify-content | flex-end |
| --amplify-components-fileuploader-previewer-max-height | 40rem |
| --amplify-components-fileuploader-previewer-max-width | auto |
| --amplify-components-fileuploader-previewer-padding-block | var(--amplify-space-zero) |
| --amplify-components-fileuploader-previewer-padding-inline | var(--amplify-space-zero) |
| --amplify-components-fileuploader-previewer-text-color | var(--amplify-colors-font-primary) |
| --amplify-components-fileuploader-previewer-text-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-fileuploader-previewer-text-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-flex-align-content | normal |
| --amplify-components-flex-align-items | stretch |
| --amplify-components-flex-flex-wrap | nowrap |
| --amplify-components-flex-gap | var(--amplify-space-medium) |
| --amplify-components-flex-justify-content | normal |
| --amplify-components-heading-1-font-size | var(--amplify-font-sizes-xxxxl) |
| --amplify-components-heading-1-font-weight | var(--amplify-font-weights-light) |
| --amplify-components-heading-2-font-size | var(--amplify-font-sizes-xxxl) |
| --amplify-components-heading-2-font-weight | var(--amplify-font-weights-normal) |
| --amplify-components-heading-3-font-size | var(--amplify-font-sizes-xxl) |
| --amplify-components-heading-3-font-weight | var(--amplify-font-weights-medium) |
| --amplify-components-heading-4-font-size | var(--amplify-font-sizes-xl) |
| --amplify-components-heading-4-font-weight | var(--amplify-font-weights-semibold) |
| --amplify-components-heading-5-font-size | var(--amplify-font-sizes-large) |
| --amplify-components-heading-5-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-heading-6-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-heading-6-font-weight | var(--amplify-font-weights-extrabold) |
| --amplify-components-heading-color | var(--amplify-colors-font-primary) |
| --amplify-components-heading-line-height | var(--amplify-line-heights-small) |
| --amplify-components-highlightmatch-highlighted-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-icon-height | 1em |
| --amplify-components-icon-line-height | 1 |
| --amplify-components-image-height | auto |
| --amplify-components-image-max-width | 100% |
| --amplify-components-image-object-fit | initial |
| --amplify-components-image-object-position | initial |
| --amplify-components-inappmessaging-banner-height | 150px |
| --amplify-components-inappmessaging-banner-width | 400px |
| --amplify-components-inappmessaging-button-background-color | #e8e8e8 |
| --amplify-components-inappmessaging-button-border-radius | 5px |
| --amplify-components-inappmessaging-button-color | black |
| --amplify-components-inappmessaging-dialog-height | 50vh |
| --amplify-components-inappmessaging-dialog-min-height | 400px |
| --amplify-components-inappmessaging-dialog-min-width | 400px |
| --amplify-components-inappmessaging-dialog-width | 30vw |
| --amplify-components-inappmessaging-header-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-inappmessaging-header-font-weight | var(--amplify-font-weights-extrabold) |
| --amplify-components-input-border-color | var(--amplify-components-fieldcontrol-border-color) |
| --amplify-components-input-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-input-focus-border-color | var(--amplify-components-fieldcontrol-focus-border-color) |
| --amplify-components-input-font-size | var(--amplify-components-fieldcontrol-font-size) |
| --amplify-components-link-active-color | var(--amplify-colors-font-active) |
| --amplify-components-link-color | var(--amplify-colors-font-interactive) |
| --amplify-components-link-focus-color | var(--amplify-colors-font-focus) |
| --amplify-components-link-hover-color | var(--amplify-colors-font-hover) |
| --amplify-components-link-visited-color | var(--amplify-colors-font-interactive) |
| --amplify-components-liveness-camera-module-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-loader-animation-duration | 1s |
| --amplify-components-loader-font-size | var(--amplify-font-sizes-xs) |
| --amplify-components-loader-height | var(--amplify-font-sizes-medium) |
| --amplify-components-loader-large-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-loader-large-height | var(--amplify-font-sizes-large) |
| --amplify-components-loader-large-width | var(--amplify-font-sizes-large) |
| --amplify-components-loader-linear-animation-duration | 1s |
| --amplify-components-loader-linear-font-size | var(--amplify-font-sizes-xxs) |
| --amplify-components-loader-linear-large-font-size | var(--amplify-font-sizes-xs) |
| --amplify-components-loader-linear-large-stroke-width | var(--amplify-font-sizes-xs) |
| --amplify-components-loader-linear-min-width | 5rem |
| --amplify-components-loader-linear-small-font-size | var(--amplify-font-sizes-xxxs) |
| --amplify-components-loader-linear-small-stroke-width | var(--amplify-font-sizes-xxxs) |
| --amplify-components-loader-linear-stroke-empty | var(--amplify-colors-neutral-20) |
| --amplify-components-loader-linear-stroke-filled | var(--amplify-colors-primary-80) |
| --amplify-components-loader-linear-stroke-linecap | round |
| --amplify-components-loader-linear-stroke-width | var(--amplify-font-sizes-xxs) |
| --amplify-components-loader-linear-width | 100% |
| --amplify-components-loader-small-font-size | var(--amplify-font-sizes-xxs) |
| --amplify-components-loader-small-height | var(--amplify-font-sizes-small) |
| --amplify-components-loader-small-width | var(--amplify-font-sizes-small) |
| --amplify-components-loader-stroke-empty | var(--amplify-colors-neutral-20) |
| --amplify-components-loader-stroke-filled | var(--amplify-colors-primary-80) |
| --amplify-components-loader-stroke-linecap | round |
| --amplify-components-loader-text-fill | var(--amplify-colors-font-primary) |
| --amplify-components-loader-width | var(--amplify-font-sizes-medium) |
| --amplify-components-menu-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-menu-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-menu-border-radius | var(--amplify-radii-medium) |
| --amplify-components-menu-border-style | solid |
| --amplify-components-menu-border-width | var(--amplify-border-widths-small) |
| --amplify-components-menu-box-shadow | var(--amplify-shadows-large) |
| --amplify-components-menu-flex-direction | column |
| --amplify-components-menu-gap | var(--amplify-space-zero) |
| --amplify-components-menu-item-min-height | 2.5rem |
| --amplify-components-menu-item-padding-inline-end | var(--amplify-space-medium) |
| --amplify-components-menu-item-padding-inline-start | var(--amplify-space-medium) |
| --amplify-components-menu-large-height | var(--amplify-font-sizes-xxxl) |
| --amplify-components-menu-large-width | var(--amplify-font-sizes-xxxl) |
| --amplify-components-menu-max-width | 30rem |
| --amplify-components-menu-min-width | 14rem |
| --amplify-components-menu-small-height | var(--amplify-font-sizes-medium) |
| --amplify-components-menu-small-width | var(--amplify-font-sizes-medium) |
| --amplify-components-message-align-items | center |
| --amplify-components-message-background-color | var(--amplify-colors-background-tertiary) |
| --amplify-components-message-border-color | transparent |
| --amplify-components-message-border-radius | var(--amplify-radii-xs) |
| --amplify-components-message-border-style | solid |
| --amplify-components-message-border-width | var(--amplify-border-widths-small) |
| --amplify-components-message-color | var(--amplify-colors-font-primary) |
| --amplify-components-message-dismiss-gap | var(--amplify-space-xxs) |
| --amplify-components-message-filled-background-color | var(--amplify-colors-background-secondary) |
| --amplify-components-message-filled-border-color | transparent |
| --amplify-components-message-filled-color | var(--amplify-colors-font-primary) |
| --amplify-components-message-filled-error-background-color | var(--amplify-colors-background-error) |
| --amplify-components-message-filled-error-border-color | transparent |
| --amplify-components-message-filled-error-color | var(--amplify-colors-font-error) |
| --amplify-components-message-filled-info-background-color | var(--amplify-colors-background-info) |
| --amplify-components-message-filled-info-border-color | transparent |
| --amplify-components-message-filled-info-color | var(--amplify-colors-font-info) |
| --amplify-components-message-filled-success-background-color | var(--amplify-colors-background-success) |
| --amplify-components-message-filled-success-border-color | transparent |
| --amplify-components-message-filled-success-color | var(--amplify-colors-font-success) |
| --amplify-components-message-filled-warning-background-color | var(--amplify-colors-background-warning) |
| --amplify-components-message-filled-warning-border-color | transparent |
| --amplify-components-message-filled-warning-color | var(--amplify-colors-font-warning) |
| --amplify-components-message-heading-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-message-heading-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-message-icon-size | var(--amplify-font-sizes-xl) |
| --amplify-components-message-justify-content | flex-start |
| --amplify-components-message-line-height | var(--amplify-line-heights-small) |
| --amplify-components-message-outlined-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-outlined-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-message-outlined-color | var(--amplify-colors-font-primary) |
| --amplify-components-message-outlined-error-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-outlined-error-border-color | var(--amplify-colors-border-error) |
| --amplify-components-message-outlined-error-color | var(--amplify-colors-font-error) |
| --amplify-components-message-outlined-info-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-outlined-info-border-color | var(--amplify-colors-border-info) |
| --amplify-components-message-outlined-info-color | var(--amplify-colors-font-info) |
| --amplify-components-message-outlined-success-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-outlined-success-border-color | var(--amplify-colors-border-success) |
| --amplify-components-message-outlined-success-color | var(--amplify-colors-font-success) |
| --amplify-components-message-outlined-warning-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-outlined-warning-border-color | var(--amplify-colors-border-warning) |
| --amplify-components-message-outlined-warning-color | var(--amplify-colors-font-warning) |
| --amplify-components-message-padding-block | var(--amplify-space-small) |
| --amplify-components-message-padding-inline | var(--amplify-space-medium) |
| --amplify-components-message-plain-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-plain-border-color | transparent |
| --amplify-components-message-plain-color | var(--amplify-colors-font-primary) |
| --amplify-components-message-plain-error-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-plain-error-border-color | transparent |
| --amplify-components-message-plain-error-color | var(--amplify-colors-font-error) |
| --amplify-components-message-plain-info-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-plain-info-border-color | transparent |
| --amplify-components-message-plain-info-color | var(--amplify-colors-font-info) |
| --amplify-components-message-plain-success-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-plain-success-border-color | transparent |
| --amplify-components-message-plain-success-color | var(--amplify-colors-font-success) |
| --amplify-components-message-plain-warning-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-message-plain-warning-border-color | transparent |
| --amplify-components-message-plain-warning-color | var(--amplify-colors-font-warning) |
| --amplify-components-pagination-button-color | var(--amplify-colors-font-primary) |
| --amplify-components-pagination-button-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-pagination-button-hover-background-color | var(--amplify-colors-overlay-10) |
| --amplify-components-pagination-button-hover-color | var(--amplify-colors-font-primary) |
| --amplify-components-pagination-button-padding-inline-end | var(--amplify-space-xxs) |
| --amplify-components-pagination-button-padding-inline-start | var(--amplify-space-xxs) |
| --amplify-components-pagination-button-transition-duration | var(--amplify-time-medium) |
| --amplify-components-pagination-button-transition-property | background-color |
| --amplify-components-pagination-current-align-items | center |
| --amplify-components-pagination-current-background-color | var(--amplify-colors-overlay-40) |
| --amplify-components-pagination-current-color | var(--amplify-colors-font-inverse) |
| --amplify-components-pagination-current-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-pagination-current-justify-content | center |
| --amplify-components-pagination-ellipsis-align-items | baseline |
| --amplify-components-pagination-ellipsis-justify-content | center |
| --amplify-components-pagination-ellipsis-padding-inline-end | var(--amplify-space-xs) |
| --amplify-components-pagination-ellipsis-padding-inline-start | var(--amplify-space-xs) |
| --amplify-components-pagination-item-container-margin-left | var(--amplify-space-xxxs) |
| --amplify-components-pagination-item-container-margin-right | var(--amplify-space-xxxs) |
| --amplify-components-pagination-item-shared-border-radius | var(--amplify-font-sizes-medium) |
| --amplify-components-pagination-item-shared-height | var(--amplify-font-sizes-xxl) |
| --amplify-components-pagination-item-shared-min-width | var(--amplify-font-sizes-xxl) |
| --amplify-components-passwordfield-button-active-background-color | var(--amplify-components-button-active-background-color) |
| --amplify-components-passwordfield-button-active-border-color | var(--amplify-components-button-active-border-color) |
| --amplify-components-passwordfield-button-active-color | var(--amplify-components-button-active-color) |
| --amplify-components-passwordfield-button-color | var(--amplify-components-button-color) |
| --amplify-components-passwordfield-button-disabled-background-color | var(--amplify-components-button-disabled-background-color) |
| --amplify-components-passwordfield-button-disabled-border-color | var(--amplify-components-button-disabled-border-color) |
| --amplify-components-passwordfield-button-disabled-color | var(--amplify-components-button-disabled-color) |
| --amplify-components-passwordfield-button-error-active-background-color | var(--amplify-components-button-outlined-error-active-background-color) |
| --amplify-components-passwordfield-button-error-active-border-color | var(--amplify-components-button-outlined-error-active-border-color) |
| --amplify-components-passwordfield-button-error-active-color | var(--amplify-components-button-outlined-error-active-color) |
| --amplify-components-passwordfield-button-error-background-color | var(--amplify-components-button-outlined-error-background-color) |
| --amplify-components-passwordfield-button-error-border-color | var(--amplify-components-button-outlined-error-border-color) |
| --amplify-components-passwordfield-button-error-color | var(--amplify-components-button-outlined-error-color) |
| --amplify-components-passwordfield-button-error-focus-background-color | var(--amplify-components-button-outlined-error-focus-background-color) |
| --amplify-components-passwordfield-button-error-focus-border-color | var(--amplify-components-button-outlined-error-focus-border-color) |
| --amplify-components-passwordfield-button-error-focus-box-shadow | var(--amplify-components-button-outlined-error-focus-box-shadow) |
| --amplify-components-passwordfield-button-error-focus-color | var(--amplify-components-button-outlined-error-focus-color) |
| --amplify-components-passwordfield-button-error-hover-background-color | var(--amplify-components-button-outlined-error-hover-background-color) |
| --amplify-components-passwordfield-button-error-hover-border-color | var(--amplify-components-button-outlined-error-hover-border-color) |
| --amplify-components-passwordfield-button-error-hover-color | var(--amplify-components-button-outlined-error-hover-color) |
| --amplify-components-passwordfield-button-focus-background-color | var(--amplify-components-button-focus-background-color) |
| --amplify-components-passwordfield-button-focus-border-color | var(--amplify-components-button-focus-border-color) |
| --amplify-components-passwordfield-button-focus-color | var(--amplify-components-button-focus-color) |
| --amplify-components-passwordfield-button-hover-background-color | var(--amplify-components-button-hover-background-color) |
| --amplify-components-passwordfield-button-hover-border-color | var(--amplify-components-button-hover-border-color) |
| --amplify-components-passwordfield-button-hover-color | var(--amplify-components-button-hover-color) |
| --amplify-components-passwordfield-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-phonenumberfield-border-color | var(--amplify-components-fieldcontrol-border-color) |
| --amplify-components-phonenumberfield-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-phonenumberfield-focus-border-color | var(--amplify-components-fieldcontrol-focus-border-color) |
| --amplify-components-phonenumberfield-font-size | var(--amplify-components-fieldcontrol-font-size) |
| --amplify-components-placeholder-border-radius | var(--amplify-radii-small) |
| --amplify-components-placeholder-default-height | var(--amplify-space-medium) |
| --amplify-components-placeholder-end-color | var(--amplify-colors-background-tertiary) |
| --amplify-components-placeholder-large-height | var(--amplify-space-large) |
| --amplify-components-placeholder-small-height | var(--amplify-space-small) |
| --amplify-components-placeholder-start-color | var(--amplify-colors-background-secondary) |
| --amplify-components-placeholder-transition-duration | var(--amplify-time-long) |
| --amplify-components-radio-align-items | center |
| --amplify-components-radio-button-align-items | center |
| --amplify-components-radio-button-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-radio-button-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-radio-button-border-radius | 50% |
| --amplify-components-radio-button-border-style | solid |
| --amplify-components-radio-button-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-radio-button-box-sizing | border-box |
| --amplify-components-radio-button-checked-color | var(--amplify-colors-primary-80) |
| --amplify-components-radio-button-checked-disabled-color | var(--amplify-colors-background-disabled) |
| --amplify-components-radio-button-color | var(--amplify-colors-background-primary) |
| --amplify-components-radio-button-disabled-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-radio-button-disabled-border-color | var(--amplify-colors-border-disabled) |
| --amplify-components-radio-button-error-border-color | var(--amplify-colors-border-error) |
| --amplify-components-radio-button-error-focus-box-shadow | var(--amplify-components-fieldcontrol-error-focus-box-shadow) |
| --amplify-components-radio-button-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-radio-button-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-radio-button-height | var(--amplify-font-sizes-medium) |
| --amplify-components-radio-button-justify-content | center |
| --amplify-components-radio-button-large-height | var(--amplify-font-sizes-large) |
| --amplify-components-radio-button-large-width | var(--amplify-font-sizes-large) |
| --amplify-components-radio-button-outline-color | var(--amplify-colors-transparent) |
| --amplify-components-radio-button-outline-offset | var(--amplify-outline-offsets-medium) |
| --amplify-components-radio-button-outline-style | solid |
| --amplify-components-radio-button-outline-width | var(--amplify-outline-widths-medium) |
| --amplify-components-radio-button-padding | var(--amplify-border-widths-medium) |
| --amplify-components-radio-button-small-height | var(--amplify-font-sizes-small) |
| --amplify-components-radio-button-small-width | var(--amplify-font-sizes-small) |
| --amplify-components-radio-button-transition-duration | var(--amplify-time-medium) |
| --amplify-components-radio-button-transition-property | all |
| --amplify-components-radio-button-width | var(--amplify-font-sizes-medium) |
| --amplify-components-radio-disabled-cursor | not-allowed |
| --amplify-components-radio-gap | inherit |
| --amplify-components-radio-justify-content | flex-start |
| --amplify-components-radio-label-color | var(--amplify-components-text-color) |
| --amplify-components-radio-label-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-radiogroup-legend-color | var(--amplify-components-fieldset-legend-color) |
| --amplify-components-radiogroup-legend-font-weight | var(--amplify-font-weights-normal) |
| --amplify-components-radiogroup-radio-background-color | var(--amplify-components-radio-button-background-color) |
| --amplify-components-radiogroup-radio-border-color | var(--amplify-components-radio-button-border-color) |
| --amplify-components-radiogroup-radio-border-width | var(--amplify-components-radio-button-border-width) |
| --amplify-components-radiogroup-radio-checked-color | var(--amplify-components-radio-button-checked-color) |
| --amplify-components-radiogroup-radio-label-color | var(--amplify-components-radio-label-color) |
| --amplify-components-rating-default-size | var(--amplify-font-sizes-xl) |
| --amplify-components-rating-empty-color | var(--amplify-colors-background-tertiary) |
| --amplify-components-rating-filled-color | var(--amplify-colors-secondary-80) |
| --amplify-components-rating-large-size | var(--amplify-font-sizes-xxxl) |
| --amplify-components-rating-small-size | var(--amplify-font-sizes-small) |
| --amplify-components-searchfield-button-active-background-color | var(--amplify-components-button-active-background-color) |
| --amplify-components-searchfield-button-active-border-color | var(--amplify-components-button-active-border-color) |
| --amplify-components-searchfield-button-active-color | var(--amplify-components-button-active-color) |
| --amplify-components-searchfield-button-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-searchfield-button-color | var(--amplify-components-button-color) |
| --amplify-components-searchfield-button-disabled-background-color | var(--amplify-components-button-disabled-background-color) |
| --amplify-components-searchfield-button-disabled-border-color | var(--amplify-components-button-disabled-border-color) |
| --amplify-components-searchfield-button-disabled-color | var(--amplify-components-button-disabled-color) |
| --amplify-components-searchfield-button-focus-background-color | var(--amplify-components-button-focus-background-color) |
| --amplify-components-searchfield-button-focus-border-color | var(--amplify-components-button-focus-border-color) |
| --amplify-components-searchfield-button-focus-color | var(--amplify-components-button-focus-color) |
| --amplify-components-searchfield-button-hover-background-color | var(--amplify-components-button-hover-background-color) |
| --amplify-components-searchfield-button-hover-border-color | var(--amplify-components-button-hover-border-color) |
| --amplify-components-searchfield-button-hover-color | var(--amplify-components-button-hover-color) |
| --amplify-components-searchfield-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-select-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-select-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-select-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-select-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-select-expanded-option-padding-block | var(--amplify-space-xs) |
| --amplify-components-select-expanded-option-padding-inline | var(--amplify-space-small) |
| --amplify-components-select-expanded-padding-block | var(--amplify-space-xs) |
| --amplify-components-select-expanded-padding-inline | var(--amplify-space-small) |
| --amplify-components-select-icon-wrapper-align-items | center |
| --amplify-components-select-icon-wrapper-large-right | var(--amplify-space-medium) |
| --amplify-components-select-icon-wrapper-pointer-events | none |
| --amplify-components-select-icon-wrapper-position | absolute |
| --amplify-components-select-icon-wrapper-right | var(--amplify-space-medium) |
| --amplify-components-select-icon-wrapper-small-right | var(--amplify-space-xs) |
| --amplify-components-select-icon-wrapper-top | 50% |
| --amplify-components-select-icon-wrapper-transform | translateY(-50%) |
| --amplify-components-select-large-min-width | 7.5rem |
| --amplify-components-select-large-padding-inline-end | var(--amplify-space-xxl) |
| --amplify-components-select-min-width | 6.5rem |
| --amplify-components-select-option-background-color | transparent |
| --amplify-components-select-option-color | var(--amplify-colors-font-primary) |
| --amplify-components-select-option-disabled-background-color | transparent |
| --amplify-components-select-option-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-select-padding-inline-end | var(--amplify-space-xxl) |
| --amplify-components-select-small-min-width | 5.5rem |
| --amplify-components-select-small-padding-inline-end | var(--amplify-space-xl) |
| --amplify-components-select-white-space | nowrap |
| --amplify-components-select-wrapper-cursor | pointer |
| --amplify-components-select-wrapper-display | block |
| --amplify-components-select-wrapper-flex | 1 |
| --amplify-components-select-wrapper-position | relative |
| --amplify-components-selectfield-border-color | var(--amplify-components-fieldcontrol-border-color) |
| --amplify-components-selectfield-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-selectfield-flex-direction | column |
| --amplify-components-selectfield-focus-border-color | var(--amplify-components-fieldcontrol-focus-border-color) |
| --amplify-components-selectfield-font-size | var(--amplify-components-fieldcontrol-font-size) |
| --amplify-components-selectfield-label-color | var(--amplify-components-field-label-color) |
| --amplify-components-sliderfield-large-thumb-height | 1.5rem |
| --amplify-components-sliderfield-large-thumb-width | 1.5rem |
| --amplify-components-sliderfield-large-track-height | 0.625rem |
| --amplify-components-sliderfield-padding-block | var(--amplify-space-xs) |
| --amplify-components-sliderfield-range-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-sliderfield-range-border-radius | 9999px |
| --amplify-components-sliderfield-range-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-sliderfield-small-thumb-height | 1rem |
| --amplify-components-sliderfield-small-thumb-width | 1rem |
| --amplify-components-sliderfield-small-track-height | 0.25rem |
| --amplify-components-sliderfield-thumb-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-sliderfield-thumb-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-sliderfield-thumb-border-radius | 50% |
| --amplify-components-sliderfield-thumb-border-style | solid |
| --amplify-components-sliderfield-thumb-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-sliderfield-thumb-box-shadow | var(--amplify-shadows-small) |
| --amplify-components-sliderfield-thumb-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-sliderfield-thumb-disabled-border-color | transparent |
| --amplify-components-sliderfield-thumb-disabled-box-shadow | none |
| --amplify-components-sliderfield-thumb-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-sliderfield-thumb-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-sliderfield-thumb-height | 1.25rem |
| --amplify-components-sliderfield-thumb-hover-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-sliderfield-thumb-hover-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-sliderfield-thumb-width | 1.25rem |
| --amplify-components-sliderfield-track-background-color | var(--amplify-colors-background-quaternary) |
| --amplify-components-sliderfield-track-border-radius | 9999px |
| --amplify-components-sliderfield-track-height | 0.375rem |
| --amplify-components-sliderfield-track-min-width | 10rem |
| --amplify-components-stepperfield-border-color | var(--amplify-components-fieldcontrol-border-color) |
| --amplify-components-stepperfield-button-active-background-color | var(--amplify-components-button-active-background-color) |
| --amplify-components-stepperfield-button-active-color | var(--amplify-components-button-active-color) |
| --amplify-components-stepperfield-button-background-color | var(--amplify-colors-transparent) |
| --amplify-components-stepperfield-button-color | var(--amplify-components-button-color) |
| --amplify-components-stepperfield-button-disabled-background-color | var(--amplify-components-fieldcontrol-disabled-background-color) |
| --amplify-components-stepperfield-button-disabled-color | var(--amplify-components-button-disabled-color) |
| --amplify-components-stepperfield-button-focus-background-color | var(--amplify-components-button-focus-background-color) |
| --amplify-components-stepperfield-button-focus-color | var(--amplify-components-button-focus-color) |
| --amplify-components-stepperfield-button-hover-background-color | var(--amplify-components-button-hover-background-color) |
| --amplify-components-stepperfield-button-hover-color | var(--amplify-components-button-hover-color) |
| --amplify-components-stepperfield-flex-direction | column |
| --amplify-components-stepperfield-input-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-stepperfield-input-font-size | var(--amplify-components-fieldcontrol-font-size) |
| --amplify-components-stepperfield-input-text-align | center |
| --amplify-components-storagemanager-dropzone-active-background-color | var(--amplify-colors-primary-10) |
| --amplify-components-storagemanager-dropzone-active-border-color | var(--amplify-colors-border-pressed) |
| --amplify-components-storagemanager-dropzone-active-border-radius | var(--amplify-components-storagemanager-dropzone-border-radius) |
| --amplify-components-storagemanager-dropzone-active-border-style | var(--amplify-components-storagemanager-dropzone-border-style) |
| --amplify-components-storagemanager-dropzone-active-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-storagemanager-dropzone-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-storagemanager-dropzone-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-storagemanager-dropzone-border-radius | var(--amplify-radii-small) |
| --amplify-components-storagemanager-dropzone-border-style | dashed |
| --amplify-components-storagemanager-dropzone-border-width | var(--amplify-border-widths-small) |
| --amplify-components-storagemanager-dropzone-gap | var(--amplify-space-small) |
| --amplify-components-storagemanager-dropzone-icon-color | var(--amplify-colors-border-primary) |
| --amplify-components-storagemanager-dropzone-icon-font-size | var(--amplify-font-sizes-xxl) |
| --amplify-components-storagemanager-dropzone-padding-block | var(--amplify-space-xl) |
| --amplify-components-storagemanager-dropzone-padding-inline | var(--amplify-space-large) |
| --amplify-components-storagemanager-dropzone-text-align | center |
| --amplify-components-storagemanager-dropzone-text-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-storagemanager-dropzone-text-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-storagemanager-dropzone-text-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-storagemanager-file-align-items | baseline |
| --amplify-components-storagemanager-file-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-storagemanager-file-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-storagemanager-file-border-radius | var(--amplify-radii-small) |
| --amplify-components-storagemanager-file-border-style | solid |
| --amplify-components-storagemanager-file-border-width | var(--amplify-border-widths-small) |
| --amplify-components-storagemanager-file-gap | var(--amplify-space-small) |
| --amplify-components-storagemanager-file-image-background-color | var(--amplify-colors-background-secondary) |
| --amplify-components-storagemanager-file-image-border-radius | var(--amplify-radii-small) |
| --amplify-components-storagemanager-file-image-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-storagemanager-file-image-height | var(--amplify-space-xxl) |
| --amplify-components-storagemanager-file-image-width | var(--amplify-space-xxl) |
| --amplify-components-storagemanager-file-name-color | var(--amplify-colors-font-primary) |
| --amplify-components-storagemanager-file-name-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-storagemanager-file-name-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-storagemanager-file-padding-block | var(--amplify-space-xs) |
| --amplify-components-storagemanager-file-padding-inline | var(--amplify-space-small) |
| --amplify-components-storagemanager-file-size-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-storagemanager-file-size-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-storagemanager-file-size-font-weight | var(--amplify-font-weights-normal) |
| --amplify-components-storagemanager-filelist-flex-direction | column |
| --amplify-components-storagemanager-filelist-gap | var(--amplify-space-small) |
| --amplify-components-storagemanager-loader-stroke-empty | var(--amplify-colors-border-secondary) |
| --amplify-components-storagemanager-loader-stroke-filled | var(--amplify-components-loader-stroke-filled) |
| --amplify-components-storagemanager-loader-stroke-linecap | round |
| --amplify-components-storagemanager-loader-stroke-width | var(--amplify-border-widths-large) |
| --amplify-components-storagemanager-previewer-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-storagemanager-previewer-body-gap | var(--amplify-space-small) |
| --amplify-components-storagemanager-previewer-body-padding-block | var(--amplify-space-medium) |
| --amplify-components-storagemanager-previewer-body-padding-inline | var(--amplify-space-medium) |
| --amplify-components-storagemanager-previewer-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-storagemanager-previewer-border-radius | var(--amplify-radii-small) |
| --amplify-components-storagemanager-previewer-border-style | solid |
| --amplify-components-storagemanager-previewer-border-width | var(--amplify-border-widths-small) |
| --amplify-components-storagemanager-previewer-footer-justify-content | flex-end |
| --amplify-components-storagemanager-previewer-max-height | 40rem |
| --amplify-components-storagemanager-previewer-max-width | auto |
| --amplify-components-storagemanager-previewer-padding-block | var(--amplify-space-zero) |
| --amplify-components-storagemanager-previewer-padding-inline | var(--amplify-space-zero) |
| --amplify-components-storagemanager-previewer-text-color | var(--amplify-colors-font-primary) |
| --amplify-components-storagemanager-previewer-text-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-storagemanager-previewer-text-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-switchfield-disabled-opacity | var(--amplify-opacities-60) |
| --amplify-components-switchfield-focused-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-switchfield-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-switchfield-label-padding | var(--amplify-space-xs) |
| --amplify-components-switchfield-large-font-size | var(--amplify-font-sizes-large) |
| --amplify-components-switchfield-small-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-switchfield-thumb-background-color | var(--amplify-colors-background-primary) |
| --amplify-components-switchfield-thumb-border-color | transparent |
| --amplify-components-switchfield-thumb-border-radius | var(--amplify-radii-xxxl) |
| --amplify-components-switchfield-thumb-border-style | solid |
| --amplify-components-switchfield-thumb-border-width | var(--amplify-border-widths-small) |
| --amplify-components-switchfield-thumb-checked-transform | var(--amplify-transforms-slide-x-medium) |
| --amplify-components-switchfield-thumb-transition-duration | var(--amplify-time-medium) |
| --amplify-components-switchfield-thumb-width | var(--amplify-space-relative-medium) |
| --amplify-components-switchfield-track-background-color | var(--amplify-colors-background-quaternary) |
| --amplify-components-switchfield-track-border-radius | var(--amplify-radii-xxxl) |
| --amplify-components-switchfield-track-checked-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-switchfield-track-error-background-color | var(--amplify-colors-background-error) |
| --amplify-components-switchfield-track-height | var(--amplify-space-relative-medium) |
| --amplify-components-switchfield-track-padding | var(--amplify-outline-widths-medium) |
| --amplify-components-switchfield-track-transition-duration | var(--amplify-time-short) |
| --amplify-components-switchfield-track-width | var(--amplify-space-relative-xl) |
| --amplify-components-table-body-display | table-row-group |
| --amplify-components-table-body-vertical-align | middle |
| --amplify-components-table-border-collapse | collapse |
| --amplify-components-table-caption-caption-side | bottom |
| --amplify-components-table-caption-color | var(--amplify-colors-font-primary) |
| --amplify-components-table-caption-display | table-caption |
| --amplify-components-table-caption-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-table-caption-large-font-size | var(--amplify-font-sizes-large) |
| --amplify-components-table-caption-small-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-table-caption-text-align | center |
| --amplify-components-table-caption-word-break | break-all |
| --amplify-components-table-data-border-color | var(--amplify-colors-border-tertiary) |
| --amplify-components-table-data-border-style | solid |
| --amplify-components-table-data-border-width | var(--amplify-border-widths-small) |
| --amplify-components-table-data-color | var(--amplify-colors-font-primary) |
| --amplify-components-table-data-display | table-cell |
| --amplify-components-table-data-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-table-data-font-weight | var(--amplify-font-weights-normal) |
| --amplify-components-table-data-large-font-size | var(--amplify-font-sizes-large) |
| --amplify-components-table-data-large-padding | var(--amplify-space-large) |
| --amplify-components-table-data-padding | var(--amplify-space-medium) |
| --amplify-components-table-data-small-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-table-data-small-padding | var(--amplify-space-xs) |
| --amplify-components-table-data-vertical-align | middle |
| --amplify-components-table-display | table |
| --amplify-components-table-foot-display | table-footer-group |
| --amplify-components-table-foot-vertical-align | middle |
| --amplify-components-table-head-display | table-header-group |
| --amplify-components-table-head-vertical-align | middle |
| --amplify-components-table-header-border-color | var(--amplify-colors-border-tertiary) |
| --amplify-components-table-header-border-style | solid |
| --amplify-components-table-header-border-width | var(--amplify-border-widths-small) |
| --amplify-components-table-header-color | var(--amplify-colors-font-primary) |
| --amplify-components-table-header-display | table-cell |
| --amplify-components-table-header-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-table-header-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-table-header-large-font-size | var(--amplify-font-sizes-large) |
| --amplify-components-table-header-large-padding | var(--amplify-space-large) |
| --amplify-components-table-header-padding | var(--amplify-space-medium) |
| --amplify-components-table-header-small-font-size | var(--amplify-font-sizes-small) |
| --amplify-components-table-header-small-padding | var(--amplify-space-xs) |
| --amplify-components-table-header-vertical-align | middle |
| --amplify-components-table-row-display | table-row |
| --amplify-components-table-row-hover-background-color | var(--amplify-colors-background-tertiary) |
| --amplify-components-table-row-striped-background-color | var(--amplify-colors-background-secondary) |
| --amplify-components-table-row-vertical-align | middle |
| --amplify-components-table-width | 100% |
| --amplify-components-tabs-background-color | transparent |
| --amplify-components-tabs-border-color | var(--amplify-colors-border-secondary) |
| --amplify-components-tabs-border-style | solid |
| --amplify-components-tabs-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-tabs-gap | 0 |
| --amplify-components-tabs-item-active-background-color | transparent |
| --amplify-components-tabs-item-active-border-color | var(--amplify-colors-font-interactive) |
| --amplify-components-tabs-item-active-box-shadow | none |
| --amplify-components-tabs-item-active-color | var(--amplify-colors-font-interactive) |
| --amplify-components-tabs-item-background-color | transparent |
| --amplify-components-tabs-item-border-color | var(--amplify-colors-border-secondary) |
| --amplify-components-tabs-item-border-style | solid |
| --amplify-components-tabs-item-border-width | var(--amplify-border-widths-medium) |
| --amplify-components-tabs-item-color | var(--amplify-colors-font-secondary) |
| --amplify-components-tabs-item-disabled-background-color | transparent |
| --amplify-components-tabs-item-disabled-border-color | var(--amplify-colors-border-tertiary) |
| --amplify-components-tabs-item-disabled-box-shadow | none |
| --amplify-components-tabs-item-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-tabs-item-focus-background-color | transparent |
| --amplify-components-tabs-item-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-tabs-item-focus-box-shadow | 0px 0px 0px var(--amplify-border-widths-medium) var(--amplify-colors-border-focus) |
| --amplify-components-tabs-item-focus-color | var(--amplify-colors-font-focus) |
| --amplify-components-tabs-item-font-size | var(--amplify-font-sizes-medium) |
| --amplify-components-tabs-item-font-weight | var(--amplify-font-weights-bold) |
| --amplify-components-tabs-item-hover-background-color | transparent |
| --amplify-components-tabs-item-hover-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-tabs-item-hover-box-shadow | none |
| --amplify-components-tabs-item-hover-color | var(--amplify-colors-font-hover) |
| --amplify-components-tabs-item-padding-horizontal | var(--amplify-space-medium) |
| --amplify-components-tabs-item-padding-vertical | var(--amplify-space-small) |
| --amplify-components-tabs-item-text-align | center |
| --amplify-components-tabs-item-transition-duration | var(--amplify-time-medium) |
| --amplify-components-tabs-panel-background-color | transparent |
| --amplify-components-tabs-panel-padding-block | var(--amplify-space-small) |
| --amplify-components-tabs-panel-padding-inline | 0 |
| --amplify-components-text-color | var(--amplify-colors-font-primary) |
| --amplify-components-text-error-color | var(--amplify-colors-font-error) |
| --amplify-components-text-info-color | var(--amplify-colors-font-info) |
| --amplify-components-text-primary-color | var(--amplify-colors-font-primary) |
| --amplify-components-text-secondary-color | var(--amplify-colors-font-secondary) |
| --amplify-components-text-success-color | var(--amplify-colors-font-success) |
| --amplify-components-text-tertiary-color | var(--amplify-colors-font-tertiary) |
| --amplify-components-text-warning-color | var(--amplify-colors-font-warning) |
| --amplify-components-textareafield-border-color | var(--amplify-components-fieldcontrol-border-color) |
| --amplify-components-textareafield-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-textareafield-focus-border-color | var(--amplify-components-fieldcontrol-focus-border-color) |
| --amplify-components-textfield-border-color | var(--amplify-components-fieldcontrol-border-color) |
| --amplify-components-textfield-color | var(--amplify-components-fieldcontrol-color) |
| --amplify-components-textfield-focus-border-color | var(--amplify-components-fieldcontrol-focus-border-color) |
| --amplify-components-textfield-font-size | var(--amplify-components-fieldcontrol-font-size) |
| --amplify-components-togglebutton-active-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-border-color | var(--amplify-colors-border-primary) |
| --amplify-components-togglebutton-color | var(--amplify-colors-font-primary) |
| --amplify-components-togglebutton-disabled-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-disabled-border-color | var(--amplify-colors-border-disabled) |
| --amplify-components-togglebutton-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-togglebutton-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-togglebutton-focus-color | var(--amplify-colors-font-primary) |
| --amplify-components-togglebutton-hover-background-color | var(--amplify-colors-overlay-10) |
| --amplify-components-togglebutton-link-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-link-color | var(--amplify-colors-overlay-50) |
| --amplify-components-togglebutton-link-disabled-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-link-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-togglebutton-link-focus-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-link-focus-color | var(--amplify-colors-overlay-50) |
| --amplify-components-togglebutton-link-hover-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-link-hover-color | var(--amplify-colors-overlay-50) |
| --amplify-components-togglebutton-link-pressed-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-link-pressed-color | var(--amplify-colors-overlay-90) |
| --amplify-components-togglebutton-link-pressed-focus-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-link-pressed-focus-color | var(--amplify-colors-overlay-90) |
| --amplify-components-togglebutton-link-pressed-hover-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-link-pressed-hover-color | var(--amplify-colors-overlay-90) |
| --amplify-components-togglebutton-pressed-background-color | var(--amplify-colors-overlay-20) |
| --amplify-components-togglebutton-pressed-border-color | var(--amplify-colors-border-pressed) |
| --amplify-components-togglebutton-pressed-color | var(--amplify-colors-font-primary) |
| --amplify-components-togglebutton-pressed-hover-background-color | var(--amplify-colors-overlay-30) |
| --amplify-components-togglebutton-primary-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-primary-border-width | var(--amplify-border-widths-small) |
| --amplify-components-togglebutton-primary-disabled-background-color | var(--amplify-colors-background-disabled) |
| --amplify-components-togglebutton-primary-disabled-border-color | var(--amplify-colors-border-disabled) |
| --amplify-components-togglebutton-primary-disabled-color | var(--amplify-colors-font-disabled) |
| --amplify-components-togglebutton-primary-focus-background-color | var(--amplify-colors-transparent) |
| --amplify-components-togglebutton-primary-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-togglebutton-primary-focus-box-shadow | var(--amplify-components-fieldcontrol-focus-box-shadow) |
| --amplify-components-togglebutton-primary-focus-color | var(--amplify-colors-font-primary) |
| --amplify-components-togglebutton-primary-hover-background-color | var(--amplify-colors-overlay-10) |
| --amplify-components-togglebutton-primary-hover-color | var(--amplify-colors-font-primary) |
| --amplify-components-togglebutton-primary-pressed-background-color | var(--amplify-colors-primary-80) |
| --amplify-components-togglebutton-primary-pressed-border-color | var(--amplify-colors-primary-80) |
| --amplify-components-togglebutton-primary-pressed-color | var(--amplify-colors-background-primary) |
| --amplify-components-togglebutton-primary-pressed-focus-background-color | var(--amplify-colors-border-focus) |
| --amplify-components-togglebutton-primary-pressed-focus-border-color | var(--amplify-colors-border-focus) |
| --amplify-components-togglebutton-primary-pressed-focus-color | var(--amplify-colors-background-primary) |
| --amplify-components-togglebutton-primary-pressed-hover-background-color | var(--amplify-colors-primary-60) |
| --amplify-components-togglebutton-primary-pressed-hover-border-color | var(--amplify-colors-primary-60) |
| --amplify-components-togglebutton-primary-pressed-hover-box-shadow | var(--amplify-colors-primary-60) |
| --amplify-components-togglebutton-primary-pressed-hover-color | var(--amplify-colors-background-primary) |
| --amplify-components-togglebuttongroup-align-content | center |
| --amplify-components-togglebuttongroup-align-items | center |
| --amplify-components-togglebuttongroup-justify-content | flex-start |
| --amplify-font-sizes-large | 1.25rem |
| --amplify-font-sizes-medium | 1rem |
| --amplify-font-sizes-small | 0.875rem |
| --amplify-font-sizes-xl | 1.5rem |
| --amplify-font-sizes-xs | 0.75rem |
| --amplify-font-sizes-xxl | 2rem |
| --amplify-font-sizes-xxs | 0.5rem |
| --amplify-font-sizes-xxxl | 2.5rem |
| --amplify-font-sizes-xxxs | 0.375rem |
| --amplify-font-sizes-xxxxl | 3rem |
| --amplify-font-weights-black | 900 |
| --amplify-font-weights-bold | 700 |
| --amplify-font-weights-extrabold | 800 |
| --amplify-font-weights-hairline | 100 |
| --amplify-font-weights-light | 300 |
| --amplify-font-weights-medium | 500 |
| --amplify-font-weights-normal | 400 |
| --amplify-font-weights-semibold | 600 |
| --amplify-font-weights-thin | 200 |
| --amplify-fonts-default-static | 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', sans-serif |
| --amplify-fonts-default-variable | 'InterVariable', 'Inter var', 'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Segoe UI', Oxygen, Ubuntu, Cantarell, 'Open Sans', sans-serif |
| --amplify-line-heights-large | 2 |
| --amplify-line-heights-medium | 1.5 |
| --amplify-line-heights-small | 1.25 |
| --amplify-opacities-0 | 0 |
| --amplify-opacities-10 | 0.1 |
| --amplify-opacities-100 | 1 |
| --amplify-opacities-20 | 0.2 |
| --amplify-opacities-30 | 0.3 |
| --amplify-opacities-40 | 0.4 |
| --amplify-opacities-50 | 0.5 |
| --amplify-opacities-60 | 0.6 |
| --amplify-opacities-70 | 0.7 |
| --amplify-opacities-80 | 0.8 |
| --amplify-opacities-90 | 0.9 |
| --amplify-outline-offsets-large | 3px |
| --amplify-outline-offsets-medium | 2px |
| --amplify-outline-offsets-small | 1px |
| --amplify-outline-widths-large | 3px |
| --amplify-outline-widths-medium | 2px |
| --amplify-outline-widths-small | 1px |
| --amplify-radii-large | 1rem |
| --amplify-radii-medium | 0.5rem |
| --amplify-radii-small | 0.25rem |
| --amplify-radii-xl | 2rem |
| --amplify-radii-xs | 0.125rem |
| --amplify-radii-xxl | 4rem |
| --amplify-radii-xxxl | 8rem |
| --amplify-shadows-large | 0px 4px 12px var(--amplify-colors-shadow-primary) |
| --amplify-shadows-medium | 0px 2px 6px var(--amplify-colors-shadow-secondary) |
| --amplify-shadows-small | 0px 2px 4px var(--amplify-colors-shadow-tertiary) |
| --amplify-space-large | 1.5rem |
| --amplify-space-medium | 1rem |
| --amplify-space-relative-full | 100% |
| --amplify-space-relative-large | 1.5em |
| --amplify-space-relative-medium | 1em |
| --amplify-space-relative-small | 0.75em |
| --amplify-space-relative-xl | 2.0em |
| --amplify-space-relative-xs | 0.5em |
| --amplify-space-relative-xxl | 3.0em |
| --amplify-space-relative-xxs | 0.375em |
| --amplify-space-relative-xxxl | 4.5em |
| --amplify-space-relative-xxxs | 0.25em |
| --amplify-space-small | 0.75rem |
| --amplify-space-xl | 2.0rem |
| --amplify-space-xs | 0.5rem |
| --amplify-space-xxl | 3.0rem |
| --amplify-space-xxs | 0.375rem |
| --amplify-space-xxxl | 4.5rem |
| --amplify-space-xxxs | 0.25rem |
| --amplify-space-zero | 0 |
| --amplify-time-long | 500ms |
| --amplify-time-medium | 250ms |
| --amplify-time-short | 100ms |
| --amplify-transforms-slide-x-large | translateX(2em) |
| --amplify-transforms-slide-x-medium | translateX(1em) |
| --amplify-transforms-slide-x-small | translateX(0.5em) |