diff --git a/src/index.html b/src/index.html
index 502db15..e29b1a2 100644
--- a/src/index.html
+++ b/src/index.html
@@ -18,7 +18,7 @@
 				</button>
 				<div class="logo">
 					<img src="./bowl.png" width="40" alt="CODE CRISPIES Logo" />
-					<h1>CODE<span>CRISPIES</span></h1>
+					<h1><span class="code-text">CODE</span><span>CRISPIES</span></h1>
 				</div>
 				<div class="header-actions">
 					<button id="lang-btn" class="lang-switch" data-i18n-aria-label="langSwitchLabel" data-i18n="langSwitch" aria-label="Sprache wechseln: Deutsch">DE</button>
diff --git a/src/main.css b/src/main.css
index ff0cd7b..75e7824 100644
--- a/src/main.css
+++ b/src/main.css
@@ -153,9 +153,21 @@ code, kbd {
 	font-weight: 800;
 	color: var(--text-color);
 	line-height: 1;
+	display: flex;
+	align-items: center;
+	gap: 0.15rem;
 }
 
-.logo h1 span {
+.logo h1 .code-text {
+	background: var(--primary-color);
+	color: white;
+	padding: 0.15rem 0.35rem;
+	border-radius: 4px;
+	letter-spacing: 0.05em;
+	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15);
+}
+
+.logo h1 span:last-child {
 	color: var(--primary-color);
 }