70 lines
1.7 KiB
SCSS
70 lines
1.7 KiB
SCSS
@mixin palette {
|
|
--color-white: #fff;
|
|
--color-black: #000;
|
|
|
|
// Grey
|
|
--color-grey-50: #f6f6f9;
|
|
--color-grey-100: #eeedf3;
|
|
--color-grey-200: #d7d6e1;
|
|
--color-grey-300: #b2b1c8;
|
|
--color-grey-400: #88a;
|
|
--color-grey-500: #67678e;
|
|
--color-grey-600: #535374;
|
|
--color-grey-700: #44445f;
|
|
--color-grey-800: #3a3a50;
|
|
--color-grey-900: #21212c;
|
|
--color-grey-950: #181820;
|
|
|
|
// Indigo
|
|
--color-indigo-50: #f0f1ff;
|
|
--color-indigo-100: #e0e3ff;
|
|
--color-indigo-200: #c8cdfe;
|
|
--color-indigo-300: #a5abfd;
|
|
--color-indigo-400: #8280f9;
|
|
--color-indigo-500: #7263f2;
|
|
--color-indigo-600: #6147e6;
|
|
--color-indigo-700: #5638cc;
|
|
--color-indigo-800: #48359c;
|
|
--color-indigo-900: #3d317c;
|
|
--color-indigo-950: #261e48;
|
|
|
|
// Red
|
|
--color-red-50: #fef2f2;
|
|
--color-red-100: #ffe2e2;
|
|
--color-red-200: #ffc9c9;
|
|
--color-red-300: #ffa2a2;
|
|
--color-red-400: #ff6467;
|
|
--color-red-500: #fb2c36;
|
|
--color-red-600: #e7000b;
|
|
--color-red-700: #c10007;
|
|
--color-red-800: #9f0712;
|
|
--color-red-900: #82181a;
|
|
--color-red-950: #460809;
|
|
|
|
// Yellow
|
|
--color-yellow-50: #fffbeb;
|
|
--color-yellow-100: #fef3c6;
|
|
--color-yellow-200: #fee685;
|
|
--color-yellow-300: #ffd230;
|
|
--color-yellow-400: #ffb900;
|
|
--color-yellow-500: #fe9a00;
|
|
--color-yellow-600: #e17100;
|
|
--color-yellow-700: #bb4d00;
|
|
--color-yellow-800: #973c00;
|
|
--color-yellow-900: #7b3306;
|
|
--color-yellow-950: #461901;
|
|
|
|
// Green
|
|
--color-green-50: #f0fdf4;
|
|
--color-green-100: #dcfce7;
|
|
--color-green-200: #b9f8cf;
|
|
--color-green-300: #7bf1a8;
|
|
--color-green-400: #05df72;
|
|
--color-green-500: #00c950;
|
|
--color-green-600: #00a63e;
|
|
--color-green-700: #008236;
|
|
--color-green-800: #016630;
|
|
--color-green-900: #0d542b;
|
|
--color-green-950: #032e15;
|
|
}
|