diff --git a/core/src/components/chip/chip.scss b/core/src/components/chip/chip.scss
index 34d2718448..63a0a02412 100644
--- a/core/src/components/chip/chip.scss
+++ b/core/src/components/chip/chip.scss
@@ -1,20 +1,20 @@
-@use "../../themes-migrated/ionic.globals" as ionic4;
-@use "../../themes-migrated/ionic.functions.color" as ionic3;
-@use "../../themes-migrated/ionic.mixins" as ionic2;
-@use "../../themes-migrated/ionic.theme.default";
+@use "../../themes-migrated/ionic.globals" as globals;
+@use "../../themes-migrated/ionic.functions.color" as colorFunctions;
+@use "../../themes-migrated/ionic.mixins" as mixins;
+@use "../../themes-migrated/ionic.theme.default" as defaultTheme;
 
 :host {
   /**
    * @prop --background: Background of the chip
    * @prop --color: Color of the chip
    */
-  --background: #{rgba(ionic.$text-color-rgb, .12)};
-  --color: #{rgba(ionic.$text-color-rgb, .87)};
+  --background: #{rgba(defaultTheme.$text-color-rgb, .12)};
+  --color: #{rgba(defaultTheme.$text-color-rgb, .87)};
 
-  @include ionic2.border-radius(16px);
-  @include ionic2.font-smoothing();
-  @include ionic2.margin(4px);
-  @include ionic2.padding(7px, 12px);
+  @include mixins.border-radius(16px);
+  @include mixins.font-smoothing();
+  @include mixins.margin(4px);
+  @include mixins.padding(7px, 12px);
 
   display: inline-flex;
 
@@ -27,7 +27,7 @@
   background: var(--background);
   color: var(--color);
 
-  font-family: ionic4.$font-family-base;
+  font-family: globals.$font-family-base;
   font-size: 14px;
 
   cursor: pointer;
@@ -48,16 +48,16 @@
 // ---------------------------------------------
 
 :host(.ion-color) {
-  background: ionic3.current-color(base, .08);
-  color: ionic3.current-color(shade);
+  background: colorFunctions.current-color(base, .08);
+  color: colorFunctions.current-color(shade);
 }
 
 :host(.ion-color:focus) {
-  background: ionic3.current-color(base, .12);
+  background: colorFunctions.current-color(base, .12);
 }
 
 :host(.ion-color.ion-activated) {
-  background: ionic3.current-color(base, .16);
+  background: colorFunctions.current-color(base, .16);
 }
 
 
@@ -70,21 +70,21 @@
 }
 
 :host(.chip-outline) {
-  border-color: rgba(ionic.$text-color-rgb, .32);
+  border-color: rgba(defaultTheme.$text-color-rgb, .32);
 
   background: transparent;
 }
 
 :host(.chip-outline.ion-color) {
-  border-color: ionic3.current-color(base, .32);
+  border-color: colorFunctions.current-color(base, .32);
 }
 
 :host(.chip-outline:not(.ion-color):focus) {
-  background: rgba(ionic.$text-color-rgb, .04);
+  background: rgba(defaultTheme.$text-color-rgb, .04);
 }
 
 :host(.chip-outline.ion-activated:not(.ion-color)) {
-  background: rgba(ionic.$text-color-rgb, .08);
+  background: rgba(defaultTheme.$text-color-rgb, .08);
 }
 
 
@@ -96,15 +96,15 @@
 }
 
 :host(:not(.ion-color)) ::slotted(ion-icon) {
-  color: rgba(ionic.$text-color-rgb, .54);
+  color: rgba(defaultTheme.$text-color-rgb, .54);
 }
 
 ::slotted(ion-icon:first-child) {
-  @include ionic2.margin(-4px, 8px, -4px, -4px);
+  @include mixins.margin(-4px, 8px, -4px, -4px);
 }
 
 ::slotted(ion-icon:last-child) {
-  @include ionic2.margin(-4px, -4px, -4px, 8px);
+  @include mixins.margin(-4px, -4px, -4px, 8px);
 }
 
 
@@ -117,11 +117,11 @@
 }
 
 ::slotted(ion-avatar:first-child) {
-  @include ionic2.margin(-4px, 8px, -4px, -8px);
+  @include mixins.margin(-4px, 8px, -4px, -8px);
 }
 
 ::slotted(ion-avatar:last-child) {
-  @include ionic2.margin(-4px, -8px, -4px, 8px);
+  @include mixins.margin(-4px, -8px, -4px, 8px);
 }
 
 
