diff --git a/website/src/lib/components/Logo.svelte b/website/src/lib/components/Logo.svelte
index 9060e8cb..9833a15b 100644
--- a/website/src/lib/components/Logo.svelte
+++ b/website/src/lib/components/Logo.svelte
@@ -2,10 +2,12 @@
 	import { base } from '$app/paths';
 
 	import { mode } from 'mode-watcher';
+
+	export let iconOnly = false;
 </script>
 
 <img
-	src="{base}/logo{$mode === 'dark' ? '-dark' : ''}.svg"
+	src="{base}/{iconOnly ? 'icon' : 'logo'}{$mode === 'dark' ? '-dark' : ''}.svg"
 	alt="Logo of gpx.studio."
 	{...$$restProps}
 />
diff --git a/website/src/lib/components/Menu.svelte b/website/src/lib/components/Menu.svelte
index 48a50455..70291d88 100644
--- a/website/src/lib/components/Menu.svelte
+++ b/website/src/lib/components/Menu.svelte
@@ -26,7 +26,13 @@
 		Layers3,
 		MountainSnow,
 		GalleryVertical,
-		Languages
+		Languages,
+		Settings,
+		Info,
+		File,
+		View,
+		FilePen,
+		HeartHandshake
 	} from 'lucide-svelte';
 
 	import {
@@ -102,14 +108,18 @@
 	let layerSettingsOpen = false;
 </script>
 
-<div class="absolute top-2 left-0 right-0 z-20 flex flex-row justify-center pointer-events-none">
+<div class="absolute md:top-2 left-0 right-0 z-20 flex flex-row justify-center pointer-events-none">
 	<div
-		class="w-fit flex flex-row mx-16 items-center justify-center p-1 bg-background rounded-md pointer-events-auto shadow-md"
+		class="w-fit flex flex-row items-center justify-center p-1 bg-background rounded-b-md md:rounded-md pointer-events-auto shadow-md"
 	>
-		<Logo class="h-5 mt-0.5 mx-2" />
+		<Logo class="h-5 mt-0.5 mx-2 md:hidden" iconOnly={true} />
+		<Logo class="h-5 mt-0.5 mx-2 hidden md:block" />
 		<Menubar.Root class="border-none h-fit p-0">
 			<Menubar.Menu>
-				<Menubar.Trigger>{$_('gpx.file')}</Menubar.Trigger>
+				<Menubar.Trigger>
+					<File size="18" class="md:hidden" />
+					<span class="hidden md:block">{$_('gpx.file')}</span>
+				</Menubar.Trigger>
 				<Menubar.Content class="border-none">
 					<Menubar.Item on:click={createFile}>
 						<Plus size="16" class="mr-1" />
@@ -146,7 +156,10 @@
 				</Menubar.Content>
 			</Menubar.Menu>
 			<Menubar.Menu>
-				<Menubar.Trigger>{$_('menu.edit')}</Menubar.Trigger>
+				<Menubar.Trigger>
+					<FilePen size="18" class="md:hidden" />
+					<span class="hidden md:block">{$_('menu.edit')}</span>
+				</Menubar.Trigger>
 				<Menubar.Content class="border-none">
 					<Menubar.Item on:click={dbUtils.undo} disabled={$undoDisabled}>
 						<Undo2 size="16" class="mr-1" />
@@ -182,7 +195,10 @@
 				</Menubar.Content>
 			</Menubar.Menu>
 			<Menubar.Menu>
-				<Menubar.Trigger>{$_('menu.view')}</Menubar.Trigger>
+				<Menubar.Trigger>
+					<View size="18" class="md:hidden" />
+					<span class="hidden md:block">{$_('menu.view')}</span>
+				</Menubar.Trigger>
 				<Menubar.Content class="border-none">
 					<Menubar.CheckboxItem bind:checked={$elevationProfile}>
 						<MountainSnow size="16" class="mr-1" />
@@ -217,7 +233,12 @@
 				</Menubar.Content>
 			</Menubar.Menu>
 			<Menubar.Menu>
-				<Menubar.Trigger>{$_('menu.settings')}</Menubar.Trigger>
+				<Menubar.Trigger>
+					<Settings size="18" class="md:hidden" />
+					<span class="hidden md:block">
+						{$_('menu.settings')}
+					</span>
+				</Menubar.Trigger>
 				<Menubar.Content class="border-none"
 					><Menubar.Sub>
 						<Menubar.SubTrigger>
@@ -307,16 +328,29 @@
 			</Menubar.Menu>
 		</Menubar.Root>
 		<div class="h-fit flex flex-row items-center ml-1 gap-1">
-			<Button variant="ghost" href="./about" target="_blank" class="cursor-default h-fit rounded-sm"
-				>{$_('menu.about')}</Button
+			<Button
+				variant="ghost"
+				href="./about"
+				target="_blank"
+				class="cursor-default h-fit rounded-sm"
 			>
+				<Info size="18" class="md:hidden" />
+				<span class="hidden md:block">
+					{$_('menu.about')}
+				</span>
+			</Button>
 			<Button
 				variant="ghost"
 				href="https://ko-fi.com/gpxstudio"
 				target="_blank"
 				class="cursor-default h-fit rounded-sm font-bold text-support hover:text-support"
-				>{$_('menu.donate')} <Heart size="16" class="ml-1" fill="rgb(var(--support))" /></Button
 			>
+				<HeartHandshake size="18" class="md:hidden" />
+				<span class="hidden md:flex flex-row items-center">
+					{$_('menu.donate')}
+					<Heart size="16" class="ml-1" fill="rgb(var(--support))" />
+				</span>
+			</Button>
 		</div>
 	</div>
 </div>
diff --git a/website/src/lib/components/toolbar/Toolbar.svelte b/website/src/lib/components/toolbar/Toolbar.svelte
index 6a26b2d8..9627af34 100644
--- a/website/src/lib/components/toolbar/Toolbar.svelte
+++ b/website/src/lib/components/toolbar/Toolbar.svelte
@@ -19,7 +19,7 @@
 <div class="absolute top-0 bottom-0 left-0 z-20 flex flex-col justify-center pointer-events-none">
 	<div class="flex flex-row w-screen items-center">
 		<div
-			class="h-fit flex flex-col p-1 gap-1.5 bg-background rounded-md pointer-events-auto shadow-md"
+			class="h-fit flex flex-col p-1 gap-1.5 bg-background rounded-r-md pointer-events-auto shadow-md"
 		>
 			<ToolbarItem tool={Tool.ROUTING}>
 				<Pencil slot="icon" size="18" class="h-" />
diff --git a/website/static/icon-dark.svg b/website/static/icon-dark.svg
new file mode 100644
index 00000000..6fc7a6c0
--- /dev/null
+++ b/website/static/icon-dark.svg
@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg2"
+   width="194.70944"
+   height="251.79291"
+   viewBox="0 0 194.70944 251.79291"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs6">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath64">
+      <path
+         d="M 418.129,207.977 H 632.177 V 422.024 H 418.129 Z"
+         id="path62" />
+    </clipPath>
+  </defs>
+  <g
+     id="g8"
+     transform="matrix(1.3333333,0,0,-1.3333333,-602.70643,545.7933)">
+    <g
+       id="g58">
+      <g
+         id="g60"
+         clip-path="url(#clipPath64)">
+        <g
+           id="g66"
+           transform="translate(525.0752,358.501)">
+          <path
+             d="m 0,0 c -24.068,0 -43.579,-19.511 -43.579,-43.579 0,-24.067 19.511,-43.578 43.579,-43.578 24.068,0 43.579,19.511 43.579,43.578 C 43.579,-19.511 24.068,0 0,0 m 58.863,-49.872 c -0.325,-3.089 1.209,-6.078 3.896,-7.631 l 6.286,-3.633 c 3.769,-2.177 5.06,-6.997 2.886,-10.767 L 60.44,-91.823 c -2.177,-3.776 -7.004,-5.069 -10.777,-2.888 l -6.265,3.62 c -2.69,1.555 -6.05,1.399 -8.559,-0.432 -3.365,-2.457 -7.001,-4.568 -10.852,-6.28 -2.833,-1.259 -4.645,-4.086 -4.645,-7.188 v -7.252 c 0,-4.356 -3.531,-7.887 -7.886,-7.887 h -22.971 c -4.355,0 -7.885,3.531 -7.885,7.886 v 7.253 c 0,3.102 -1.813,5.929 -4.645,7.188 -3.851,1.712 -7.487,3.823 -10.853,6.28 -2.509,1.831 -5.869,1.987 -8.559,0.432 l -6.277,-3.628 c -3.767,-2.177 -8.584,-0.885 -10.759,2.886 l -11.495,19.928 c -2.175,3.77 -0.885,8.592 2.883,10.768 l 6.287,3.634 c 2.688,1.553 4.222,4.542 3.896,7.631 -0.217,2.059 -0.329,4.148 -0.329,6.264 0,2.116 0.112,4.206 0.329,6.263 0.326,3.09 -1.208,6.079 -3.896,7.632 l -6.285,3.632 c -3.77,2.179 -5.061,6.998 -2.886,10.769 l 11.496,19.929 c 2.175,3.771 6.992,5.062 10.759,2.885 l 6.286,-3.632 c 2.691,-1.555 6.048,-1.389 8.558,0.442 3.364,2.456 6.996,4.564 10.845,6.274 2.832,1.26 4.645,4.087 4.645,7.188 v 7.253 c 0,4.356 3.53,7.887 7.886,7.887 h 22.97 c 4.355,0 7.886,-3.531 7.886,-7.887 v -7.253 c 0,-3.101 1.812,-5.928 4.645,-7.188 3.848,-1.71 7.481,-3.818 10.845,-6.274 2.51,-1.831 5.867,-1.997 8.557,-0.442 l 6.287,3.632 C 53.443,9.679 58.26,8.388 60.435,4.617 L 71.93,-15.312 c 2.175,-3.771 0.884,-8.59 -2.885,-10.769 l -6.286,-3.632 c -2.687,-1.553 -4.221,-4.542 -3.896,-7.632 0.218,-2.057 0.33,-4.147 0.33,-6.263 0,-2.116 -0.112,-4.205 -0.33,-6.264"
+             style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path68" />
+        </g>
+        <g
+           id="g70"
+           transform="translate(568.4053,407.8447)">
+          <path
+             d="m 0,0 -17,-8.491 -37.042,-79.437 21.423,-9.99 37.042,79.437 z"
+             style="fill:#3b3735;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path72" />
+        </g>
+        <g
+           id="g74"
+           transform="translate(516.3564,320.6426)">
+          <path
+             d="M 0,0 18.705,-8.723 54.892,68.881 51.03,85.017 36.187,77.603 Z m 19.43,-12.216 c -0.217,0 -0.433,0.047 -0.634,0.141 l -21.423,9.99 c -0.751,0.35 -1.076,1.242 -0.726,1.993 l 37.042,79.437 c 0.143,0.307 0.386,0.556 0.689,0.708 l 17,8.491 c 0.41,0.205 0.89,0.211 1.305,0.018 0.414,-0.194 0.718,-0.566 0.825,-1.01 L 57.931,69.07 c 0.079,-0.33 0.044,-0.676 -0.099,-0.983 L 20.79,-11.35 c -0.168,-0.36 -0.473,-0.639 -0.847,-0.775 -0.166,-0.061 -0.339,-0.091 -0.513,-0.091"
+             style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path76" />
+        </g>
+        <g
+           id="g78"
+           transform="translate(535.7866,309.9277)">
+          <path
+             d="m 0,0 -21.423,9.989 -37.042,-79.435 4.423,-18.482 17,8.491 z"
+             style="fill:#e62d2d;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path80" />
+        </g>
+        <g
+           id="g82"
+           transform="translate(478.9023,240.3213)">
+          <path
+             d="m 0,0 3.861,-16.136 14.844,7.414 36.186,77.603 -18.704,8.722 z m 2.842,-19.821 c -0.216,0 -0.432,0.047 -0.634,0.14 -0.415,0.194 -0.718,0.566 -0.825,1.011 L -3.04,-0.188 c -0.078,0.329 -0.043,0.675 0.1,0.982 l 37.042,79.435 c 0.349,0.751 1.242,1.076 1.993,0.726 l 21.423,-9.989 c 0.361,-0.168 0.64,-0.473 0.776,-0.847 0.136,-0.373 0.118,-0.786 -0.05,-1.146 L 21.202,-10.464 c -0.143,-0.307 -0.386,-0.557 -0.689,-0.708 l -17,-8.491 c -0.211,-0.106 -0.441,-0.158 -0.671,-0.158"
+             style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path84" />
+        </g>
+        <g
+           id="g86"
+           transform="translate(541.7656,314.9219)">
+          <path
+             d="m 0,0 c 0,-9.218 -7.473,-16.69 -16.69,-16.69 -9.218,0 -16.691,7.472 -16.691,16.69 0,9.218 7.473,16.69 16.691,16.69 C -7.473,16.69 0,9.218 0,0"
+             style="fill:#ffffff;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path88" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/website/static/icon.svg b/website/static/icon.svg
new file mode 100644
index 00000000..1778b8b1
--- /dev/null
+++ b/website/static/icon.svg
@@ -0,0 +1,81 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<!-- Created with Inkscape (http://www.inkscape.org/) -->
+
+<svg
+   version="1.1"
+   id="svg2"
+   width="194.7095"
+   height="247.79253"
+   viewBox="0 0 194.70951 247.79253"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs6">
+    <clipPath
+       clipPathUnits="userSpaceOnUse"
+       id="clipPath96">
+      <path
+         d="M 410.129,207.977 H 624.177 V 422.024 H 410.129 Z"
+         id="path94" />
+    </clipPath>
+  </defs>
+  <g
+     id="g8"
+     transform="matrix(1.3333333,0,0,-1.3333333,-592.03971,543.79305)">
+    <g
+       id="g90">
+      <g
+         id="g92"
+         clip-path="url(#clipPath96)">
+        <g
+           id="g98"
+           transform="translate(517.0752,358.501)">
+          <path
+             d="m 0,0 c -24.068,0 -43.579,-19.511 -43.579,-43.579 0,-24.067 19.511,-43.578 43.579,-43.578 24.068,0 43.579,19.511 43.579,43.578 C 43.579,-19.511 24.068,0 0,0 m 58.863,-49.872 c -0.325,-3.089 1.209,-6.078 3.896,-7.631 l 6.286,-3.633 c 3.769,-2.177 5.06,-6.997 2.886,-10.767 L 60.44,-91.823 c -2.177,-3.776 -7.004,-5.069 -10.777,-2.888 l -6.265,3.62 c -2.69,1.555 -6.05,1.399 -8.559,-0.432 -3.365,-2.457 -7.001,-4.568 -10.852,-6.28 -2.833,-1.259 -4.645,-4.086 -4.645,-7.188 v -7.252 c 0,-4.356 -3.531,-7.887 -7.886,-7.887 h -22.971 c -4.355,0 -7.885,3.531 -7.885,7.886 v 7.253 c 0,3.102 -1.813,5.929 -4.645,7.188 -3.851,1.712 -7.487,3.823 -10.853,6.28 -2.509,1.831 -5.869,1.987 -8.559,0.432 l -6.277,-3.628 c -3.767,-2.177 -8.584,-0.885 -10.759,2.886 l -11.495,19.928 c -2.175,3.77 -0.885,8.592 2.883,10.768 l 6.287,3.634 c 2.688,1.553 4.222,4.542 3.896,7.631 -0.217,2.059 -0.329,4.148 -0.329,6.264 0,2.116 0.112,4.206 0.329,6.264 0.326,3.089 -1.208,6.078 -3.896,7.631 l -6.285,3.632 c -3.77,2.178 -5.061,6.998 -2.886,10.769 l 11.496,19.929 c 2.175,3.77 6.992,5.062 10.759,2.885 l 6.286,-3.632 c 2.691,-1.555 6.048,-1.389 8.558,0.443 3.364,2.455 6.996,4.563 10.845,6.273 2.832,1.26 4.645,4.086 4.645,7.189 v 7.252 c 0,4.356 3.53,7.887 7.886,7.887 h 22.97 c 4.355,0 7.886,-3.531 7.886,-7.886 v -7.253 c 0,-3.103 1.812,-5.929 4.645,-7.189 3.848,-1.71 7.481,-3.818 10.845,-6.273 2.51,-1.832 5.867,-1.998 8.557,-0.443 l 6.287,3.632 C 53.443,9.679 58.26,8.387 60.435,4.617 L 71.93,-15.312 c 2.175,-3.771 0.884,-8.591 -2.885,-10.769 l -6.286,-3.632 c -2.687,-1.553 -4.221,-4.542 -3.896,-7.631 0.218,-2.058 0.33,-4.148 0.33,-6.264 0,-2.116 -0.112,-4.205 -0.33,-6.264"
+             style="fill:#d5d4d4;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path100" />
+        </g>
+        <g
+           id="g102"
+           transform="translate(564.8286,389.3633)">
+          <path
+             d="m 0,0 -21.424,9.99 -37.041,-79.436 21.423,-9.991 z"
+             style="fill:#3b3735;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path104" />
+        </g>
+        <g
+           id="g106"
+           transform="translate(543.2061,399.4458)">
+          <path
+             d="m 0,0 17.2,8.399 4.621,-18.574 z"
+             style="fill:#3b3735;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path108" />
+        </g>
+        <g
+           id="g110"
+           transform="translate(469.3218,240.4814)">
+          <path
+             d="M 0,0 21.423,-9.99 58.465,69.445 37.042,79.436 Z"
+             style="fill:#e62d2d;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path112" />
+        </g>
+        <g
+           id="g114"
+           transform="translate(490.9443,230.3984)">
+          <path
+             d="m 0,0 -17.2,-8.398 -4.622,18.574 z"
+             style="fill:#e62d2d;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path116" />
+        </g>
+        <g
+           id="g118"
+           transform="translate(533.7656,314.9224)">
+          <path
+             d="m 0,0 c 0,-9.218 -7.473,-16.691 -16.69,-16.691 -9.218,0 -16.691,7.473 -16.691,16.691 0,9.218 7.473,16.69 16.691,16.69 C -7.473,16.69 0,9.218 0,0"
+             style="fill:#d5d4d4;fill-opacity:1;fill-rule:nonzero;stroke:none"
+             id="path120" />
+        </g>
+      </g>
+    </g>
+  </g>
+</svg>