diff --git a/packages/components/icon/src/icon.vue b/packages/components/icon/src/icon.vue
index 439a385a..2195d0ba 100644
--- a/packages/components/icon/src/icon.vue
+++ b/packages/components/icon/src/icon.vue
@@ -1,10 +1,5 @@
 <template>
-  <component
-    :is="nodeType"
-    class="puik-icon"
-    :class="`material-icons-round`"
-    :style="style"
-  >
+  <component :is="nodeType" class="puik-icon" :style="style">
     {{ icon }}
   </component>
 </template>
diff --git a/packages/theme/src/breadcrumb.scss b/packages/theme/src/breadcrumb.scss
index eca11b70..6e743c97 100644
--- a/packages/theme/src/breadcrumb.scss
+++ b/packages/theme/src/breadcrumb.scss
@@ -19,9 +19,6 @@
     &-link {
       @extend .puik-body-small;
       @apply text-primary font-normal;
-      &:hover {
-        @apply text-blue;
-      }
     }
 
     &--last {
diff --git a/packages/theme/src/link.scss b/packages/theme/src/link.scss
index 3659adcd..06370ed4 100644
--- a/packages/theme/src/link.scss
+++ b/packages/theme/src/link.scss
@@ -1,20 +1,20 @@
 @use './common/typography.scss';
 
 .puik-link {
-  @apply relative text-blue transition m-0.5 p-0.5 py-[4px] decoration-1;
+  @apply relative text-primary transition m-0.5 p-0.5 py-[4px] decoration-1;
   &:before {
     content: '';
-    @apply opacity-0 absolute h-[1px] bg-primary-800 bottom-0 left-[50%] translate-x-[-50%] transition-all ease-in-out duration-200;
-    width: calc(100% - 8px);
+    @apply absolute h-[1px] bg-primary-500 bottom-[1px] left-[50%] translate-x-[-50%] transition-all ease-in-out duration-150;
+    width: calc(100% - 4px);
   }
   &:hover,
   &:active {
-    @apply text-blue-700 cursor-pointer;
+    @apply cursor-pointer;
     &:before {
-      @apply opacity-100 bottom-[3px] transition-all ease-in-out duration-300;
+      @apply bg-primary-800 bottom-[3px] transition-all ease-in-out duration-150;
     }
     &:before:visited {
-      @apply bg-primary-500;
+      @apply bg-primary-800;
     }
   }
   &:focus-visible {