> Theme

> Css variables

Variables CSS

575 variables injectées dans :root par le ThemeProvider sur web. Cliquez sur une ligne pour copier le nom de la variable.color: var(--background-action-high-primary);

--background-alt-primary#F2F9FF⎘

--background-alt-grey#F6F7F8⎘

--background-action-low-primary#D2E8FE⎘

--background-contrast-grey#EFF1F6⎘

--background-contrast-success#B9FDD5⎘

--background-contrast-error#FDEAE8⎘

--background-contrast-info#E5F1FE⎘

--background-contrast-warning#FFEEE5⎘

--background-default-grey#FFFFFF⎘

--background-default-grey-hover#F6F7F8⎘

--background-default-grey-active#E6EAF1⎘

--background-active-primary#002764⎘

--background-disabled-grey#E6EAF1⎘

--background-active-inverted#FFFFFF⎘

--background-transparent-hoverrgba(0, 0, 0, 0.04)⎘

--background-action-high-primary#002764⎘

--background-action-high-primary-hover#0048AC⎘

--background-action-high-error#C62416⎘

--background-flat-error#C62416⎘

--background-flat-info#0264C7⎘

--background-flat-success#1B7440⎘

--background-flat-warning#BC4401⎘

--background-open-primary#D2E8FE⎘

--text-title-grey#151617⎘

--text-title-primary#002764⎘

--text-default-grey#373A3F⎘

--text-mention-grey#5F6571⎘

--text-label-grey#151617⎘

--text-action-high-primary#012B53⎘

--text-action-high-grey#151617⎘

--text-action-high-info#0264C7⎘

--text-action-high-warning#BC4401⎘

--text-action-high-error#C62416⎘

--text-inverted-grey#FFFFFF⎘

--text-inverted-primary#F2F9FF⎘

--text-active-primary#002764⎘

--text-active-grey#151617⎘

--text-disabled-grey#8D97AC⎘

--text-default-success#1B7440⎘

--text-default-error#C62416⎘

--text-default-warning#BC4401⎘

--text-default-info#0264C7⎘

--border-default-grey#DEE3EC⎘

--border-contrast-grey#8D97AC⎘

--border-default-primary#0264C7⎘

--border-action-high-primary#002764⎘

--border-action-high-grey#151617⎘

--border-active-primary#002764⎘

--border-open-primary#D2E8FE⎘

--border-disabled-grey#E6EAF1⎘

--border-plain-primary#002764⎘

--border-plain-grey#373A3F⎘

--border-plain-success#1B7440⎘

--border-plain-error#C62416⎘

--border-plain-warning#BC4401⎘

--border-plain-info#0264C7⎘

--border-action-low-primary#B4D9FE⎘

--artwork-major-primary#033B72⎘

--artwork-decorative-primary#E5F1FE⎘

--artwork-minor-secondary#DA2275⎘

--system-focus#0A76F6⎘

--spacing-10016px⎘

--spacing-15024px⎘

--spacing-20032px⎘

--spacing-30048px⎘

--spacing-40064px⎘

--spacing-50080px⎘

--spacing-60096px⎘

--spacing-800128px⎘

--spacing-1200193px⎘

--spacing-1600256px⎘

--spacing-2400384px⎘

--spacing-3200512px⎘

--spacing-4000640px⎘

--spacing-4800768px⎘

--spacing-0000px⎘

--spacing-0254px⎘

--spacing-03756px⎘

--spacing-0508px⎘

--spacing-07512px⎘

--spacing-0v0px⎘

--spacing-0-5v2px⎘

--spacing-1v4px⎘

--spacing-1-5v6px⎘

--spacing-1w8px⎘

--spacing-3v12px⎘

--spacing-2w16px⎘

--spacing-3w24px⎘

--spacing-4w32px⎘

--spacing-5w40px⎘

--spacing-6w48px⎘

--spacing-8w64px⎘

--spacing-12w96px⎘

--spacing-15w120px⎘

--radius-sm4px⎘

--radius-md6px⎘

--radius-lg10px⎘

--radius-full99999px⎘

--elevation-0none⎘

--elevation-10px 1px 2px rgba(21,22,23,0.10), 0px 0px 1px rgba(21,22,23,0.04)⎘

--elevation-20px 2px 4px rgba(21,22,23,0.10), 0px 1px 2px rgba(21,22,23,0.06)⎘

--elevation-30px 4px 8px rgba(21,22,23,0.12), 0px 2px 4px rgba(21,22,23,0.07)⎘

--elevation-40px 6px 12px rgba(21,22,23,0.14), 0px 3px 6px rgba(21,22,23,0.08)⎘

--elevation-raised0 2px 6px 0 rgba(1, 43, 83, 0.16)⎘

--elevation-overlap0 4px 12px 0 rgba(1, 43, 83, 0.16)⎘

--elevation-lifted0 6px 18px 0 rgba(1, 43, 83, 0.16)⎘

Alveole UI Kit — v1.9.0