86 lines
2.9 KiB
CSS
86 lines
2.9 KiB
CSS
:root {
|
|
--color-blue-scale-000: #000000;
|
|
--color-blue-scale-100: #1a1b38;
|
|
--color-blue-scale-200: #595a6f;
|
|
--color-blue-scale-300: #9899a5;
|
|
--color-blue-scale-400: #e5e5e7;
|
|
--color-blue-scale-500: #ffffff;
|
|
|
|
--color-extra-blue-l60: #d1cefb;
|
|
--color-extra-blue-l40: #bbb5f9;
|
|
--color-extra-blue-l20: #a39df8;
|
|
--color-extra-blue-base: #8f84ff;
|
|
--color-extra-blue-d20: #716ac6;
|
|
--color-extra-blue-d40: #554f94;
|
|
--color-extra-blue-d60: #383563;
|
|
|
|
--color-green-infra-l60: #b5dbca;
|
|
--color-green-infra-l40: #91c9b0;
|
|
--color-green-infra-l20: #70b795;
|
|
--color-green-infra-base: #55a57b;
|
|
--color-green-infra-d20: #438463;
|
|
--color-green-infra-d40: #32634a;
|
|
--color-green-infra-d60: #214231;
|
|
|
|
--color-orange-world-l60: #f2cda8;
|
|
--color-orange-world-l40: #ebb57d;
|
|
--color-orange-world-l20: #e59d56;
|
|
--color-orange-world-base: #ef7f18;
|
|
--color-orange-world-d20: #bf6612;
|
|
--color-orange-world-d40: #864f1f;
|
|
--color-orange-world-d60: #5a3514;
|
|
|
|
--color-red-vates-l60: #dda5a7;
|
|
--color-red-vates-l40: #ce787c;
|
|
--color-red-vates-l20: #bf4f51;
|
|
--color-red-vates-base: #be1621;
|
|
--color-red-vates-d20: #8e2221;
|
|
--color-red-vates-d40: #6a1919;
|
|
--color-red-vates-d60: #471010;
|
|
|
|
--color-grayscale-200: #585757;
|
|
|
|
--background-color-primary: #ffffff;
|
|
--background-color-secondary: #f6f6f7;
|
|
--background-color-extra-blue: #f4f3fe;
|
|
--background-color-green-infra: #ecf5f2;
|
|
--background-color-orange-world: #fbf2e9;
|
|
--background-color-red-vates: #f5e8e9;
|
|
|
|
--shadow-100: 0 0.1rem 0.1rem rgba(20, 20, 30, 0.06);
|
|
--shadow-200: 0 0.1rem 0.3rem rgba(20, 20, 30, 0.1),
|
|
0 0.2rem 0.1rem rgba(20, 20, 30, 0.06),
|
|
0 0.1rem 0.1rem rgba(20, 20, 30, 0.08);
|
|
--shadow-300: 0 0.3rem 0.5rem rgba(20, 20, 30, 0.1),
|
|
0 0.1rem 1.8rem rgba(20, 20, 30, 0.06), 0 0.6rem 1rem rgba(20, 20, 30, 0.08);
|
|
--shadow-400: 0 1.1rem 1.5rem rgba(20, 20, 30, 0.1),
|
|
0 0.9rem 4.6rem rgba(20, 20, 30, 0.06),
|
|
0 2.4rem 3.8rem rgba(20, 20, 30, 0.04);
|
|
}
|
|
|
|
:root.dark {
|
|
--color-blue-scale-000: #ffffff;
|
|
--color-blue-scale-100: #e5e5e7;
|
|
--color-blue-scale-200: #9899a5;
|
|
--color-blue-scale-300: #595a6f;
|
|
--color-blue-scale-400: #1a1b38;
|
|
--color-blue-scale-500: #000000;
|
|
|
|
--background-color-primary: #14141d;
|
|
--background-color-secondary: #17182a;
|
|
--background-color-extra-blue: #35335d;
|
|
--background-color-green-infra: #243b3d;
|
|
--background-color-orange-world: #493328;
|
|
--background-color-red-vates: #3c1a28;
|
|
|
|
--shadow-100: 0 0.1rem 0.1rem rgba(20, 20, 30, 0.12);
|
|
--shadow-200: 0 0.1rem 0.3rem rgba(20, 20, 30, 0.2),
|
|
0 0.2rem 0.1rem rgba(20, 20, 30, 0.12),
|
|
0 0.1rem 0.1rem rgba(20, 20, 30, 0.16);
|
|
--shadow-300: 0 0.3rem 0.5rem rgba(20, 20, 30, 0.2),
|
|
0 0.1rem 1.8rem rgba(20, 20, 30, 0.12), 0 0.6rem 1rem rgba(20, 20, 30, 0.16);
|
|
--shadow-400: 0 1.1rem 1.5rem rgba(20, 20, 30, 0.2),
|
|
0 0.9rem 4.6rem rgba(20, 20, 30, 0.12),
|
|
0 2.4rem 3.8rem rgba(20, 20, 30, 0.08);
|
|
}
|