diff --git a/templates/_macros.html b/templates/_macros.html
index 69a8ec8..ba5e8c7 100644
--- a/templates/_macros.html
+++ b/templates/_macros.html
@@ -33,9 +33,10 @@
   {% endfor %}
 
   {% if lang == "en"%}
-  <a class="nav-item subtitle-text" href="/sv{{ path }}"><img class="flag" src="/flag-for-sweden-svgrepo-com.svg"></a>
+  <a class="nav-item subtitle-text" href="/sv{{ path }}"><img alt="swedish" class="flag"
+      src="/flag-for-sweden-svgrepo-com.svg"></a>
   {% else %}
-  <a class="nav-item subtitle-text" href="{{ path }}"><img class="flag"
+  <a class="nav-item subtitle-text" href="{{ path }}"><img alt="english" class="flag"
       src="/flag-for-united-kingdom-svgrepo-com.svg"></a>
   {% endif %}
 
diff --git a/templates/_variables.html b/templates/_variables.html
new file mode 100644
index 0000000..35977c2
--- /dev/null
+++ b/templates/_variables.html
@@ -0,0 +1,43 @@
+<style>
+  :not(.dark) {
+    /* Primary theme color */
+    --primary-color: #FED43F;
+    /* Primary theme text color */
+    --primary-text-color: #543631;
+    --primary-text-color-over: #000;
+    /* Primary theme link color */
+    --primary-link-color: #F9BB2D;
+    /* Secondary color: the background body color */
+    --secondary-color: #fcfaf6;
+    --secondary-text-color: #303030;
+    /* Highlight text color of table of content */
+    --toc-highlight-text-color: #d46e13;
+    --toc-background-color: white;
+    --code-color: #4a4a4a;
+    --code-background-color: white;
+
+    --shadow-color: #ddd;
+
+    /* Font used for headers (h1 & h2) */
+    --header-font-family: "Fira Sans", sans-serif;
+    /* Font used for text */
+    --text-font-family: "Fira Sans", sans-serif;
+  }
+
+  .dark {
+    --primary-color: #382929;
+    --primary-text-color: #d7d7d7;
+    --primary-text-color-over: #FFF;
+    --primary-link-color: #9b9b9b;
+    --secondary-color: #282828;
+    --secondary-text-color: #f2f2f2;
+    --toc-highlight-text-color: #f2f2f2;
+    --toc-background-color: #3a3a3a;
+    --code-color: white;
+    --code-background-color: #4a4a4a;
+
+    --shadow-color: #202020;
+    --header-font-family: "Fira Sans", sans-serif;
+    --text-font-family: "Fira Sans", sans-serif;
+  }
+</style>
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index 0dc60a6..39425e5 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -26,9 +26,12 @@
 <script src="https://unpkg.com/htmx.org@2.0.3"
   integrity="sha384-0895/pl2MU10Hqc6jd4RvrthNlDiE9U1tWmX7WRESftEDRosgxNsQG/Ze9YMRzHq" crossorigin="anonymous"></script>
 
+<title>Software, Product Developement and IT consulting</title>
+<meta charset="UTF-8">
+
 {% endblock head %}
 
-<body hx-boost="false">
+<body hx-boost="false" class="dark">
   {% block header %}
 
   <header class="pos-absolute" style="background-color: transparent">
