diff --git a/docs/api/tab-bar.md b/docs/api/tab-bar.md
index cb69107d111..939451673cb 100644
--- a/docs/api/tab-bar.md
+++ b/docs/api/tab-bar.md
@@ -28,7 +28,7 @@ The tab bar is a UI component that contains a set of [tab buttons](tab-button.md
 
 ## Usage
 
-<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'stencil', label: 'Stencil' }, { value: 'vue', label: 'Vue' }]}>
+<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }]}>
 
 <TabItem value="angular">
 
@@ -110,46 +110,6 @@ export const TabBarExample: React.FC = () => (
 </TabItem>
 
 
-<TabItem value="stencil">
-
-```tsx
-import { Component, h } from '@stencil/core';
-
-@Component({
-  tag: 'tab-bar-example',
-  styleUrl: 'tab-bar-example.css'
-})
-export class TabBarExample {
-  render() {
-    return [
-      <ion-tabs>
-        {/* Tab views */}
-        <ion-tab tab="account" component="page-account"></ion-tab>
-        <ion-tab tab="contact" component="page-contact"></ion-tab>
-        <ion-tab tab="settings" component="page-settings"></ion-tab>
-
-        {/* Tab bar */}
-        <ion-tab-bar slot="bottom">
-          <ion-tab-button tab="account">
-            <ion-icon name="person"></ion-icon>
-          </ion-tab-button>
-          <ion-tab-button tab="contact">
-            <ion-icon name="call"></ion-icon>
-          </ion-tab-button>
-          <ion-tab-button tab="settings">
-            <ion-icon name="settings"></ion-icon>
-          </ion-tab-button>
-        </ion-tab-bar>
-      </ion-tabs>
-    ];
-  }
-}
-```
-
-
-</TabItem>
-
-
 <TabItem value="vue">
 
 ```html
diff --git a/docs/api/tab-button.md b/docs/api/tab-button.md
index d22b0db8699..959d50f88c4 100644
--- a/docs/api/tab-button.md
+++ b/docs/api/tab-button.md
@@ -27,7 +27,7 @@ See the [tabs documentation](tabs.md) for more details on configuring tabs.
 
 ## Usage
 
-<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'stencil', label: 'Stencil' }, { value: 'vue', label: 'Vue' }]}>
+<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }]}>
 
 <TabItem value="angular">
 
@@ -153,68 +153,6 @@ export const TabButtonExample: React.FC = () => (
 </TabItem>
 
 
-<TabItem value="stencil">
-
-```tsx
-import { Component, h } from '@stencil/core';
-
-@Component({
-  tag: 'tab-button-example',
-  styleUrl: 'tab-button-example.css'
-})
-export class TabButtonExample {
-  render() {
-    return [
-      <ion-tabs>
-        {/* Tab views */}
-        <ion-tab tab="schedule">
-          <ion-router-outlet name="schedule"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="speakers">
-          <ion-router-outlet name="speakers"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="map">
-          <ion-router-outlet name="map"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="about">
-          <ion-router-outlet name="about"></ion-router-outlet>
-        </ion-tab>
-
-        {/* Tab bar */}
-        <ion-tab-bar slot="bottom">
-          <ion-tab-button tab="schedule" href="/app/tabs/(schedule:schedule)">
-            <ion-icon name="calendar" aria-hidden="true"></ion-icon>
-            <ion-label>Schedule</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="speakers" href="/app/tabs/(speakers:speakers)">
-            <ion-icon name="person-circle" aria-hidden="true"></ion-icon>
-            <ion-label>Speakers</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="map" href="/app/tabs/(map:map)">
-            <ion-icon name="map" aria-hidden="true"></ion-icon>
-            <ion-label>Map</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="about" href="/app/tabs/(about:about)">
-            <ion-icon name="information-circle" aria-hidden="true"></ion-icon>
-            <ion-label>About</ion-label>
-          </ion-tab-button>
-        </ion-tab-bar>
-      </ion-tabs>
-    ];
-  }
-}
-```
-
-
-</TabItem>
-
-
 <TabItem value="vue">
 
 ```html
diff --git a/docs/api/tab.md b/docs/api/tab.md
index 3dd6576e4a8..f361abaac68 100644
--- a/docs/api/tab.md
+++ b/docs/api/tab.md
@@ -22,7 +22,7 @@ import EncapsulationPill from '@components/page/api/EncapsulationPill';
 The tab component is a child component of [tabs](tabs.md). Each tab can contain a top level navigation stack for an app or a single view. An app can have many tabs, all with their own independent navigation.
 
 :::note
- Note: This component should only be used with vanilla or Stencil JavaScript projects. For Angular, React, and Vue apps you do not need to use `ion-tab` to declare your tab components.
+ Note: This component should only be used with vanilla JavaScript projects. For Angular, React, and Vue apps you do not need to use `ion-tab` to declare your tab components.
 :::
 
 
diff --git a/versioned_docs/version-v5/api/tab-bar.md b/versioned_docs/version-v5/api/tab-bar.md
index b1e79d6d4f2..002dad4e8bf 100644
--- a/versioned_docs/version-v5/api/tab-bar.md
+++ b/versioned_docs/version-v5/api/tab-bar.md
@@ -18,7 +18,7 @@ The tab bar is a UI component that contains a set of [tab buttons](tab-button.md
 
 ## Usage
 
-<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'stencil', label: 'Stencil' }, { value: 'vue', label: 'Vue' }]}>
+<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }]}>
 
 <TabItem value="angular">
 
