diff --git a/sites/docs/src/lib/components/demo-code-tabs.svelte b/sites/docs/src/lib/components/demo-code-tabs.svelte
index 63d13c493..6e57bd287 100644
--- a/sites/docs/src/lib/components/demo-code-tabs.svelte
+++ b/sites/docs/src/lib/components/demo-code-tabs.svelte
@@ -20,7 +20,7 @@
 			{#each items as item}
 				<Tabs.Trigger
 					value={item.value}
-					class="flex border-b-2 border-b-transparent text-sm data-[state=active]:border-[#fdffa4]"
+					class="flex border-b-2 border-b-transparent text-sm data-[state=active]:border-accent"
 				>
 					<span class="px-4 py-2">
 						{item.label}
diff --git a/sites/docs/src/lib/styles/app.postcss b/sites/docs/src/lib/styles/app.postcss
index f95094c1c..dc809e765 100644
--- a/sites/docs/src/lib/styles/app.postcss
+++ b/sites/docs/src/lib/styles/app.postcss
@@ -26,6 +26,8 @@
 		--accent-foreground: 204 80% 16%;
 		--destructive: 347 77% 50%;
 
+		--tertiary: var(--accent);
+
 		/* black */
 		--constrast: 0 0% 0%;
 
@@ -59,6 +61,8 @@
 		--accent-foreground: 204 94% 94%;
 		--destructive: 350 89% 60%;
 
+		--tertiary: 61.3 100% 82.2%;
+
 		/* white */
 		--constrast: 0 0% 100%;