@@ -133,7 +133,7 @@
 }
 
 :host(:focus) {
-  --background: #{rgba(ionic.$text-color-rgb, .16)};
+  --background: #{rgba(defaultTheme.$text-color-rgb, .16)};
 }
 
 
@@ -141,7 +141,7 @@
 // ---------------------------------------------
 
 :host(.ion-activated) {
-  --background: #{rgba(ionic.$text-color-rgb, .20)};
+  --background: #{rgba(defaultTheme.$text-color-rgb, .20)};
 }
 
 
@@ -150,14 +150,14 @@
 
 @media (any-hover: hover) {
   :host(:hover) {
-    --background: #{rgba(ionic.$text-color-rgb, .16)};
+    --background: #{rgba(defaultTheme.$text-color-rgb, .16)};
   }
 
   :host(.ion-color:hover) {
-    background: ionic3.current-color(base, .12);
+    background: colorFunctions.current-color(base, .12);
   }
 
   :host(.chip-outline:not(.ion-color):hover) {
-    background: rgba(ionic.$text-color-rgb, .04);
+    background: rgba(defaultTheme.$text-color-rgb, .04);
   }
 }
diff --git a/core/src/themes-migrated/ionic.functions.color.scss b/core/src/themes-migrated/ionic.functions.color.scss
index aac867e862..4d9719dfa0 100644
--- a/core/src/themes-migrated/ionic.functions.color.scss
+++ b/core/src/themes-migrated/ionic.functions.color.scss
@@ -1,6 +1,7 @@
 @use "sass:color";
 @use "sass:map";
-@use "ionic.theme.default";
+
+@use "ionic.theme.default" as defaultTheme;
 
 // Gets the active color's css variable from a variation. Alpha is optional.
 // --------------------------------------------------------------------------------------------
