diff --git a/libs/components/icon/src/lib/modules/icon/icon-svg.component.ts b/libs/components/icon/src/lib/modules/icon/icon-svg.component.ts
index 03b68be97f..a60f734d2c 100644
--- a/libs/components/icon/src/lib/modules/icon/icon-svg.component.ts
+++ b/libs/components/icon/src/lib/modules/icon/icon-svg.component.ts
@@ -39,7 +39,7 @@ function defaultSize(value: SkyIconSize | undefined): SkyIconSize {
   styleUrls: ['./icon-svg.component.scss'],
   host: {
     '[class]':
-      'relativeSize() ? "sky-icon-svg-relative=" + relativeSize() : "sky-icon-svg-" + iconSize()',
+      'relativeSize() ? "sky-icon-svg-relative-" + relativeSize() : "sky-icon-svg-" + iconSize()',
   },
   hostDirectives: [SkyThemeComponentClassDirective],
 })
diff --git a/libs/components/icon/testing/src/modules/icon/icon-harness.spec.ts b/libs/components/icon/testing/src/modules/icon/icon-harness.spec.ts
index bcb5de43ac..78975ae8f0 100644
--- a/libs/components/icon/testing/src/modules/icon/icon-harness.spec.ts
+++ b/libs/components/icon/testing/src/modules/icon/icon-harness.spec.ts
@@ -339,7 +339,7 @@ describe('Icon harness', () => {
       }
     });
 
-    it('should return the correct icon size when responsive size is used', async () => {
+    it('should return the correct icon size when relative size is used', async () => {
       const { iconHarness, fixture } = await setupTest({
         dataSkyId: 'svg-icon',
       });
diff --git a/libs/components/icon/testing/src/modules/icon/icon-harness.ts b/libs/components/icon/testing/src/modules/icon/icon-harness.ts
index ec3ab4f918..f865e4a06d 100644
--- a/libs/components/icon/testing/src/modules/icon/icon-harness.ts
+++ b/libs/components/icon/testing/src/modules/icon/icon-harness.ts
@@ -41,10 +41,8 @@ export class SkyIconHarness extends SkyComponentHarness {
       // match a class name that starts with `fa-` and follows with `lg`, `2x`, `3x`, `4x`, `5x`
       if (/^fa-(?=2xs|lg|[2-5]+x)/.test(iconClass)) {
         return iconClass.replace('fa-', '');
-      } else if (
-        /^sky-icon-svg-responsive-(?=2xs|lg|[2-5]+x)/.test(iconClass)
-      ) {
-        return iconClass.replace('sky-icon-svg-responsive-', '');
+      } else if (/^sky-icon-svg-relative-(?=2xs|lg|[2-5]+x)/.test(iconClass)) {
+        return iconClass.replace('sky-icon-svg-relative-', '');
       } else if (/^sky-icon-svg-(?=xxxs|xxs|xs|s|m|l|xl|xxl)/.test(iconClass)) {
         return iconClass.replace('sky-icon-svg-', '');
       }
@@ -65,7 +63,7 @@ export class SkyIconHarness extends SkyComponentHarness {
    */
   public async getVariant(): Promise<string | undefined> {
     const iconInfo = await this.#getSpecifiedIconInfo();
-    const svgIcon = await this.locatorForOptional('.sky-icon-svg')();
+    const svgIcon = await this.locatorForOptional('sky-icon-svg')();
 
     if (svgIcon || iconInfo.iconType === 'skyux') {
       return iconInfo.variant || 'line';
@@ -87,7 +85,7 @@ export class SkyIconHarness extends SkyComponentHarness {
 
   async #getIcon(): Promise<TestElement> {
     const icon = await this.locatorForOptional('.sky-icon')();
-    const svgIcon = await this.locatorForOptional('.sky-icon-svg')();
+    const svgIcon = await this.locatorForOptional('sky-icon-svg')();
 
     if (icon) {
       return icon;