diff --git a/backend/open_webui/config.py b/backend/open_webui/config.py
index bfc9a4de..9e0fd224 100644
--- a/backend/open_webui/config.py
+++ b/backend/open_webui/config.py
@@ -452,11 +452,11 @@ if frontend_favicon.exists():
 else:
     logging.warning(f"Frontend favicon not found at {frontend_favicon}")
 
-frontend_splash = FRONTEND_BUILD_DIR / "static" / "splash.png"
+frontend_splash = FRONTEND_BUILD_DIR / "static" / "SUSE_Logo-hor_L_Green-pos_sRGB.png.png"
 
 if frontend_splash.exists():
     try:
-        shutil.copyfile(frontend_splash, STATIC_DIR / "splash.png")
+        shutil.copyfile(frontend_splash, STATIC_DIR / "SUSE_Logo-hor_L_Green-pos_sRGB.png")
     except Exception as e:
         logging.error(f"An error occurred: {e}")
 else:
diff --git a/backend/open_webui/static/SUSE_Chameleon_L_Green-neg_sRGB.png b/backend/open_webui/static/SUSE_Chameleon_L_Green-neg_sRGB.png
new file mode 100644
index 00000000..d4b1a07e
Binary files /dev/null and b/backend/open_webui/static/SUSE_Chameleon_L_Green-neg_sRGB.png differ
diff --git a/backend/open_webui/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png b/backend/open_webui/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png
new file mode 100644
index 00000000..00f0fed9
Binary files /dev/null and b/backend/open_webui/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png differ
diff --git a/backend/open_webui/static/SUSE_Logo-hor_L_Green-pos_sRGB.png b/backend/open_webui/static/SUSE_Logo-hor_L_Green-pos_sRGB.png
new file mode 100644
index 00000000..7cba7c95
Binary files /dev/null and b/backend/open_webui/static/SUSE_Logo-hor_L_Green-pos_sRGB.png differ
diff --git a/backend/open_webui/static/favicon.ico b/backend/open_webui/static/favicon.ico
new file mode 100644
index 00000000..718a97a3
Binary files /dev/null and b/backend/open_webui/static/favicon.ico differ
diff --git a/src/app.css b/src/app.css
index 7a8bf59b..2eaa764e 100644
--- a/src/app.css
+++ b/src/app.css
@@ -1,3 +1,9 @@
+@font-face {
+	font-family: 'SUSE';
+	src: url('/assets/fonts/SUSE-VariableFont_wght.ttf');
+	font-display: swap;
+}
+
 @font-face {
 	font-family: 'Inter';
 	src: url('/assets/fonts/Inter-Variable.ttf');
@@ -43,7 +49,7 @@ math {
 }
 
 .font-primary {
-	font-family: 'Archivo', sans-serif;
+	font-family: 'SUSE', sans-serif;
 }
 
 iframe {
diff --git a/src/app.html b/src/app.html
index f6e46c9c..69172332 100644
--- a/src/app.html
+++ b/src/app.html
@@ -2,8 +2,8 @@
 <html lang="en">
 	<head>
 		<meta charset="utf-8" />
-		<link rel="icon" href="%sveltekit.assets%/favicon.png" />
-		<link rel="apple-touch-icon" href="%sveltekit.assets%/favicon.png" />
+		<link rel="apple-touch-icon" href="%sveltekit.assets%/static/favicon.ico" />
+		<link rel="icon" href="%sveltekit.assets%/static/favicon.ico" />
 		<link rel="manifest" href="%sveltekit.assets%/manifest.json" crossorigin="use-credentials" />
 		<meta
 			name="viewport"
@@ -32,7 +32,7 @@
 				const prefersDarkTheme = window.matchMedia('(prefers-color-scheme: dark)').matches;
 
 				if (!localStorage?.theme) {
-					localStorage.theme = 'system';
+					localStorage.theme = 'suse';
 				}
 
 				if (localStorage.theme === 'system') {
@@ -52,6 +52,10 @@
 					document.documentElement.classList.add('dark');
 					document.documentElement.classList.add('her');
 					metaThemeColorTag.setAttribute('content', '#983724');
+				} else if (localStorage.theme === 'suse') {
+					document.documentElement.classList.add('light');
+					document.documentElement.classList.add('suse');
+					metaThemeColorTag.setAttribute('content', '#0c322c');
 				} else {
 					document.documentElement.classList.add('dark');
 					metaThemeColorTag.setAttribute('content', '#171717');
@@ -101,7 +105,7 @@
 					left: 50%;
 					transform: translateX(-50%);
 				"
-				src="/static/splash.png"
+				src="/static/SUSE_Logo-hor_L_Green-pos_sRGB.png"
 			/>
 
 			<div
diff --git a/src/lib/components/chat/Chat.svelte b/src/lib/components/chat/Chat.svelte
index 54e14d98..0ffee6da 100644
--- a/src/lib/components/chat/Chat.svelte
+++ b/src/lib/components/chat/Chat.svelte
@@ -1153,7 +1153,7 @@
 									if ($settings.notificationEnabled && !document.hasFocus()) {
 										const notification = new Notification(`${model.id}`, {
 											body: responseMessage.content,
-											icon: `${WEBUI_BASE_URL}/static/favicon.png`
+											icon: `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`
 										});
 									}
 
@@ -1504,7 +1504,7 @@
 				if ($settings.notificationEnabled && !document.hasFocus()) {
 					const notification = new Notification(`${model.id}`, {
 						body: responseMessage.content,
-						icon: `${WEBUI_BASE_URL}/static/favicon.png`
+						icon: `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`
 					});
 				}
 
diff --git a/src/lib/components/chat/ChatPlaceholder.svelte b/src/lib/components/chat/ChatPlaceholder.svelte
index 84642240..1e32f6ae 100644
--- a/src/lib/components/chat/ChatPlaceholder.svelte
+++ b/src/lib/components/chat/ChatPlaceholder.svelte
@@ -54,7 +54,7 @@
 								src={model?.info?.meta?.profile_image_url ??
 									($i18n.language === 'dg-DG'
 										? `/doge.png`
-										: `${WEBUI_BASE_URL}/static/favicon.png`)}
+										: `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`)}
 								class=" size-[2.7rem] rounded-full border-[1px] border-gray-200 dark:border-none"
 								alt="logo"
 								draggable="false"
diff --git a/src/lib/components/chat/MessageInput.svelte b/src/lib/components/chat/MessageInput.svelte
index b0991914..6d5c8082 100644
--- a/src/lib/components/chat/MessageInput.svelte
+++ b/src/lib/components/chat/MessageInput.svelte
@@ -277,7 +277,7 @@
 									?.profile_image_url ??
 									($i18n.language === 'dg-DG'
 										? `/doge.png`
-										: `${WEBUI_BASE_URL}/static/favicon.png`)}
+										: `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`)}
 							/>
 							<div>
 								Talking to <span class=" font-medium">{atSelectedModel.name}</span>
