diff --git a/core/src/components/toggle/test/legacy/basic/index.html b/core/src/components/toggle/test/legacy/basic/index.html
index e332e2ddfd..d6013e3246 100644
--- a/core/src/components/toggle/test/legacy/basic/index.html
+++ b/core/src/components/toggle/test/legacy/basic/index.html
@@ -20,7 +20,7 @@
         <ion-toolbar>
           <ion-title>Toggle - Basic</ion-title>
           <ion-buttons slot="primary">
-            <ion-toggle></ion-toggle>
+            <ion-toggle legacy="true"></ion-toggle>
           </ion-buttons>
         </ion-toolbar>
       </ion-header>
@@ -99,7 +99,7 @@
         </p>
 
         <p>
-          <ion-toggle id="standAloneChecked"></ion-toggle>
+          <ion-toggle id="standAloneChecked" legacy="true"></ion-toggle>
           Stand-alone toggle:
           <span id="standAloneCheckedSpan"></span>
         </p>
diff --git a/core/src/components/toggle/test/legacy/sizes/index.html b/core/src/components/toggle/test/legacy/sizes/index.html
index ae0cb16679..369de5a336 100644
--- a/core/src/components/toggle/test/legacy/sizes/index.html
+++ b/core/src/components/toggle/test/legacy/sizes/index.html
@@ -27,53 +27,53 @@
 
       <ion-content class="ion-padding-horizontal">
         <h1>Default</h1>
-        <ion-toggle></ion-toggle>
-        <ion-toggle checked></ion-toggle>
-        <ion-toggle color="danger"></ion-toggle>
-        <ion-toggle color="danger" checked></ion-toggle>
-        <ion-toggle color="tertiary" class="toggle-activated"></ion-toggle>
-        <ion-toggle color="tertiary" checked class="toggle-activated"></ion-toggle>
+        <ion-toggle legacy="true"></ion-toggle>
+        <ion-toggle checked legacy="true"></ion-toggle>
+        <ion-toggle color="danger" legacy="true"></ion-toggle>
+        <ion-toggle color="danger" checked legacy="true"></ion-toggle>
+        <ion-toggle color="tertiary" class="toggle-activated" legacy="true"></ion-toggle>
+        <ion-toggle color="tertiary" checked class="toggle-activated" legacy="true"></ion-toggle>
 
         <h1>Custom Widths</h1>
-        <ion-toggle color="secondary" class="width-small"></ion-toggle>
-        <ion-toggle color="secondary" checked class="width-small"></ion-toggle>
-        <ion-toggle color="secondary" class="width-large"></ion-toggle>
-        <ion-toggle color="secondary" checked class="width-large"></ion-toggle>
-        <ion-toggle color="tertiary" class="width-large toggle-activated"></ion-toggle>
-        <ion-toggle color="tertiary" checked class="width-large toggle-activated"></ion-toggle>
+        <ion-toggle color="secondary" class="width-small" legacy="true"></ion-toggle>
+        <ion-toggle color="secondary" checked class="width-small" legacy="true"></ion-toggle>
+        <ion-toggle color="secondary" class="width-large" legacy="true"></ion-toggle>
+        <ion-toggle color="secondary" checked class="width-large" legacy="true"></ion-toggle>
+        <ion-toggle color="tertiary" class="width-large toggle-activated" legacy="true"></ion-toggle>
+        <ion-toggle color="tertiary" checked class="width-large toggle-activated" legacy="true"></ion-toggle>
 
         <h1>Custom Heights</h1>
         <div style="display: flex; flex-flow: column; float: left">
-          <ion-toggle class="height-small"></ion-toggle>
-          <ion-toggle checked class="height-small"></ion-toggle>
+          <ion-toggle class="height-small" legacy="true"></ion-toggle>
+          <ion-toggle checked class="height-small" legacy="true"></ion-toggle>
         </div>
-        <ion-toggle class="height-large"></ion-toggle>
-        <ion-toggle checked class="height-large"></ion-toggle>
-        <ion-toggle class="handle-height-large"></ion-toggle>
-        <ion-toggle checked class="handle-height-large"></ion-toggle>
-        <ion-toggle checked class="handle-height-large toggle-activated"></ion-toggle>
+        <ion-toggle class="height-large" legacy="true"></ion-toggle>
+        <ion-toggle checked class="height-large" legacy="true"></ion-toggle>
+        <ion-toggle class="handle-height-large" legacy="true"></ion-toggle>
+        <ion-toggle checked class="handle-height-large" legacy="true"></ion-toggle>
+        <ion-toggle checked class="handle-height-large toggle-activated" legacy="true"></ion-toggle>
 
         <h1>Dynamic Sizes</h1>
-        <ion-toggle color="tertiary" class="dynamic-small width-small height-small"></ion-toggle>
-        <ion-toggle color="tertiary" checked class="dynamic-small width-small height-small"></ion-toggle>
-        <ion-toggle color="tertiary" class="dynamic-large width-large height-large"></ion-toggle>
-        <ion-toggle color="tertiary" checked class="dynamic-large width-large height-large"></ion-toggle>
+        <ion-toggle color="tertiary" class="dynamic-small width-small height-small" legacy="true"></ion-toggle>
+        <ion-toggle color="tertiary" checked class="dynamic-small width-small height-small" legacy="true"></ion-toggle>
+        <ion-toggle color="tertiary" class="dynamic-large width-large height-large" legacy="true"></ion-toggle>
+        <ion-toggle color="tertiary" checked class="dynamic-large width-large height-large" legacy="true"></ion-toggle>
 
         <h1>Complex Custom Toggles</h1>
-        <ion-toggle mode="ios" class="all-custom"></ion-toggle>
-        <ion-toggle mode="ios" checked class="all-custom"></ion-toggle>
+        <ion-toggle mode="ios" class="all-custom" legacy="true"></ion-toggle>
+        <ion-toggle mode="ios" checked class="all-custom" legacy="true"></ion-toggle>
 
-        <ion-toggle class="custom-overflow"></ion-toggle>
-        <ion-toggle checked class="custom-overflow"></ion-toggle>
+        <ion-toggle class="custom-overflow" legacy="true"></ion-toggle>
+        <ion-toggle checked class="custom-overflow" legacy="true"></ion-toggle>
 
-        <ion-toggle mode="ios" color="dark" class="custom-spacing"></ion-toggle>
-        <ion-toggle mode="ios" color="dark" checked class="custom-spacing"></ion-toggle>
+        <ion-toggle mode="ios" color="dark" class="custom-spacing" legacy="true"></ion-toggle>
+        <ion-toggle mode="ios" color="dark" checked class="custom-spacing" legacy="true"></ion-toggle>
 
-        <ion-toggle mode="md" color="dark" class="custom-spacing"></ion-toggle>
-        <ion-toggle mode="md" color="dark" checked class="custom-spacing"></ion-toggle>
+        <ion-toggle mode="md" color="dark" class="custom-spacing" legacy="true"></ion-toggle>
+        <ion-toggle mode="md" color="dark" checked class="custom-spacing" legacy="true"></ion-toggle>
 
-        <ion-toggle mode="ios" class="icon-custom"></ion-toggle>
-        <ion-toggle mode="ios" checked class="icon-custom"></ion-toggle>
+        <ion-toggle mode="ios" class="icon-custom" legacy="true"></ion-toggle>
+        <ion-toggle mode="ios" checked class="icon-custom" legacy="true"></ion-toggle>
       </ion-content>
     </ion-app>