diff --git a/src/renderer/components/+catalog/catalog.module.scss b/src/renderer/components/+catalog/catalog.module.scss
index 5948d64a62..e285fb3ced 100644
--- a/src/renderer/components/+catalog/catalog.module.scss
+++ b/src/renderer/components/+catalog/catalog.module.scss
@@ -43,6 +43,8 @@
   }
 
   .pinIcon {
+    --color-active: var(--textColorAccent);
+
     transition: none;
     opacity: 0;
     margin-left: var(--padding);
diff --git a/src/renderer/components/icon/icon.scss b/src/renderer/components/icon/icon.scss
index b8d97cc3c8..de8d6fbdf2 100644
--- a/src/renderer/components/icon/icon.scss
+++ b/src/renderer/components/icon/icon.scss
@@ -111,7 +111,7 @@
   }
 
   &.active {
-    color: var(--textColorAccent);
+    color: var(--color-active);
     box-shadow: 0 0 0 2px var(--iconActiveBackground);
     background-color: var(--iconActiveBackground);
   }