$bp-xs: 28em; $bp-s: 40em; $bp-m: 50em; $bp-l: 80em; $z-index__header: 100; $color-primary-100: #eff8ff; $color-primary-200: #aad4f5; $color-primary-300: #63a2d8; $color-primary-400: #3183c8; $color-primary-500: #2368a2; $color-primary-600: #1a4971; $color-primary-700: #203d54; // $color-primary-800: #203d54; // $color-primary-900: #203d54; $color-neutral-100: #f8f9fa; $color-neutral-200: #e1e7ec; $color-neutral-300: #cfd6de; $color-neutral-400: #b8c4ce; $color-neutral-500: #8895a7; $color-neutral-600: #5f6b7a; $color-neutral-700: #212934; // $color-neutral-800: #212934; // $color-neutral-900: #212934; $color-accent-primary-100: #e3fcec; $color-accent-primary-200: #a8eec1; $color-accent-primary-300: #74d99f; $color-accent-primary-400: #38c172; $color-accent-primary-500: #259d58; $color-accent-primary-600: #197741; $color-accent-primary-700: #145239; // $color-accent-primary-800: #145239; // $color-accent-primary-900: #145239; $color-accent-secondary-100: #fce8e8; $color-accent-secondary-200: #f5aaaa; $color-accent-secondary-300: #e46464; $color-accent-secondary-400: #dc3030; $color-accent-secondary-500: #b82020; $color-accent-secondary-600: #891b1b; $color-accent-secondary-700: #611818; // $color-accent-secondary-800: #611818; // $color-accent-secondary-900: #611818; // $color-accent-tertiary-100: #e7ffee; // $color-accent-quaternary-100: #fffcf4; // $color-accent-quinary-100: #ffeefc; $color-color__body: $color-neutral-600; $color-color-bg: $color-neutral-100; :root { --primary-100: #{$color-primary-100}; --primary-200: #{$color-primary-200}; --primary-300: #{$color-primary-300}; --primary-400: #{$color-primary-400}; --primary-500: #{$color-primary-500}; --primary-600: #{$color-primary-600}; --primary-700: #{$color-primary-700}; // --primary-800: #{$color-primary-800}; // --primary-900: #{$color-primary-900}; --neutral-100: #{$color-neutral-100}; --neutral-200: #{$color-neutral-200}; --neutral-300: #{$color-neutral-300}; --neutral-400: #{$color-neutral-400}; --neutral-500: #{$color-neutral-500}; --neutral-600: #{$color-neutral-600}; --neutral-700: #{$color-neutral-700}; // --neutral-800: #{$color-neutral-800}; // --neutral-900: #{$color-neutral-900}; --accent-primary-100: #{$color-accent-primary-100}; --accent-primary-200: #{$color-accent-primary-200}; --accent-primary-300: #{$color-accent-primary-300}; --accent-primary-400: #{$color-accent-primary-400}; --accent-primary-500: #{$color-accent-primary-500}; --accent-primary-600: #{$color-accent-primary-600}; --accent-primary-700: #{$color-accent-primary-700}; //--accent-primary-800: #{$color-accent-primary-800}; //--accent-primary-900: #{$color-accent-primary-900}; --accent-secondary-100: #{$color-accent-secondary-100}; --accent-secondary-200: #{$color-accent-secondary-200}; --accent-secondary-300: #{$color-accent-secondary-300}; --accent-secondary-400: #{$color-accent-secondary-400}; --accent-secondary-500: #{$color-accent-secondary-500}; --accent-secondary-600: #{$color-accent-secondary-600}; --accent-secondary-700: #{$color-accent-secondary-700}; //--accent-secondary-800: #{$color-accent-secondary-800}; //--accent-secondary-900: #{$color-accent-secondary-900}; //--accent-tertiary-100: #{$color-color-accent-tertiary-100}; //--accent-quaternary-100: #{$color-accent-quaternary-100}; //--accent-quinary-100: #{$color-accent-quinary-100}; --color__body: var(--neutral-600); --color-bg: var(--neutral-100); }