diff --git a/src/assets/scss/_reset.scss b/src/assets/scss/_reset.scss
new file mode 100644
index 0000000..e69de29
diff --git a/src/assets/scss/main.scss b/src/assets/scss/main.scss
new file mode 100644
index 0000000..017a87f
--- /dev/null
+++ b/src/assets/scss/main.scss
@@ -0,0 +1,2 @@
+@import "variables/spacing";
+@import "variables/colors";
diff --git a/src/assets/scss/variables/_colors.scss b/src/assets/scss/variables/_colors.scss
new file mode 100644
index 0000000..b4e8dc3
--- /dev/null
+++ b/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;
+}
\ No newline at end of file
diff --git a/src/assets/scss/variables/_spacing.scss b/src/assets/scss/variables/_spacing.scss
new file mode 100644
index 0000000..b11f26c
--- /dev/null
+++ b/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));
+}
\ No newline at end of file
diff --git a/src/posts/basic-post.md b/src/posts/basic-post.md
new file mode 100644
index 0000000..e69de29
diff --git a/src/posts/post-with-media.md b/src/posts/post-with-media.md
new file mode 100644
index 0000000..e69de29