diff --git a/lib/cli/src/frameworks/web-components/js/Page.js b/lib/cli/src/frameworks/web-components/js/Page.js
index e6c5181fe36e..53f0abd78473 100644
--- a/lib/cli/src/frameworks/web-components/js/Page.js
+++ b/lib/cli/src/frameworks/web-components/js/Page.js
@@ -43,8 +43,8 @@ export const Page = ({ user, onLogin, onLogout, onCreateAccount }) => html`
         <a href="https://storybook.js.org/docs" target="_blank" rel="noopener noreferrer"> docs </a>
         .
       </p>
-      <div className="tip-wrapper">
-        <span className="tip">Tip</span> Adjust the width of the canvas with the
+      <div class="tip-wrapper">
+        <span class="tip">Tip</span> Adjust the width of the canvas with the
         <svg width="10" height="10" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
           <g fill="none" fillRule="evenodd">
             <path
diff --git a/lib/cli/src/frameworks/web-components/ts/Page.ts b/lib/cli/src/frameworks/web-components/ts/Page.ts
index db59099e9524..19e8265157f4 100644
--- a/lib/cli/src/frameworks/web-components/ts/Page.ts
+++ b/lib/cli/src/frameworks/web-components/ts/Page.ts
@@ -50,8 +50,8 @@ export const Page = ({ user, onLogin, onLogout, onCreateAccount }: PageProps) =>
         <a href="https://storybook.js.org/docs" target="_blank" rel="noopener noreferrer"> docs </a>
         .
       </p>
-      <div className="tip-wrapper">
-        <span className="tip">Tip</span> Adjust the width of the canvas with the
+      <div class="tip-wrapper">
+        <span class="tip">Tip</span> Adjust the width of the canvas with the
         <svg width="10" height="10" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
           <g fill="none" fillRule="evenodd">
             <path