diff --git a/app.vue b/app.vue
index 1cf8f83..5178736 100644
--- a/app.vue
+++ b/app.vue
@@ -8,6 +8,12 @@ useSeoMeta({
     "An experienced software engineer. Enabling teams and crafting user interfaces at Celonis",
   twitterCard: "summary_large_image",
 });
+
+useHead({
+  bodyAttrs: {
+    class: "dark:bg-slate-900",
+  },
+});
 </script>
 <template>
   <Introduction />
diff --git a/components/been-working-with.vue b/components/been-working-with.vue
index 9ceea4d..318da7b 100644
--- a/components/been-working-with.vue
+++ b/components/been-working-with.vue
@@ -8,7 +8,7 @@
       </template>
     </Company>
 
-    <Company logo="chat-engineers-logo.webp" href="https://chatengineers.com">
+    <Company logo="chat-engineers-logo.png" href="https://chatengineers.com">
       <template v-slot:title>Chat Engineers</template>
       <template v-slot:description>
         Apps and customization for the Livechat platform
diff --git a/components/company.vue b/components/company.vue
index 2cbe7e1..747e728 100644
--- a/components/company.vue
+++ b/components/company.vue
@@ -14,6 +14,7 @@ const props = defineProps<Props>();
         placeholder
         :src="props.logo"
         class="block rounded min-w-[50px]"
+        format="webp"
         height="50"
         width="50"
         fit="outside"
@@ -23,7 +24,7 @@ const props = defineProps<Props>();
       <NuxtLink
         :href="props.href"
         target="_blank"
-        class="text-xl font-semibold hover:underline hover:underline-offset-4"
+        class="md:text-xl text-lg font-semibold hover:underline hover:underline-offset-4"
       >
         <slot name="title">Company</slot>
       </NuxtLink>
diff --git a/components/introduction.vue b/components/introduction.vue
index ba5fc24..9538709 100644
--- a/components/introduction.vue
+++ b/components/introduction.vue
@@ -5,11 +5,11 @@
       src="mariosant.webp"
       width="64"
       height="64"
-      class="w-16 h-16 rounded-full border"
+      class="w-16 h-16 rounded-full border dark:border-gray-800 dark:bg-slate-300"
     />
     <div class="md:text-xl text-lg font-semibold">
       <ULink
-        class="text-blue-500 hover:underline hover:underline-offset-4"
+        class="text-blue-500 dark:text-blue-300 hover:underline hover:underline-offset-4"
         to="mailto:mariosant@sent.com"
         >Marios Antonoudiou</ULink
       >, an experienced software engineer.<br />
@@ -17,7 +17,7 @@
       <ULink
         to="https://celonis.com"
         target="_blank"
-        class="text-green-500 hover:underline hover:underline-offset-4"
+        class="text-green-500 dark:text-green-300 hover:underline hover:underline-offset-4"
         >Celonis</ULink
       >.
     </div>
diff --git a/public/celonis-logo.webp b/public/celonis-logo.webp
index 2f58625..6f3bd3f 100644
Binary files a/public/celonis-logo.webp and b/public/celonis-logo.webp differ
diff --git a/public/chat-engineers-logo.png b/public/chat-engineers-logo.png
new file mode 100644
index 0000000..5e2b613
Binary files /dev/null and b/public/chat-engineers-logo.png differ
diff --git a/public/chat-engineers-logo.webp b/public/chat-engineers-logo.webp
deleted file mode 100644
index 33a1e4c..0000000
Binary files a/public/chat-engineers-logo.webp and /dev/null differ