diff --git a/site/content/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte b/site/content/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte
index 969114428a..1c4a6f081a 100644
--- a/site/content/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte
+++ b/site/content/tutorial/04-logic/05-keyed-each-blocks/app-a/App.svelte
@@ -2,11 +2,10 @@
 	import Thing from './Thing.svelte';
 
 	let things = [
-		{ id: 1, color: 'darkblue' },
-		{ id: 2, color: 'indigo' },
-		{ id: 3, color: 'deeppink' },
-		{ id: 4, color: 'salmon' },
-		{ id: 5, color: 'gold' }
+		{ id: 1, color: '#3B82F6' },
+		{ id: 2, color: '#10B981' },
+		{ id: 3, color: '#EF4444' },
+		{ id: 4, color: '#EAB308' },
 	];
 
 	function handleClick() {
@@ -19,5 +18,5 @@
 </button>
 
 {#each things as thing}
-	<Thing current={thing.color}/>
-{/each}
+	<Thing current={thing.color} />
+{/each}
\ No newline at end of file
diff --git a/site/content/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte b/site/content/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte
index 37a19a67a8..6165bc8981 100644
--- a/site/content/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte
+++ b/site/content/tutorial/04-logic/05-keyed-each-blocks/app-b/App.svelte
@@ -2,11 +2,10 @@
 	import Thing from './Thing.svelte';
 
 	let things = [
-		{ id: 1, color: 'darkblue' },
-		{ id: 2, color: 'indigo' },
-		{ id: 3, color: 'deeppink' },
-		{ id: 4, color: 'salmon' },
-		{ id: 5, color: 'gold' }
+		{ id: 1, color: '#3B82F6' },
+		{ id: 2, color: '#10B981' },
+		{ id: 3, color: '#EF4444' },
+		{ id: 4, color: '#EAB308' },
 	];
 
 	function handleClick() {
@@ -19,5 +18,5 @@
 </button>
 
 {#each things as thing (thing.id)}
-	<Thing current={thing.color}/>
-{/each}
+	<Thing current={thing.color} />
+{/each}
\ No newline at end of file