82 lines
2.3 KiB
SCSS
82 lines
2.3 KiB
SCSS
// Radix colors
|
|
$gray1: hsl(0, 0%, 8.5%);
|
|
$gray2: hsl(0, 0%, 11%);
|
|
$gray3: hsl(0, 0%, 13.6%);
|
|
$gray4: hsl(0, 0%, 15.8%);
|
|
$gray5: hsl(0, 0%, 17.9%);
|
|
$gray6: hsl(0, 0%, 20.5%);
|
|
$gray7: hsl(0, 0%, 24.3%);
|
|
$gray8: hsl(0, 0%, 31.2%);
|
|
$gray9: hsl(0, 0%, 43.9%);
|
|
$gray10: hsl(0, 0%, 49.4%);
|
|
$gray11: hsl(0, 0%, 62.8%);
|
|
$gray12: hsl(0, 0%, 93%);
|
|
$teal1: hsl(168, 48%, 6.5%);
|
|
$teal2: hsl(169, 77.8%, 7.1%);
|
|
$teal3: hsl(170, 76.1%, 9.2%);
|
|
$teal4: hsl(171, 75.8%, 11%);
|
|
$teal5: hsl(171, 75.7%, 12.8%);
|
|
$teal6: hsl(172, 75.8%, 15.1%);
|
|
$teal7: hsl(172, 76.7%, 18.6%);
|
|
$teal8: hsl(173, 80.2%, 23.7%);
|
|
$teal9: hsl(173, 80%, 36%);
|
|
$teal10: hsl(174, 83.9%, 38.2%);
|
|
$teal11: hsl(174, 90%, 40.7%);
|
|
$teal12: hsl(166, 73%, 93.1%);
|
|
$yellow1: hsl(45, 100%, 5.5%);
|
|
$yellow2: hsl(46, 100%, 6.7%);
|
|
$yellow3: hsl(45, 100%, 8.7%);
|
|
$yellow4: hsl(45, 100%, 10.4%);
|
|
$yellow5: hsl(47, 100%, 12.1%);
|
|
$yellow6: hsl(49, 100%, 14.3%);
|
|
$yellow7: hsl(49, 90.3%, 18.4%);
|
|
$yellow8: hsl(50, 100%, 22%);
|
|
$yellow9: hsl(53, 92%, 50%);
|
|
$yellow10: hsl(54, 100%, 68%);
|
|
$yellow11: hsl(48, 100%, 47%);
|
|
$yellow12: hsl(53, 100%, 91%);
|
|
$grass1: hsl(146, 30%, 7.4%);
|
|
$grass2: hsl(136, 33.3%, 8.8%);
|
|
$grass3: hsl(137, 36%, 11.4%);
|
|
$grass4: hsl(137, 37.6%, 13.7%);
|
|
$grass5: hsl(136, 38.7%, 16%);
|
|
$grass6: hsl(135, 39.6%, 19.1%);
|
|
$grass7: hsl(134, 40.3%, 23.8%);
|
|
$grass8: hsl(131, 40.1%, 30.8%);
|
|
$grass9: hsl(131, 41%, 46.5%);
|
|
$grass10: hsl(131, 39%, 52.1%);
|
|
$grass11: hsl(131, 43%, 57.2%);
|
|
$grass12: hsl(137, 72%, 94%);
|
|
$red1: hsl(353, 23%, 9.8%);
|
|
$red2: hsl(357, 34.4%, 12%);
|
|
$red3: hsl(356, 43.4%, 16.4%);
|
|
$red4: hsl(356, 47.6%, 19.2%);
|
|
$red5: hsl(356, 51.1%, 21.9%);
|
|
$red6: hsl(356, 55.2%, 25.9%);
|
|
$red7: hsl(357, 60.2%, 31.8%);
|
|
$red8: hsl(358, 65%, 40.4%);
|
|
$red9: hsl(358, 75%, 59%);
|
|
$red10: hsl(358, 85.3%, 64%);
|
|
$red11: hsl(358, 100%, 69.5%);
|
|
$red12: hsl(351, 89%, 96%);
|
|
$blackA1: hsla(0, 0%, 0%, 0.012);
|
|
$blackA2: hsla(0, 0%, 0%, 0.027);
|
|
$blackA3: hsla(0, 0%, 0%, 0.047);
|
|
$blackA4: hsla(0, 0%, 0%, 0.071);
|
|
$blackA5: hsla(0, 0%, 0%, 0.09);
|
|
$blackA6: hsla(0, 0%, 0%, 0.114);
|
|
$blackA7: hsla(0, 0%, 0%, 0.141);
|
|
$blackA8: hsla(0, 0%, 0%, 0.22);
|
|
$blackA9: hsla(0, 0%, 0%, 0.439);
|
|
$blackA10: hsla(0, 0%, 0%, 0.478);
|
|
$blackA11: hsla(0, 0%, 0%, 0.565);
|
|
$blackA12: hsla(0, 0%, 0%, 0.91);
|
|
|
|
// Site vars
|
|
$inter: "Inter", "Gill Sans", "Gill Sans MT", "Segoe UI", sans-serif;
|
|
$site-bg: $gray1;
|
|
$copy-color: $gray12;
|
|
|
|
// Media queries
|
|
$mobile: 768px;
|