diff --git a/site/content/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte b/site/content/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte
index cd487d088c..b86665ce55 100644
--- a/site/content/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte
+++ b/site/content/tutorial/13-advanced-styling/03-inline-styles/app-a/App.svelte
@@ -10,6 +10,6 @@
 <style>
 	p {
 		font-family: "Comic Sans MS", cursive;
-		background: rgba(255, 62, 0, var(--o));
+		background: rgba(255, 62, 0, var(--opacity));
 	}
 </style>
diff --git a/site/content/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte b/site/content/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte
index b63a28d256..6bda27021b 100644
--- a/site/content/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte
+++ b/site/content/tutorial/13-advanced-styling/03-inline-styles/app-b/App.svelte
@@ -5,11 +5,11 @@
 
 <input type="range" min="0" max="1" step="0.1" bind:value={bgOpacity} />
 
-<p style:color style:--o={bgOpacity}>This is a paragraph.</p>
+<p style:color style:--opacity={bgOpacity}>This is a paragraph.</p>
 
 <style>
 	p {
 		font-family: "Comic Sans MS", cursive;
-		background: rgba(255, 62, 0, var(--o));
+		background: rgba(255, 62, 0, var(--opacity));
 	}
 </style>
diff --git a/site/content/tutorial/13-advanced-styling/03-inline-styles/text.md b/site/content/tutorial/13-advanced-styling/03-inline-styles/text.md
index 28aaf8312b..5371e0c32c 100644
--- a/site/content/tutorial/13-advanced-styling/03-inline-styles/text.md
+++ b/site/content/tutorial/13-advanced-styling/03-inline-styles/text.md
@@ -5,7 +5,7 @@ title: Inline styles and the style directive
 Apart from adding styles inside style tags, you can also add styles to individual elements using the style attribute. Usually you will want to do styling through CSS, but this can come in handy for dynamic styles, especially when combined with CSS custom properties.
 
 Add the following style attribute to the paragraph element:
-`style="color: {color}; --o: {bgOpacity};"`
+`style="color: {color}; --opacity: {bgOpacity};"`
 
 Great, now you can style the paragraph using variables that change based on your input without having to make a class for every possible value.
 
@@ -14,7 +14,7 @@ This can however get unwieldly if you have to write a rather long string, and mi
 ```html
 <p 
 	style:color 
-	style:--o={bgOpacity}
+	style:--opacity={bgOpacity}
 >
 ```