diff --git a/app/assets/css/header.css b/app/assets/css/header.css
index f5c31f7..f0f57ec 100644
--- a/app/assets/css/header.css
+++ b/app/assets/css/header.css
@@ -38,12 +38,6 @@
         display: flex;
         align-items: center;
         gap: 1rem;
-
-        & svg {
-            --size: 40px;
-            width: var(--size);
-            height: var(--size);
-        }
     }
 
     & nav {
diff --git a/app/assets/icons/logo.svg b/app/assets/icons/logo.svg
new file mode 100644
index 0000000..98ffb88
--- /dev/null
+++ b/app/assets/icons/logo.svg
@@ -0,0 +1,17 @@
+<svg aria-label="Logo" class="logo" height="40" viewBox="0 0 2500 2500" width="40">
+    <g id="Logo">
+        <g transform="matrix(2.00744,0,-5.91646e-31,2.00744,-1223.85,-1050.52)">
+            <path class="fussel"
+                d="M1232.34,1444.88L1356.88,1532.06C1356.88,1532.06 1405.5,1504.81 1444.06,1395.07C1464.03,1338.21 1476.18,1339.49 1506.32,1320.35C1579.8,1273.69 1638.29,1212.62 1630.86,1195.81C1560.6,1178.12 1512.77,1137.84 1506.32,1102.15L1618.41,946.736C1618.41,946.736 1514.23,877.412 1406.69,896.922C1407.7,845.817 1413.57,804.009 1481.42,759.931C1417.36,736.758 1260.23,740.351 1182.53,834.653C1115.13,783.067 1068.98,763.931 1008.18,759.931L1045.54,872.014C999.993,865.527 914.886,866.941 858.733,902.888C912.917,941.197 943.173,985.627 958.362,1033.91C883.905,1079.32 844.648,1134.09 808.918,1195.81C875.598,1205.68 938.224,1226.42 970.816,1282.99C1016.82,1362.83 1028.77,1456.11 1107.81,1532.06L1232.34,1444.88"/>
+        </g>
+        <g transform="matrix(1,0,0,1,-422.589,697.589)">
+            <path class="glasses" d="M1747.59,277.411C1695.36,294.131 1645.34,294.246 1597.59,277.411"/>
+        </g>
+        <path class="glasses"
+            d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
+        <g transform="matrix(-1,0,0,1,2500,2.20268e-13)">
+            <path class="glasses"
+                d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
+        </g>
+    </g>
+</svg>
\ No newline at end of file
diff --git a/app/components/Header.vue b/app/components/Header.vue
index 4565e28..fe2e630 100644
--- a/app/components/Header.vue
+++ b/app/components/Header.vue
@@ -3,23 +3,7 @@
   <header ref="header" class="Header">
     <div ref="headerWrapper" class="wrapper z-0">
       <strong>
-        <svg aria-label="Logo" class="logo" height="40" viewBox="0 0 2500 2500" width="40">
-          <g id="Logo">
-            <g transform="matrix(2.00744,0,-5.91646e-31,2.00744,-1223.85,-1050.52)">
-              <path class="fussel"
-                    d="M1232.34,1444.88L1356.88,1532.06C1356.88,1532.06 1405.5,1504.81 1444.06,1395.07C1464.03,1338.21 1476.18,1339.49 1506.32,1320.35C1579.8,1273.69 1638.29,1212.62 1630.86,1195.81C1560.6,1178.12 1512.77,1137.84 1506.32,1102.15L1618.41,946.736C1618.41,946.736 1514.23,877.412 1406.69,896.922C1407.7,845.817 1413.57,804.009 1481.42,759.931C1417.36,736.758 1260.23,740.351 1182.53,834.653C1115.13,783.067 1068.98,763.931 1008.18,759.931L1045.54,872.014C999.993,865.527 914.886,866.941 858.733,902.888C912.917,941.197 943.173,985.627 958.362,1033.91C883.905,1079.32 844.648,1134.09 808.918,1195.81C875.598,1205.68 938.224,1226.42 970.816,1282.99C1016.82,1362.83 1028.77,1456.11 1107.81,1532.06L1232.34,1444.88"/>
-            </g>
-            <g transform="matrix(1,0,0,1,-422.589,697.589)">
-              <path class="glasses" d="M1747.59,277.411C1695.36,294.131 1645.34,294.246 1597.59,277.411"/>
-            </g>
-            <path class="glasses"
-                  d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
-            <g transform="matrix(-1,0,0,1,2500,2.20268e-13)">
-              <path class="glasses"
-                    d="M1175,975C1189.02,1037.51 1161.76,1216.53 1125,1300C1027.14,1307.22 909.088,1298.04 825,1275C798.072,1183.9 789.715,1050.66 825,950C935.158,934.697 1076.23,935.423 1175,975Z"/>
-            </g>
-          </g>
-        </svg>
+        <Icon class="logo" name="wf:logo" mode="svg" size="40px" />
         webfussel
       </strong>
       <input id="navToggle" v-model="isBurgerOpen" type="checkbox">