scss

src/assets/scss/main.scss

@@ -0,0 +1,2 @@
+@import "variables/spacing";
+@import "variables/colors";

src/assets/scss/variables/_colors.scss

@@ -0,0 +1,14 @@
+:root {
+  --background-color: #ffffff;
+  --background-color-secondary: #301e4e;
+  
+  --headline: #1f1135;
+  --text-paragraph: #1f1135;
+  --sub-headline: #301e4e;
+  
+  --link-color: #ff6e6c;
+  
+  --tag-color: #301e4e;
+  
+  --button-color: #ff636c;
+}

src/assets/scss/variables/_spacing.scss

@@ -0,0 +1,14 @@
+:root {
+  --ratio: 1.2;
+  --s-5: calc(var(--s-4) / var(--ratio));
+  --s-4: calc(var(--s-3) / var(--ratio));
+  --s-3: calc(var(--s-2) / var(--ratio));
+  --s-2: calc(var(--s-1) / var(--ratio));
+  --s-1: calc(var(--s0) / var(--ratio));
+  --s0: 1rem;
+  --s1: calc(var(--s0) * var(--ratio));
+  --s2: calc(var(--s1) * var(--ratio));
+  --s3: calc(var(--s2) * var(--ratio));
+  --s4: calc(var(--s3) * var(--ratio));
+  --s5: calc(var(--s4) * var(--ratio));
+}