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 b86665ce55..47fe7cecd5 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(--opacity));
+		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 58280f71ad..d6bd6b9fc6 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: {color}; --opacity: {bgOpacity};">This is a paragraph.</p>
+<p style="color: {color}; opacity: {bgOpacity};">This is a paragraph.</p>
 
 <style>
 	p {
 		font-family: "Comic Sans MS", cursive;
-		background: rgba(255, 62, 0, var(--opacity));
+		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 f558958358..af9b7cfd90 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,6 +5,6 @@ title: Inline styles
 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}; --opacity: {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.
diff --git a/site/content/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte b/site/content/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte
index 58280f71ad..d6bd6b9fc6 100644
--- a/site/content/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte
+++ b/site/content/tutorial/13-advanced-styling/04-style-directive/app-a/App.svelte
@@ -5,11 +5,11 @@
 
 <input type="range" min="0" max="1" step="0.1" bind:value={bgOpacity} />
 
-<p style="color: {color}; --opacity: {bgOpacity};">This is a paragraph.</p>
+<p style="color: {color}; opacity: {bgOpacity};">This is a paragraph.</p>
 
 <style>
 	p {
 		font-family: "Comic Sans MS", cursive;
-		background: rgba(255, 62, 0, var(--opacity));
+		background: rgba(255, 62, 0, var(opacity));
 	}
 </style>
diff --git a/site/content/tutorial/13-advanced-styling/04-style-directive/app-b/App.svelte b/site/content/tutorial/13-advanced-styling/04-style-directive/app-b/App.svelte
index aade861b43..35c94c0746 100644
--- a/site/content/tutorial/13-advanced-styling/04-style-directive/app-b/App.svelte
+++ b/site/content/tutorial/13-advanced-styling/04-style-directive/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:--opacity={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(--opacity));
+		background: rgba(255, 62, 0, var(opacity));
 	}
 </style>
diff --git a/site/content/tutorial/13-advanced-styling/04-style-directive/text.md b/site/content/tutorial/13-advanced-styling/04-style-directive/text.md
index 88b4e05885..b1ab14191f 100644
--- a/site/content/tutorial/13-advanced-styling/04-style-directive/text.md
+++ b/site/content/tutorial/13-advanced-styling/04-style-directive/text.md
@@ -9,7 +9,7 @@ Change the style attribute of the paragraph to the following:
 ```html
 <p 
 	style:color 
-	style:--opacity="{bgOpacity}"
+	style:opacity="{bgOpacity}"
 >
 ```