@maggioli-design-system/design-tokens/dist/css/colors-hex-brand.css

This is the Design Token library of Maggioli Design System, here you'll find all the visual data used around the libraries.

/*
@magma-design-system/design-tokens v14.1.0
Generated by Style Dictionary
Do not edit directly
Generated at Mon, 08 Jun 2026 14:52:24 GMT
*/

:root {
  --hex-brand-maggioli-01: #092252;
  --hex-brand-maggioli-02: #022e82;
  --hex-brand-maggioli-03: #013fb4;
  --hex-brand-maggioli-04: #125be3;
  --hex-brand-maggioli-05: #4a7ee0;
  --hex-brand-maggioli-06: #91aada;
  --hex-brand-maggioli-07: #b2c0dc;
  --hex-brand-maggioli-08: #ccd4e2;
  --hex-brand-maggioli-09: #e6e8ec;
  --hex-brand-maggioli-10: #edeef1;
  --hex-brand-maggioli: #00379e;
  --hex-brand-maggioli-editore-01: #182542;
  --hex-brand-maggioli-editore-02: #173274;
  --hex-brand-maggioli-editore-03: #1040b3;
  --hex-brand-maggioli-editore-04: #1957eb;
  --hex-brand-maggioli-editore-05: #517de4;
  --hex-brand-maggioli-editore-06: #93a9df;
  --hex-brand-maggioli-editore-07: #b3c0e0;
  --hex-brand-maggioli-editore-08: #cdd3e4;
  --hex-brand-maggioli-editore-09: #e6e8ed;
  --hex-brand-maggioli-editore-10: #edeef1;
  --hex-brand-maggioli-editore: #0f4ad5;
}

:root:not(.pref-theme-scheme-light).pref-theme-dark,
:root.pref-theme-scheme-dark {
  --hex-brand-maggioli-01: #f6f6f7;
  --hex-brand-maggioli-02: #edeef1;
  --hex-brand-maggioli-03: #dee2e8;
  --hex-brand-maggioli-04: #c8d0e1;
  --hex-brand-maggioli-05: #acbcdc;
  --hex-brand-maggioli-06: #7296db;
  --hex-brand-maggioli-07: #447ae1;
  --hex-brand-maggioli-08: #1058e0;
  --hex-brand-maggioli-09: #003aa7;
  --hex-brand-maggioli-10: #01318d;
  --hex-brand-maggioli: #00379e;
  --hex-brand-maggioli-editore-01: #f6f6f7;
  --hex-brand-maggioli-editore-02: #edeef1;
  --hex-brand-maggioli-editore-03: #dee2ea;
  --hex-brand-maggioli-editore-04: #c8d0e3;
  --hex-brand-maggioli-editore-05: #acbbdf;
  --hex-brand-maggioli-editore-06: #7595e0;
  --hex-brand-maggioli-editore-07: #4a78e5;
  --hex-brand-maggioli-editore-08: #1454ec;
  --hex-brand-maggioli-editore-09: #123ca1;
  --hex-brand-maggioli-editore-10: #153581;
  --hex-brand-maggioli-editore: #0f4ad5;
}

@media (prefers-color-scheme: dark) {
  :root:not(.pref-theme-scheme-light).pref-theme-system,
  :root:not([data-magma-pref]) {
    --hex-brand-maggioli-01: #f6f6f7;
    --hex-brand-maggioli-02: #edeef1;
    --hex-brand-maggioli-03: #dee2e8;
    --hex-brand-maggioli-04: #c8d0e1;
    --hex-brand-maggioli-05: #acbcdc;
    --hex-brand-maggioli-06: #7296db;
    --hex-brand-maggioli-07: #447ae1;
    --hex-brand-maggioli-08: #1058e0;
    --hex-brand-maggioli-09: #003aa7;
    --hex-brand-maggioli-10: #01318d;
    --hex-brand-maggioli: #00379e;
    --hex-brand-maggioli-editore-01: #f6f6f7;
    --hex-brand-maggioli-editore-02: #edeef1;
    --hex-brand-maggioli-editore-03: #dee2ea;
    --hex-brand-maggioli-editore-04: #c8d0e3;
    --hex-brand-maggioli-editore-05: #acbbdf;
    --hex-brand-maggioli-editore-06: #7595e0;
    --hex-brand-maggioli-editore-07: #4a78e5;
    --hex-brand-maggioli-editore-08: #1454ec;
    --hex-brand-maggioli-editore-09: #123ca1;
    --hex-brand-maggioli-editore-10: #153581;
    --hex-brand-maggioli-editore: #0f4ad5;
  }
}