@@ -24,7 +25,7 @@
 // ion-color(primary, base, 0.5) => rgba(var(--ion-color-primary-rgb, 56, 128, 255), 0.5)
 // --------------------------------------------------------------------------------------------
 @function ion-color($name, $variation, $alpha: null, $rgb: null) {
-  $values: map.get(ionic.$colors, $name);
+  $values: map.get(defaultTheme.$colors, $name);
   $value: map.get($values, $variation);
   $variable: --ion-color-#{$name}-#{$variation};
 
diff --git a/core/src/themes-migrated/ionic.globals.scss b/core/src/themes-migrated/ionic.globals.scss
index e82613d1b9..3f4ce635d4 100644
--- a/core/src/themes-migrated/ionic.globals.scss
+++ b/core/src/themes-migrated/ionic.globals.scss
@@ -1,15 +1,15 @@
 
 // Global Utility Functions
-@use "ionic.functions.string";
+@use "ionic.functions.string" as stringFunctions;
 
 // Global Color Functions
-@use "ionic.functions.color" as ionic2;
+@use "ionic.functions.color" as colorFunctions;
 
 // Global Mixins
-@use "ionic.mixins" as ionic3;
+@use "ionic.mixins" as mixins;
 
 // Default Theme
-@use "ionic.theme.default" as ionic4;
+@use "ionic.theme.default" as defaultTheme;
 
 
 // Default General
diff --git a/core/src/themes-migrated/ionic.mixins.scss b/core/src/themes-migrated/ionic.mixins.scss
index dc3dd04ff2..6726e1524e 100644
--- a/core/src/themes-migrated/ionic.mixins.scss
+++ b/core/src/themes-migrated/ionic.mixins.scss
@@ -1,8 +1,9 @@
 @use "sass:list";
 @use "sass:map";
 @use "sass:string";
-@use "ionic.functions.string";
-@use "ionic.globals" as ionic3;
+
+@use "ionic.functions.string" as stringFunctions;
+@use "ionic.globals" as globals;
 
 @mixin input-cover() {
   @include position(0, null, null, 0);
@@ -108,7 +109,7 @@
 //
 //    >> breakpoint-min(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
 //    576px
-@function breakpoint-min($name, $breakpoints: ionic3.$screen-breakpoints) {
+@function breakpoint-min($name, $breakpoints: globals.$screen-breakpoints) {
   $min: map.get($breakpoints, $name);
 
   @return if($name != index-to-key($breakpoints, 1), $min, null);
@@ -121,13 +122,13 @@
 //    ""  (Returns a blank string)
 //    >> breakpoint-infix(sm, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
 //    "-sm"
-@function breakpoint-infix($name, $breakpoints: ionic3.$screen-breakpoints) {
+@function breakpoint-infix($name, $breakpoints: globals.$screen-breakpoints) {
   @return if(breakpoint-min($name, $breakpoints) == null, "", "-#{$name}");
 }
 
 // Media of at least the minimum breakpoint width. No query for the smallest breakpoint.
 // Makes the @content apply to the given breakpoint and wider.
-@mixin media-breakpoint-up($name, $breakpoints: ionic3.$screen-breakpoints) {
+@mixin media-breakpoint-up($name, $breakpoints: globals.$screen-breakpoints) {
   $min: breakpoint-min($name, $breakpoints);
   @if $min {
     @media (min-width: $min) {
@@ -146,7 +147,7 @@
 //    md
 //    >> breakpoint-next(sm, $breakpoint-names: (xs sm md lg xl))
 //    md
-@function breakpoint-next($name, $breakpoints: ionic3.$screen-breakpoints, $breakpoint-names: map.keys($breakpoints)) {
+@function breakpoint-next($name, $breakpoints: globals.$screen-breakpoints, $breakpoint-names: map.keys($breakpoints)) {
   $n: list.index($breakpoint-names, $name);
   @return if($n < list.length($breakpoint-names), list.nth($breakpoint-names, $n + 1), null);
 }
@@ -161,14 +162,14 @@
 //
 //    >> breakpoint-max(md, (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px))
 //    767.98px
-@function breakpoint-max($name, $breakpoints: ionic3.$screen-breakpoints) {
+@function breakpoint-max($name, $breakpoints: globals.$screen-breakpoints) {
   $max: map.get($breakpoints, $name);
   @return if($max and $max > 0, $max - .02, null);
 }
 
 // Media of at most the maximum breakpoint width. No query for the largest breakpoint.
 // Makes the @content apply to the given breakpoint and narrower.
-@mixin media-breakpoint-down($name, $breakpoints: ionic3.$screen-breakpoints) {
+@mixin media-breakpoint-down($name, $breakpoints: globals.$screen-breakpoints) {
   $max: breakpoint-max($name, $breakpoints);
   @if $max {
     @media (max-width: $max) {
@@ -200,9 +201,9 @@
 @mixin rtl() {
   $root: #{&};
 
-  $rootSplit: ionic.str-split($root, ",");
-  $selectors: #{ionic.add-root-selector($root, "[dir=rtl]")};
-  $selectorsSplit: ionic.str-split($selectors, ",");
+  $rootSplit: stringFunctions.str-split($root, ",");
+  $selectors: #{stringFunctions.add-root-selector($root, "[dir=rtl]")};
+  $selectorsSplit: stringFunctions.str-split($selectors, ",");
 
   $hostContextSelectors: ();
   $restSelectors: ();
@@ -223,7 +224,7 @@
       $restSelectors: list.append($restSelectors, $selector, comma);
     }
   }
-  
+
   // Supported by Chrome.
   @if list.length($hostContextSelectors) > 0 {
     @at-root #{$hostContextSelectors} {
@@ -272,8 +273,8 @@
 // @param {string} $svg
 // ----------------------------------------------------------
 @mixin svg-background-image($svg, $flip-rtl: false) {
-  $url: ionic.url-encode($svg);
-  $viewBox: ionic.str-split(ionic.str-extract($svg, "viewBox='", "'"), " ");
+  $url: stringFunctions.url-encode($svg);
+  $viewBox: stringFunctions.str-split(stringFunctions.str-extract($svg, "viewBox='", "'"), " ");
 
   @if $flip-rtl != true or $viewBox == null {
     @include multi-dir() {
@@ -282,10 +283,10 @@
   } @else {
     $transform: "transform='translate(#{list.nth($viewBox, 3)}, 0) scale(-1, 1)'";
     $flipped-url: $svg;
-    $flipped-url: ionic.str-replace($flipped-url, "<path", "<path #{$transform}");
-    $flipped-url: ionic.str-replace($flipped-url, "<line", "<line #{$transform}");
-    $flipped-url: ionic.str-replace($flipped-url, "<polygon", "<polygon #{$transform}");
-    $flipped-url: ionic.url-encode($flipped-url);
+    $flipped-url: stringFunctions.str-replace($flipped-url, "<path", "<path #{$transform}");
+    $flipped-url: stringFunctions.str-replace($flipped-url, "<line", "<line #{$transform}");
+    $flipped-url: stringFunctions.str-replace($flipped-url, "<polygon", "<polygon #{$transform}");
+    $flipped-url: stringFunctions.url-encode($flipped-url);
 
     @include ltr () {
       background-image: url("data:image/svg+xml;charset=utf-8,#{$url}");
@@ -563,10 +564,10 @@
 
   @each $transform in $transforms {
     @if (string.index($transform, translate3d)) {
-      $transform: ionic.str-replace($transform, 'translate3d(');
-      $transform: ionic.str-replace($transform, ')');
+      $transform: stringFunctions.str-replace($transform, 'translate3d(');
+      $transform: stringFunctions.str-replace($transform, ')');
 
-      $coordinates: ionic.str-split($transform, ',');
+      $coordinates: stringFunctions.str-split($transform, ',');
 
       $x: list.nth($coordinates, 1);
       $y: list.nth($coordinates, 2);
diff --git a/core/src/themes-migrated/ionic.theme.default.scss b/core/src/themes-migrated/ionic.theme.default.scss
index 9d5c412848..48d0d1c60b 100644
--- a/core/src/themes-migrated/ionic.theme.default.scss
+++ b/core/src/themes-migrated/ionic.theme.default.scss
@@ -1,5 +1,6 @@
 @use "sass:color";
-@use "ionic.functions.color";
+
+@use "ionic.functions.color" as colorFunctions;
 
 // Ionic Theme
 // -------------------------------------------------------------------------------------------
@@ -29,56 +30,56 @@ $colors:  (
   primary: (
     base:             $primary,
     contrast:         #fff,
-    shade:            ionic.get-color-shade($primary),
-    tint:             ionic.get-color-tint($primary)
+    shade:            colorFunctions.get-color-shade($primary),
+    tint:             colorFunctions.get-color-tint($primary)
   ),
   secondary: (
     base:             $secondary,
     contrast:         #fff,
-    shade:            ionic.get-color-shade($secondary),
-    tint:             ionic.get-color-tint($secondary)
+    shade:            colorFunctions.get-color-shade($secondary),
+    tint:             colorFunctions.get-color-tint($secondary)
   ),
   tertiary: (
     base:             $tertiary,
     contrast:         #fff,
-    shade:            ionic.get-color-shade($tertiary),
-    tint:             ionic.get-color-tint($tertiary)
+    shade:            colorFunctions.get-color-shade($tertiary),
+    tint:             colorFunctions.get-color-tint($tertiary)
   ),
   success: (
     base:             $success,
     contrast:         #fff,
-    shade:            ionic.get-color-shade($success),
-    tint:             ionic.get-color-tint($success)
+    shade:            colorFunctions.get-color-shade($success),
+    tint:             colorFunctions.get-color-tint($success)
   ),
   warning: (
     base:             $warning,
     contrast:         #000,
-    shade:            ionic.get-color-shade($warning),
-    tint:             ionic.get-color-tint($warning)
+    shade:            colorFunctions.get-color-shade($warning),
+    tint:             colorFunctions.get-color-tint($warning)
   ),
   danger: (
     base:             $danger,
     contrast:         #fff,
-    shade:            ionic.get-color-shade($danger),
-    tint:             ionic.get-color-tint($danger)
+    shade:            colorFunctions.get-color-shade($danger),
+    tint:             colorFunctions.get-color-tint($danger)
   ),
   light: (
     base:             $light,
     contrast:         #000,
-    shade:            ionic.get-color-shade($light),
-    tint:             ionic.get-color-tint($light)
+    shade:            colorFunctions.get-color-shade($light),
+    tint:             colorFunctions.get-color-tint($light)
   ),
   medium: (
     base:             $medium,
     contrast:         #fff,
-    shade:            ionic.get-color-shade($medium),
-    tint:             ionic.get-color-tint($medium)
+    shade:            colorFunctions.get-color-shade($medium),
+    tint:             colorFunctions.get-color-tint($medium)
   ),
   dark: (
     base:             $dark,
     contrast:         #fff,
-    shade:            ionic.get-color-shade($dark),
-    tint:             ionic.get-color-tint($dark)
+    shade:            colorFunctions.get-color-shade($dark),
+    tint:             colorFunctions.get-color-tint($dark)
   )
 ) !default;