diff --git a/web/src/lib/components/welcome/Steps.svelte b/web/src/lib/components/welcome/Steps.svelte
index 35d2e2897..3855d9ba6 100644
--- a/web/src/lib/components/welcome/Steps.svelte
+++ b/web/src/lib/components/welcome/Steps.svelte
@@ -9,18 +9,18 @@
 				"flex items-center gap-2 rounded-sm focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-border-focus",
 			marker: "flex size-6 shrink-0 items-center justify-center rounded-full typography-paragraph-small tabular-nums transition-[scale,background-color,border-color] duration-(--rail-duration) ease-(--rail-ease)",
 			label: "sr-only typography-paragraph-small whitespace-nowrap sm:not-sr-only",
-			connector: "relative h-0.5 flex-1 overflow-hidden rounded-full bg-background-muted",
+			connector: "relative h-0.5 flex-1 overflow-hidden rounded-full bg-background-subtle",
 			connectorFill:
-				"absolute inset-0 origin-left scale-x-0 rounded-full bg-background-emphasis transition-[scale] duration-(--rail-duration) ease-(--rail-ease)"
+				"absolute inset-0 origin-left scale-x-0 rounded-full bg-background-info-subtle-hover transition-[scale] duration-(--rail-duration) ease-(--rail-ease) dark:bg-background-subtle"
 		},
 		variants: {
 			state: {
 				done: {
-					marker: "bg-background-emphasis text-foreground-on-emphasis",
-					label: "text-foreground-muted"
+					marker: "bg-background-info-subtle text-foreground-info dark:bg-background-muted dark:text-foreground-default",
+					label: "text-foreground-default"
 				},
 				current: {
-					marker: "bg-background-emphasis text-foreground-on-emphasis",
+					marker: "text-foreground-on-emphasis bg-background-info-emphasis",
 					label: "text-foreground-default"
 				},
 				upcoming: {