@@ -96,44 +96,6 @@ export const TabBarExample: React.FC = () => (
 
 </TabItem>
 
-<TabItem value="stencil">
-
-```tsx
-import { Component, h } from '@stencil/core';
-
-@Component({
-  tag: 'tab-bar-example',
-  styleUrl: 'tab-bar-example.css',
-})
-export class TabBarExample {
-  render() {
-    return [
-      <ion-tabs>
-        {/* Tab views */}
-        <ion-tab tab="account" component="page-account"></ion-tab>
-        <ion-tab tab="contact" component="page-contact"></ion-tab>
-        <ion-tab tab="settings" component="page-settings"></ion-tab>
-
-        {/* Tab bar */}
-        <ion-tab-bar slot="bottom">
-          <ion-tab-button tab="account">
-            <ion-icon name="person"></ion-icon>
-          </ion-tab-button>
-          <ion-tab-button tab="contact">
-            <ion-icon name="call"></ion-icon>
-          </ion-tab-button>
-          <ion-tab-button tab="settings">
-            <ion-icon name="settings"></ion-icon>
-          </ion-tab-button>
-        </ion-tab-bar>
-      </ion-tabs>,
-    ];
-  }
-}
-```
-
-</TabItem>
-
 <TabItem value="vue">
 
 ```html
diff --git a/versioned_docs/version-v5/api/tab-button.md b/versioned_docs/version-v5/api/tab-button.md
index 5244dbffbe7..83100e90adb 100644
--- a/versioned_docs/version-v5/api/tab-button.md
+++ b/versioned_docs/version-v5/api/tab-button.md
@@ -20,7 +20,7 @@ See the [tabs documentation](tabs.md) for more details on configuring tabs.
 
 ## Usage
 
-<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'stencil', label: 'Stencil' }, { value: 'vue', label: 'Vue' }]}>
+<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }]}>
 
 <TabItem value="angular">
 
@@ -140,66 +140,6 @@ export const TabButtonExample: React.FC = () => (
 
 </TabItem>
 
-<TabItem value="stencil">
-
-```tsx
-import { Component, h } from '@stencil/core';
-
-@Component({
-  tag: 'tab-button-example',
-  styleUrl: 'tab-button-example.css',
-})
-export class TabButtonExample {
-  render() {
-    return [
-      <ion-tabs>
-        {/* Tab views */}
-        <ion-tab tab="schedule">
-          <ion-router-outlet name="schedule"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="speakers">
-          <ion-router-outlet name="speakers"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="map">
-          <ion-router-outlet name="map"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="about">
-          <ion-router-outlet name="about"></ion-router-outlet>
-        </ion-tab>
-
-        {/* Tab bar */}
-        <ion-tab-bar slot="bottom">
-          <ion-tab-button tab="schedule" href="/app/tabs/(schedule:schedule)">
-            <ion-icon name="calendar"></ion-icon>
-            <ion-label>Schedule</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="speakers" href="/app/tabs/(speakers:speakers)">
-            <ion-icon name="person-circle"></ion-icon>
-            <ion-label>Speakers</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="map" href="/app/tabs/(map:map)">
-            <ion-icon name="map"></ion-icon>
-            <ion-label>Map</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="about" href="/app/tabs/(about:about)">
-            <ion-icon name="information-circle"></ion-icon>
-            <ion-label>About</ion-label>
-          </ion-tab-button>
-        </ion-tab-bar>
-      </ion-tabs>,
-    ];
-  }
-}
-```
-
-</TabItem>
-
 <TabItem value="vue">
 
 ```html
diff --git a/versioned_docs/version-v5/api/tab.md b/versioned_docs/version-v5/api/tab.md
index 1f34ac2b184..9f54b12145a 100644
--- a/versioned_docs/version-v5/api/tab.md
+++ b/versioned_docs/version-v5/api/tab.md
@@ -16,7 +16,7 @@ import Slots from '@ionic-internal/component-api/v5/tab/slots.md';
 
 The tab component is a child component of [tabs](tabs.md). Each tab can contain a top level navigation stack for an app or a single view. An app can have many tabs, all with their own independent navigation.
 
-> Note: This component should only be used with vanilla or Stencil JavaScript projects. For Angular, React, and Vue apps you do not need to use `ion-tab` to declare your tab components.
+> Note: This component should only be used with vanilla JavaScript projects. For Angular, React, and Vue apps you do not need to use `ion-tab` to declare your tab components.
 
 See the [tabs documentation](tabs.md) for more details on configuring tabs.
 
diff --git a/versioned_docs/version-v6/api/tab-bar.md b/versioned_docs/version-v6/api/tab-bar.md
index cbf15815ba7..b8ab1b26f8f 100644
--- a/versioned_docs/version-v6/api/tab-bar.md
+++ b/versioned_docs/version-v6/api/tab-bar.md
@@ -28,7 +28,7 @@ The tab bar is a UI component that contains a set of [tab buttons](tab-button.md
 
 ## Usage
 
-<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'stencil', label: 'Stencil' }, { value: 'vue', label: 'Vue' }]}>
+<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }]}>
 
 <TabItem value="angular">
 
