diff --git a/src/docs/src/routes/components/hero.svelte.md b/src/docs/src/routes/components/hero.svelte.md
index aecacef8f71..77bcf710ae2 100644
--- a/src/docs/src/routes/components/hero.svelte.md
+++ b/src/docs/src/routes/components/hero.svelte.md
@@ -248,7 +248,7 @@ data="{[
 </div>`
 }</pre>
 <pre slot="react" use:replace={{ to: $prefix }}>{
-`<div className="$$hero min-h-screen" style={{ backgroundImage: `url("https://placeimg.com/1000/800/arch")` }}>
+`<div className="$$hero min-h-screen" style={{ backgroundImage: \`url("https://placeimg.com/1000/800/arch")\` }}>
   <div className="$$hero-overlay bg-opacity-60"></div>
   <div className="$$hero-content text-center text-neutral-content">
     <div className="max-w-md">