diff --git a/packages/calcite-components/src/components/icon/icon.e2e.ts b/packages/calcite-components/src/components/icon/icon.e2e.ts
index 4e8072af2d3..6a0d5fc4923 100644
--- a/packages/calcite-components/src/components/icon/icon.e2e.ts
+++ b/packages/calcite-components/src/components/icon/icon.e2e.ts
@@ -1,5 +1,5 @@
 import { newE2EPage } from "@stencil/core/testing";
-import { accessible, defaults, hidden, reflects, renders } from "../../tests/commonTests";
+import { accessible, defaults, hidden, reflects, renders, themed } from "../../tests/commonTests";
 import { CSS } from "./resources";
 import { scaleToPx } from "./utils";
 
@@ -106,4 +106,22 @@ describe("calcite-icon", () => {
       );
     });
   });
+
+  describe("theme", () => {
+    describe("default", () => {
+      themed("calcite-icon", {
+        "--calcite-icon-color": {
+          targetProp: "color",
+        },
+      });
+    });
+
+    describe("deprecated", () => {
+      themed("calcite-icon", {
+        "--calcite-ui-icon-color": {
+          targetProp: "color",
+        },
+      });
+    });
+  });
 });