site

1 files changed, 51 insertions, 0 deletions

diff --git a/site/sass/_palette.scss b/site/sass/_palette.scss
new file mode 100644
index 0000000..b61eb94
--- /dev/null
+++ b/site/sass/_palette.scss
@@ -0,0 +1,51 @@
+@mixin ayu-dark {
+  color-scheme: dark;
+
+  --bg:         #0F1419; // base00  default background
+  --bg-alt:     #131721; // base01  raised background
+  --bg-sel:     #272D38; // base02  selection background
+  --grey:       #3E4B59; // base03  comments, invisibles
+  --fg-dim:     #BFBDB6; // base04  muted foreground
+  --fg:         #E6E1CF; // base05  default foreground
+  --fg-alt:     #E6E1CF; // base06
+  --fg-bright:  #F3F4F5; // base07  brightest foreground
+
+  --red:        #F07178; // base08
+  --orange:     #FF8F40; // base09
+  --yellow:     #FFB454; // base0A
+  --green:      #B8CC52; // base0B
+  --cyan:       #95E6CB; // base0C
+  --blue:       #59C2FF; // base0D
+  --purple:     #D2A6FF; // base0E
+  --brown:      #E6B673; // base0F
+}
+
+@mixin ayu-light {
+  color-scheme: light;
+
+  --bg:         #FAFAFA; // base00
+  --bg-alt:     #F3F4F5; // base01
+  --bg-sel:     #F8F9FA; // base02
+  --grey:       #ABB0B6; // base03
+  --fg-dim:     #828C99; // base04
+  --fg:         #5C6773; // base05
+  --fg-alt:     #242936; // base06
+  --fg-bright:  #1A1F29; // base07
+
+  --red:        #F07178; // base08
+  --orange:     #FA8D3E; // base09
+  --yellow:     #F2AE49; // base0A
+  --green:      #86B300; // base0B
+  --cyan:       #4CBF99; // base0C
+  --blue:       #36A3D9; // base0D
+  --purple:     #A37ACC; // base0E
+  --brown:      #E6BA7E; // base0F
+}
+
+:root { @include ayu-light; }
+@media (prefers-color-scheme: dark) {
+  :root { @include ayu-dark; }
+}
+
+:root[data-theme="dark"]  { @include ayu-dark; }
+:root[data-theme="light"] { @include ayu-light; }