diff --git a/src/lib/components/chat/MessageInput/CallOverlay.svelte b/src/lib/components/chat/MessageInput/CallOverlay.svelte
index 6f3b465a..ade1460a 100644
--- a/src/lib/components/chat/MessageInput/CallOverlay.svelte
+++ b/src/lib/components/chat/MessageInput/CallOverlay.svelte
@@ -733,11 +733,11 @@
 								: rmsLevel * 100 > 1
 									? 'size-14'
 									: 'size-12'}  transition-all rounded-full {(model?.info?.meta
-							?.profile_image_url ?? '/static/favicon.png') !== '/static/favicon.png'
+							?.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png') !== '/static/SUSE_Chameleon_L_Green-neg_sRGB.png'
 							? ' bg-cover bg-center bg-no-repeat'
 							: 'bg-black dark:bg-white'}  bg-black dark:bg-white"
-						style={(model?.info?.meta?.profile_image_url ?? '/static/favicon.png') !==
-						'/static/favicon.png'
+						style={(model?.info?.meta?.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png') !==
+						'/static/SUSE_Chameleon_L_Green-neg_sRGB.png'
 							? `background-image: url('${model?.info?.meta?.profile_image_url}');`
 							: ''}
 					/>
@@ -815,11 +815,11 @@
 									: rmsLevel * 100 > 1
 										? 'size-44'
 										: 'size-40'}  transition-all rounded-full {(model?.info?.meta
-								?.profile_image_url ?? '/static/favicon.png') !== '/static/favicon.png'
+								?.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png') !== '/static/SUSE_Chameleon_L_Green-neg_sRGB.png'
 								? ' bg-cover bg-center bg-no-repeat'
 								: 'bg-black dark:bg-white'} "
-							style={(model?.info?.meta?.profile_image_url ?? '/static/favicon.png') !==
-							'/static/favicon.png'
+							style={(model?.info?.meta?.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png') !==
+							'/static/SUSE_Chameleon_L_Green-neg_sRGB.png'
 								? `background-image: url('${model?.info?.meta?.profile_image_url}');`
 								: ''}
 						/>
diff --git a/src/lib/components/chat/MessageInput/Commands/Models.svelte b/src/lib/components/chat/MessageInput/Commands/Models.svelte
index 768c5142..97b0c783 100644
--- a/src/lib/components/chat/MessageInput/Commands/Models.svelte
+++ b/src/lib/components/chat/MessageInput/Commands/Models.svelte
@@ -95,7 +95,7 @@
 						>
 							<div class="flex font-medium text-black dark:text-gray-100 line-clamp-1">
 								<img
-									src={model?.info?.meta?.profile_image_url ?? '/static/favicon.png'}
+									src={model?.info?.meta?.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png'}
 									alt={model?.name ?? model.id}
 									class="rounded-full size-6 items-center mr-2"
 								/>
diff --git a/src/lib/components/chat/Messages/ProfileImageBase.svelte b/src/lib/components/chat/Messages/ProfileImageBase.svelte
index dce2385a..4bea0e0b 100644
--- a/src/lib/components/chat/Messages/ProfileImageBase.svelte
+++ b/src/lib/components/chat/Messages/ProfileImageBase.svelte
@@ -2,13 +2,13 @@
 	import { WEBUI_BASE_URL } from '$lib/constants';
 
 	export let className = 'size-8';
-	export let src = `${WEBUI_BASE_URL}/static/favicon.png`;
+	export let src = `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`;
 </script>
 
 <img
 	crossorigin="anonymous"
 	src={src === ''
-		? `${WEBUI_BASE_URL}/static/favicon.png`
+		? `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`
 		: src.startsWith(WEBUI_BASE_URL) ||
 			  src.startsWith('https://www.gravatar.com/avatar/') ||
 			  src.startsWith('data:') ||
diff --git a/src/lib/components/chat/Messages/ResponseMessage.svelte b/src/lib/components/chat/Messages/ResponseMessage.svelte
index 73d40708..5b46609b 100644
--- a/src/lib/components/chat/Messages/ResponseMessage.svelte
+++ b/src/lib/components/chat/Messages/ResponseMessage.svelte
@@ -339,7 +339,7 @@
 	>
 		<ProfileImage
 			src={model?.info?.meta?.profile_image_url ??
-				($i18n.language === 'dg-DG' ? `/doge.png` : `${WEBUI_BASE_URL}/static/favicon.png`)}
+				($i18n.language === 'dg-DG' ? `/doge.png` : `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`)}
 		/>
 
 		<div class="flex-auto w-0 pl-1">
diff --git a/src/lib/components/chat/ModelSelector/Selector.svelte b/src/lib/components/chat/ModelSelector/Selector.svelte
index 34ffb9bb..ebf44734 100644
--- a/src/lib/components/chat/ModelSelector/Selector.svelte
+++ b/src/lib/components/chat/ModelSelector/Selector.svelte
@@ -317,7 +317,7 @@
 									<div class="line-clamp-1">
 										<div class="flex items-center min-w-fit">
 											<img
-												src={item.model?.info?.meta?.profile_image_url ?? '/static/favicon.png'}
+												src={item.model?.info?.meta?.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png'}
 												alt="Model"
 												class="rounded-full size-5 flex items-center mr-2"
 											/>
diff --git a/src/lib/components/chat/Placeholder.svelte b/src/lib/components/chat/Placeholder.svelte
index e8e84544..df6d4b2b 100644
--- a/src/lib/components/chat/Placeholder.svelte
+++ b/src/lib/components/chat/Placeholder.svelte
@@ -126,7 +126,7 @@
 											src={model?.info?.meta?.profile_image_url ??
 												($i18n.language === 'dg-DG'
 													? `/doge.png`
-													: `${WEBUI_BASE_URL}/static/favicon.png`)}
+													: `${WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png`)}
 											class=" size-[2.5rem] rounded-full border-[1px] border-gray-200 dark:border-none"
 											alt="logo"
 											draggable="false"
diff --git a/src/lib/components/chat/Settings/General.svelte b/src/lib/components/chat/Settings/General.svelte
index ee04deeb..42f0dfbe 100644
--- a/src/lib/components/chat/Settings/General.svelte
+++ b/src/lib/components/chat/Settings/General.svelte
@@ -14,8 +14,8 @@
 	export let getModels: Function;
 
 	// General
-	let themes = ['dark', 'light', 'rose-pine dark', 'rose-pine-dawn light', 'oled-dark'];
-	let selectedTheme = 'system';
+	let themes = ['dark', 'light', 'rose-pine dark', 'rose-pine-dawn light', 'oled-dark', 'suse'];
+	let selectedTheme = 'suse';
 
 	let languages: Awaited<ReturnType<typeof getLanguages>> = [];
 	let lang = $i18n.language;
@@ -75,7 +75,7 @@
 	};
 
 	onMount(async () => {
-		selectedTheme = localStorage.theme ?? 'system';
+		selectedTheme = localStorage.theme ?? 'suse';
 
 		languages = await getLanguages();
 
@@ -169,13 +169,14 @@
 						placeholder="Select a theme"
 						on:change={() => themeChangeHandler(selectedTheme)}
 					>
-						<option value="system">⚙️ {$i18n.t('System')}</option>
+						<!-- <option value="system">⚙️ {$i18n.t('System')}</option>
 						<option value="dark">🌑 {$i18n.t('Dark')}</option>
 						<option value="oled-dark">🌃 {$i18n.t('OLED Dark')}</option>
 						<option value="light">☀️ {$i18n.t('Light')}</option>
-						<option value="her">🌷 Her</option>
+						<option value="her">🌷 Her</option> -->
 						<!-- <option value="rose-pine dark">🪻 {$i18n.t('Rosé Pine')}</option>
 						<option value="rose-pine-dawn light">🌷 {$i18n.t('Rosé Pine Dawn')}</option> -->
+						<option value="suse">{$i18n.t('SUSE')}</option>
 					</select>
 				</div>
 			</div>
diff --git a/src/lib/components/layout/Navbar.svelte b/src/lib/components/layout/Navbar.svelte
index ccc486d8..64b55d58 100644
--- a/src/lib/components/layout/Navbar.svelte
+++ b/src/lib/components/layout/Navbar.svelte
@@ -40,7 +40,7 @@
 
 <ShareChatModal bind:show={showShareChatModal} chatId={$chatId} />
 
-<div class="sticky top-0 z-30 w-full px-1 py-2 -mb-8 flex items-center">
+<div id="nav" class="sticky top-0 z-30 w-full px-1 py-2 -mb-8 flex items-center">
 	<div
 		class=" bg-gradient-to-b via-50% from-white via-white to-transparent dark:from-gray-900 dark:via-gray-900 dark:to-transparent pointer-events-none absolute inset-0 -bottom-7 z-[-1] blur"
 	></div>
diff --git a/src/lib/components/layout/Sidebar.svelte b/src/lib/components/layout/Sidebar.svelte
index 0582eb57..839e7c0d 100644
--- a/src/lib/components/layout/Sidebar.svelte
+++ b/src/lib/components/layout/Sidebar.svelte
@@ -279,54 +279,26 @@
 			? ''
 			: 'invisible'}"
 	>
-		<div class="px-2.5 flex justify-between space-x-1 text-gray-600 dark:text-gray-400">
-			<a
-				id="sidebar-new-chat-button"
-				class="flex flex-1 justify-between rounded-xl px-2 h-full hover:bg-gray-100 dark:hover:bg-gray-900 transition"
+		<div class="px-2.5 mb-4 flex justify-between space-x-1 text-gray-600 dark:text-gray-400">
+			<div
+				
+				class="flex flex-1 justify-between rounded-xl px-2 h-full transition"
 				href="/"
 				draggable="false"
-				on:click={async () => {
-					selectedChatId = null;
-					await goto('/');
-					const newChatButton = document.getElementById('new-chat-button');
-					setTimeout(() => {
-						newChatButton?.click();
-						if ($mobile) {
-							showSidebar.set(false);
-						}
-					}, 0);
-				}}
+				
 			>
-				<div class="self-center mx-1.5">
+				<div id="logo" class="self-center mx-1.5">
 					<img
 						crossorigin="anonymous"
-						src="{WEBUI_BASE_URL}/static/favicon.png"
-						class=" size-6 -translate-x-1.5 rounded-full"
+						src="{WEBUI_BASE_URL}/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png"
+						class=" "
 						alt="logo"
 					/>
 				</div>
-				<div class=" self-center font-medium text-sm text-gray-850 dark:text-white font-primary">
-					{$i18n.t('New Chat')}
-				</div>
-				<div class="self-center ml-auto">
-					<svg
-						xmlns="http://www.w3.org/2000/svg"
-						viewBox="0 0 20 20"
-						fill="currentColor"
-						class="size-5"
-					>
-						<path
-							d="M5.433 13.917l1.262-3.155A4 4 0 017.58 9.42l6.92-6.918a2.121 2.121 0 013 3l-6.92 6.918c-.383.383-.84.685-1.343.886l-3.154 1.262a.5.5 0 01-.65-.65z"
-						/>
-						<path
-							d="M3.5 5.75c0-.69.56-1.25 1.25-1.25H10A.75.75 0 0010 3H4.75A2.75 2.75 0 002 5.75v9.5A2.75 2.75 0 004.75 18h9.5A2.75 2.75 0 0017 15.25V10a.75.75 0 00-1.5 0v5.25c0 .69-.56 1.25-1.25 1.25h-9.5c-.69 0-1.25-.56-1.25-1.25v-9.5z"
-						/>
-					</svg>
-				</div>
-			</a>
+			</div>
 
 			<button
-				class=" cursor-pointer px-2 py-2 flex rounded-xl hover:bg-gray-100 dark:hover:bg-gray-900 transition"
+				class=" cursor-pointer h-[2.25rem] px-2 py-2 mt-0.5 flex rounded-xl hover:bg-gray-100 dark:hover:bg-gray-900 transition"
 				on:click={() => {
 					showSidebar.set(!$showSidebar);
 				}}
@@ -350,6 +322,46 @@
 			</button>
 		</div>
 
+		<div class="px-2.5 flex justify-center text-gray-800 dark:text-gray-200">
+			<a
+				id="sidebar-new-chat-button"
+				class="flex-grow flex space-x-3 rounded-xl px-2.5 py-2 hover:bg-gray-100 dark:hover:bg-gray-900 transition"
+				href="/"
+				draggable="false"
+				on:click={async () => {
+					selectedChatId = null;
+					await goto('/');
+					const newChatButton = document.getElementById('new-chat-button');
+					setTimeout(() => {
+						newChatButton?.click();
+						if ($mobile) {
+							showSidebar.set(false);
+						}
+					}, 0);
+				}}
+			>
+			
+				<div class="self-center">
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						viewBox="0 0 20 20"
+						fill="currentColor"
+						class="size-[1.1rem]"
+					>
+						<path
+							d="M5.433 13.917l1.262-3.155A4 4 0 017.58 9.42l6.92-6.918a2.121 2.121 0 013 3l-6.92 6.918c-.383.383-.84.685-1.343.886l-3.154 1.262a.5.5 0 01-.65-.65z"
+						/>
+						<path
+							d="M3.5 5.75c0-.69.56-1.25 1.25-1.25H10A.75.75 0 0010 3H4.75A2.75 2.75 0 002 5.75v9.5A2.75 2.75 0 004.75 18h9.5A2.75 2.75 0 0017 15.25V10a.75.75 0 00-1.5 0v5.25c0 .69-.56 1.25-1.25 1.25h-9.5c-.69 0-1.25-.56-1.25-1.25v-9.5z"
+						/>
+					</svg>
+				</div>
+				<div class=" self-center font-medium text-sm text-gray-850 dark:text-white font-primary">
+					{$i18n.t('New Chat')}
+				</div>
+			</a>
+		</div>
+
 		{#if $user?.role === 'admin'}
 			<div class="px-2.5 flex justify-center text-gray-800 dark:text-gray-200">
 				<a
@@ -398,14 +410,14 @@
 				<div class="absolute z-40 w-full h-full flex justify-center"></div>
 			{/if}
 
-			<div class="px-2 mt-0.5 mb-2 flex justify-center space-x-2">
+			<div class="px-2 mb-2 flex justify-center space-x-2">
 				<div class="flex w-full rounded-xl" id="chat-search">
 					<div class="self-center pl-3 py-2 rounded-l-xl bg-transparent">
 						<svg
 							xmlns="http://www.w3.org/2000/svg"
 							viewBox="0 0 20 20"
 							fill="currentColor"
-							class="w-4 h-4"
+							class="size-[1.1rem]"
 						>
 							<path
 								fill-rule="evenodd"
diff --git a/src/lib/components/workspace/Models.svelte b/src/lib/components/workspace/Models.svelte
index 46b676c8..872197d9 100644
--- a/src/lib/components/workspace/Models.svelte
+++ b/src/lib/components/workspace/Models.svelte
@@ -390,7 +390,7 @@
 							: ''} "
 					>
 						<img
-							src={model?.info?.meta?.profile_image_url ?? '/static/favicon.png'}
+							src={model?.info?.meta?.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png'}
 							alt="modelfile profile"
 							class=" rounded-full w-full h-auto object-cover"
 						/>
diff --git a/src/routes/(app)/workspace/models/create/+page.svelte b/src/routes/(app)/workspace/models/create/+page.svelte
index c15f6da5..a2b53807 100644
--- a/src/routes/(app)/workspace/models/create/+page.svelte
+++ b/src/routes/(app)/workspace/models/create/+page.svelte
@@ -156,7 +156,7 @@
 				...info,
 				meta: {
 					...info.meta,
-					profile_image_url: info.meta.profile_image_url ?? '/static/favicon.png',
+					profile_image_url: info.meta.profile_image_url ?? '/static/SUSE_Chameleon_L_Green-neg_sRGB.png',
 					suggestion_prompts: info.meta.suggestion_prompts
 						? info.meta.suggestion_prompts.filter((prompt) => prompt.content !== '')
 						: null
diff --git a/src/routes/(app)/workspace/models/edit/+page.svelte b/src/routes/(app)/workspace/models/edit/+page.svelte
index eafc666d..9c233c9d 100644
--- a/src/routes/(app)/workspace/models/edit/+page.svelte
+++ b/src/routes/(app)/workspace/models/edit/+page.svelte
@@ -56,7 +56,7 @@
 		base_model_id: null,
 		name: '',
 		meta: {
-			profile_image_url: '/static/favicon.png',
+			profile_image_url: '/static/SUSE_Chameleon_L_Green-neg_sRGB.png',
 			description: '',
 			suggestion_prompts: null,
 			tags: []
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index d1c30a96..cbda3036 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -197,12 +197,13 @@
 
 <svelte:head>
 	<title>{$WEBUI_NAME}</title>
-	<link crossorigin="anonymous" rel="icon" href="{WEBUI_BASE_URL}/static/favicon.png" />
+	<link crossorigin="anonymous" rel="icon" href="{WEBUI_BASE_URL}/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png" />
 
 	<!-- rosepine themes have been disabled as it's not up to date with our latest version. -->
 	<!-- feel free to make a PR to fix if anyone wants to see it return -->
 	<!-- <link rel="stylesheet" type="text/css" href="/themes/rosepine.css" />
 	<link rel="stylesheet" type="text/css" href="/themes/rosepine-dawn.css" /> -->
+	<link rel="stylesheet" type="text/css" href="/themes/suse.css" />
 </svelte:head>
 
 {#if loaded}
diff --git a/src/routes/auth/+page.svelte b/src/routes/auth/+page.svelte
index f6ba932b..40fc8f03 100644
--- a/src/routes/auth/+page.svelte
+++ b/src/routes/auth/+page.svelte
@@ -110,7 +110,7 @@
 			<div class=" self-center">
 				<img
 					crossorigin="anonymous"
-					src="{WEBUI_BASE_URL}/static/favicon.png"
+					src="{WEBUI_BASE_URL}/static/SUSE_Chameleon_L_Green-neg_sRGB.png"
 					class=" w-8 rounded-full"
 					alt="logo"
 				/>
diff --git a/src/tailwind.css b/src/tailwind.css
index 998ab843..55bff972 100644
--- a/src/tailwind.css
+++ b/src/tailwind.css
@@ -5,7 +5,7 @@
 @layer base {
 	html,
 	pre {
-		font-family: -apple-system, BlinkMacSystemFont, 'Inter', ui-sans-serif, system-ui, 'Segoe UI',
+		font-family: 'SUSE', -apple-system, BlinkMacSystemFont, 'Inter', ui-sans-serif, system-ui, 'Segoe UI',
 			Roboto, Ubuntu, Cantarell, 'Noto Sans', sans-serif, 'Helvetica Neue', Arial,
 			'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
 	}
diff --git a/static/assets/fonts/SUSE-VariableFont_wght.ttf b/static/assets/fonts/SUSE-VariableFont_wght.ttf
new file mode 100644
index 00000000..f9b43eeb
Binary files /dev/null and b/static/assets/fonts/SUSE-VariableFont_wght.ttf differ
diff --git a/static/favicon.ico b/static/favicon.ico
new file mode 100644
index 00000000..718a97a3
Binary files /dev/null and b/static/favicon.ico differ
diff --git a/static/static/SUSE_Chameleon_L_Green-neg_sRGB.png b/static/static/SUSE_Chameleon_L_Green-neg_sRGB.png
new file mode 100644
index 00000000..d4b1a07e
Binary files /dev/null and b/static/static/SUSE_Chameleon_L_Green-neg_sRGB.png differ
diff --git a/static/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png b/static/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png
new file mode 100644
index 00000000..00f0fed9
Binary files /dev/null and b/static/static/SUSE_Logo-hor_L_Green-White-neg_sRGB.png differ
diff --git a/static/static/SUSE_Logo-hor_L_Green-pos_sRGB.png b/static/static/SUSE_Logo-hor_L_Green-pos_sRGB.png
new file mode 100644
index 00000000..7cba7c95
Binary files /dev/null and b/static/static/SUSE_Logo-hor_L_Green-pos_sRGB.png differ
diff --git a/static/static/favicon.ico b/static/static/favicon.ico
new file mode 100644
index 00000000..718a97a3
Binary files /dev/null and b/static/static/favicon.ico differ
diff --git a/static/themes/suse.css b/static/themes/suse.css
new file mode 100644
index 00000000..cf3c845a
--- /dev/null
+++ b/static/themes/suse.css
@@ -0,0 +1,313 @@
+.suse * {
+	font-family: 'SUSE', sans-serif;
+	border-radius: 0px !important;
+}
+
+.suse .text-gray-100 {
+	color: #ffffff;
+}
+
+.suse .text-gray-200,
+.suse .text-gray-300,
+.suse .text-gray-400,
+.suse .text-gray-500 {
+	color: #6f6f6f;
+}
+
+.suse .text-gray-600,
+.suse .text-gray-700,
+.suse .text-gray-800,
+.suse .text-gray-900 {
+	color: #0c322c !important;
+}
+
+.suse .bg-white {
+	color: #0c322c;
+}
+
+.suse .rounded-full {
+	border-radius: 9999px !important;
+}
+
+.suse input::placeholder,
+.suse textarea::placeholder {
+	color: #5f5f5f;
+}
+
+.suse ::selection {
+	background-color: #30ba78;
+	color: #ffffff;
+}
+
+.suse #nav {
+	background-color: #0c322c;
+    color: #ffffff !important;
+}
+
+.suse #nav .bg-gradient-to-b {
+	background: transparent;
+}
+
+/* nav icons */
+.suse #nav svg,
+.suse #nav #sidebar-toggle-button svg {
+	color: #30ba78;
+}
+
+/* nav model selection */
+@media (min-width: 768px) {
+	.suse #nav .flex-1.overflow-hidden.max-w-full {
+		display: flex;
+		flex-direction: row;
+		overflow-x: auto;
+		scrollbar-width: none;
+	}
+
+	.suse #nav .flex.flex-col.w-full.items-start,
+	.suse #nav .flex.flex-col.items-start {
+		flex-direction: row;
+		width: auto;
+    }
+
+	.suse #nav .flex.w-full.max-w-fit {
+	   margin-right: 1rem;
+    }
+
+    /* nav set as default button */
+    .suse #nav .text-gray-500 {
+		align-self: center;
+		flex-shrink: 0;
+		margin-right: 1rem;
+		max-width: fit-content;
+		width: 100%;
+	}
+}
+
+/* nav set as default button */
+.suse #nav .text-gray-500 {
+	color: #ffffff;
+	font-weight: 400;	
+	position: relative;
+}
+
+.suse #sidebar {
+	background-color: #0c322c;
+    color: #ffffff !important;
+	font-weight: 400;
+}
+
+/* sidebar logo */
+.suse #logo {
+	height: auto;
+    overflow: hidden;
+	width: 170px;
+}
+
+.suse #logo img {
+	transform: scale(1.27);
+	transform-origin: center;
+}
+
+/* sidebar icons */
+.suse #sidebar svg {
+	color: #30ba78;
+}
+
+.suse #sidebar-toggle-button svg {
+	color: #0c322c;
+}
+
+/* sidebar buttons */
+.suse #sidebar-new-chat-button .text-gray-850 {
+	color: #ffffff;
+}
+
+.suse #sidebar-new-chat-button:hover .text-gray-850,
+.suse #sidebar .hover\:bg-gray-900:hover,
+.suse #sidebar .hover\:bg-gray-100:hover,
+.suse #sidebar .bg-gray-100 {
+	color: #0c322c !important;
+}
+
+/* sidebar search box */
+.suse #chat-search input::placeholder {
+	color: #ffffff;
+}
+
+.suse #chat-search .pl-2\.5 {
+	padding-left: 0.750rem;
+}
+
+/* sidebar tags buttons */
+.suse #sidebar .bg-gray-100.text-xs {
+	background-color: #30ba78;
+	color: #ffffff !important;
+	padding-bottom: 1.5px;
+	padding-top: 1.5px;
+}
+
+.suse #sidebar .mb-1 {
+	margin-bottom: 1.25rem;
+	margin-top: 0.75rem;
+}
+
+/* sidebar titles */
+.suse #sidebar .text-gray-500 {
+	color: #bff1ea;
+	font-size: 0.875rem !important;
+	font-weight: 600;
+}
+
+/* sidebar chats */
+.suse #sidebar a {
+	color: #ffffff;
+}
+
+.suse #sidebar a:hover,
+.suse #sidebar a.bg-gray-200,
+.suse #sidebar .w-full.relative.group:hover a,
+.suse #sidebar .w-full.relative.group input {
+	color: #0c322c !important;
+}
+
+.suse #sidebar .px-3 {
+	padding-left: 1.75rem;
+}
+
+.suse #sidebar .pb-0\.5 {
+	padding-bottom: 0.5rem;
+}
+
+.suse #sidebar .pt-5 {
+	padding-top: 0.5rem;
+}
+
+/* new chat screen suggested text */
+.suse .text-sm.font-medium.text-gray-400 {
+	color: #ff5a2b;
+}
+
+/* new chat screen model logo */
+.suse .flex.-space-x-4.mb-0\.5 img {
+	background-color: #ffffff;
+}
+
+/* send message bar */
+.suse form .bg-gray-50 {
+	background-color: #efefef;
+}
+
+/* chat screen icons */
+.suse .buttons button svg,
+.suse .chat-user button svg,
+.suse #merge-response-button svg {
+	color: #ff5a2b;
+}
+
+/* chat screen documents icons */
+.suse .bg-red-400,
+.suse .bg-black\/20 {
+	background-color: #ff5a2b;
+}
+
+.suse .bg-red-400 svg,
+.suse .bg-black\/20 svg {
+	color: #ffffff !important;
+	opacity: 1 !important;
+}
+
+/* chat controls inputs of type range */
+.suse #steps-range {
+	background: #30ba78;
+}
+
+/* dark buttons */
+.suse #send-message-button,
+.suse button.bg-gray-900,
+.suse button.hover\:bg-gray-850:hover,
+.suse button.hover\:bg-gray-800:hover,
+.suse button.data-\[selected\]\:bg-black[data-selected] {
+	background-color: #0c322c;
+	border: 2px solid #0c322c;
+}
+
+.suse button.bg-gray-900:hover,
+.suse button.data-\[selected\]\:bg-black[data-selected]:hover {
+	background-color: transparent;
+	color: #0c322c;
+}
+
+/* dark buttons icons */
+.suse #send-message-button svg,
+.suse button.bg-black svg.w-3\.5.h-3\.5 {
+	color: #ffffff;
+}
+
+.suse div[data-scope="pagination"] svg {
+    color: #0c322c;
+}
+
+/* lighter buttons */
+.suse button.bg-emerald-600,
+.suse button.bg-emerald-700 {
+	background-color: #30ba78;
+	border: 2px solid #30ba78;
+}
+
+.suse button.hover\:bg-emerald-500:hover,
+.suse button.hover\:bg-emerald-700:hover,
+.suse button.hover\:bg-emerald-800:hover {
+	background-color: transparent;
+	color: #30ba78;
+}
+
+/* switch buttons */
+.suse button[role="switch"] {
+	border: none !important;
+}
+
+/* toasts icons */
+.suse section[aria-label="Notifications alt+T"] svg {
+	color: currentColor;
+}
+
+/* settings, admin settings and workspace icons */
+.suse svg.size-4,
+.suse svg.w-3\.5.h-3\.5,
+.suse div[role="menu"] svg,
+.suse #settings-tabs-container svg,
+.suse #admin-settings-tabs-container svg,
+.suse button.rounded-xl.bg-gray-50 svg.w-4.h-4,
+.suse button.hover\:bg-gray-200.dark\:hover\:bg-gray-800 svg {
+	color: #ff5a2b;
+}
+
+.suse .pr-4.pb-8.flex.max-h-full.min-h-full svg.size-4,
+.suse button.bg-gray-50.hover\:bg-gray-200.dark\:hover\:bg-gray-800 svg {
+	color: #0c322c;
+}
+
+/* admin settings inputs */
+.suse .flex-1.mt-3.lg\:mt-0.overflow-y-scroll input.bg-gray-50,
+.suse .flex-1.mt-3.lg\:mt-0.overflow-y-scroll button.bg-gray-50,
+.suse .flex-1.mt-3.lg\:mt-0.overflow-y-scroll textarea.bg-gray-50,
+.suse .flex-1.mt-3.lg\:mt-0.overflow-y-scroll select.bg-gray-50,
+.suse .flex-1.mt-3.lg\:mt-0.overflow-y-scroll button.bg-gray-200 {
+	background-color: #efefef;
+}
+
+/* workspace models logos*/
+.suse #model-list .w-8 {
+	height: 2rem;
+	margin-top: auto;
+}
+
+/* auth screen logo */
+.suse .fixed.m-10.z-50 .w-8 {
+	width: 4rem;
+}
+
+/* chameleon image */
+.suse img[src*="SUSE_Chameleon"] {
+	object-fit: contain;
+}
