diff --git a/site/index.html b/site/index.html
index 83ef3a6..1fd8921 100644
--- a/site/index.html
+++ b/site/index.html
@@ -1,17 +1,20 @@
 <!doctype html>
 <html lang="de">
+
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <title>Raum und Linie</title>
     <meta name="description" content="Raum für Deine Ideen." />
-    <link rel="stylesheet" href="style/colors.css" />
+    <link rel="stylesheet" href="style/base.css" />
     <style>
       body {
         background-color: var(--color-background);
+        font-family: var(--font-body)
       }
     </style>
   </head>
+
   <body>
     <header>
       <h1>Raum und Linie</h1>
@@ -25,4 +28,5 @@
       </p>
     </main>
   </body>
+
 </html>
diff --git a/site/style/base.css b/site/style/base.css
new file mode 100644
index 0000000..96ef032
--- /dev/null
+++ b/site/style/base.css
@@ -0,0 +1,5 @@
+:root{
+    --color-background: #faf9f7;
+    --font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+}
+
diff --git a/site/style/colors.css b/site/style/colors.css
deleted file mode 100644
index 6e28b5f..0000000
--- a/site/style/colors.css
+++ /dev/null
@@ -1,4 +0,0 @@
-:root{
-    --color-background: #faf9f7;
-}
-