@@ -106,44 +106,6 @@ export const TabBarExample: React.FC = () => (
 
 </TabItem>
 
-<TabItem value="stencil">
-
-```tsx
-import { Component, h } from '@stencil/core';
-
-@Component({
-  tag: 'tab-bar-example',
-  styleUrl: 'tab-bar-example.css',
-})
-export class TabBarExample {
-  render() {
-    return [
-      <ion-tabs>
-        {/* Tab views */}
-        <ion-tab tab="account" component="page-account"></ion-tab>
-        <ion-tab tab="contact" component="page-contact"></ion-tab>
-        <ion-tab tab="settings" component="page-settings"></ion-tab>
-
-        {/* Tab bar */}
-        <ion-tab-bar slot="bottom">
-          <ion-tab-button tab="account">
-            <ion-icon name="person"></ion-icon>
-          </ion-tab-button>
-          <ion-tab-button tab="contact">
-            <ion-icon name="call"></ion-icon>
-          </ion-tab-button>
-          <ion-tab-button tab="settings">
-            <ion-icon name="settings"></ion-icon>
-          </ion-tab-button>
-        </ion-tab-bar>
-      </ion-tabs>,
-    ];
-  }
-}
-```
-
-</TabItem>
-
 <TabItem value="vue">
 
 ```html
diff --git a/versioned_docs/version-v6/api/tab-button.md b/versioned_docs/version-v6/api/tab-button.md
index a989563be88..4fdac8afaa6 100644
--- a/versioned_docs/version-v6/api/tab-button.md
+++ b/versioned_docs/version-v6/api/tab-button.md
@@ -22,7 +22,7 @@ See the [tabs documentation](tabs.md) for more details on configuring tabs.
 
 ## Usage
 
-<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'stencil', label: 'Stencil' }, { value: 'vue', label: 'Vue' }]}>
+<Tabs groupId="framework" defaultValue="angular" values={[{ value: 'angular', label: 'Angular' }, { value: 'javascript', label: 'Javascript' }, { value: 'react', label: 'React' }, { value: 'vue', label: 'Vue' }]}>
 
 <TabItem value="angular">
 
@@ -142,66 +142,6 @@ export const TabButtonExample: React.FC = () => (
 
 </TabItem>
 
-<TabItem value="stencil">
-
-```tsx
-import { Component, h } from '@stencil/core';
-
-@Component({
-  tag: 'tab-button-example',
-  styleUrl: 'tab-button-example.css',
-})
-export class TabButtonExample {
-  render() {
-    return [
-      <ion-tabs>
-        {/* Tab views */}
-        <ion-tab tab="schedule">
-          <ion-router-outlet name="schedule"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="speakers">
-          <ion-router-outlet name="speakers"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="map">
-          <ion-router-outlet name="map"></ion-router-outlet>
-        </ion-tab>
-
-        <ion-tab tab="about">
-          <ion-router-outlet name="about"></ion-router-outlet>
-        </ion-tab>
-
-        {/* Tab bar */}
-        <ion-tab-bar slot="bottom">
-          <ion-tab-button tab="schedule" href="/app/tabs/(schedule:schedule)">
-            <ion-icon name="calendar"></ion-icon>
-            <ion-label>Schedule</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="speakers" href="/app/tabs/(speakers:speakers)">
-            <ion-icon name="person-circle"></ion-icon>
-            <ion-label>Speakers</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="map" href="/app/tabs/(map:map)">
-            <ion-icon name="map"></ion-icon>
-            <ion-label>Map</ion-label>
-          </ion-tab-button>
-
-          <ion-tab-button tab="about" href="/app/tabs/(about:about)">
-            <ion-icon name="information-circle"></ion-icon>
-            <ion-label>About</ion-label>
-          </ion-tab-button>
-        </ion-tab-bar>
-      </ion-tabs>,
-    ];
-  }
-}
-```
-
-</TabItem>
-
 <TabItem value="vue">
 
 ```html
diff --git a/versioned_docs/version-v6/api/tab.md b/versioned_docs/version-v6/api/tab.md
index deafa889116..5b6cd8cd79e 100644
--- a/versioned_docs/version-v6/api/tab.md
+++ b/versioned_docs/version-v6/api/tab.md
@@ -24,7 +24,7 @@ import EncapsulationPill from '@components/page/api/EncapsulationPill';
 The tab component is a child component of [tabs](tabs.md). Each tab can contain a top level navigation stack for an app or a single view. An app can have many tabs, all with their own independent navigation.
 
 :::note
-Note: This component should only be used with vanilla or Stencil JavaScript projects. For Angular, React, and Vue apps you do not need to use `ion-tab` to declare your tab components.
+Note: This component should only be used with vanilla JavaScript projects. For Angular, React, and Vue apps you do not need to use `ion-tab` to declare your tab components.
 :::
 
 See the [tabs documentation](tabs.md) for more details on configuring tabs.