diff --git a/frontend/src/config/identities/github/config.ts b/frontend/src/config/identities/github/config.ts
index 7fa66222e9..7c5018bd88 100644
--- a/frontend/src/config/identities/github/config.ts
+++ b/frontend/src/config/identities/github/config.ts
@@ -4,7 +4,8 @@ const github: IdentityConfig = {
   key: 'github',
   name: 'GitHub',
   image: '/images/identities/github.png',
-  icon: 'github-fill',
+  icon: 'github',
+  iconType: 'brands',
   color: '#24292F',
   member: {
     urlPrefix: 'github.com/',
diff --git a/frontend/src/config/identities/index.ts b/frontend/src/config/identities/index.ts
index a9f2b87e50..f1d967cc13 100644
--- a/frontend/src/config/identities/index.ts
+++ b/frontend/src/config/identities/index.ts
@@ -30,6 +30,7 @@ export interface IdentityConfig {
   name: string; // Display name of the identity
   image: string; // Image URL for the identity
   icon?: string; // Image URL for the identity
+  iconType?: string
   color?: string; // Image URL for the identity
   member?: {
     placeholder?: string;
diff --git a/frontend/src/config/identities/linkedin/config.ts b/frontend/src/config/identities/linkedin/config.ts
index fdff2cd2b9..992a4cdc54 100644
--- a/frontend/src/config/identities/linkedin/config.ts
+++ b/frontend/src/config/identities/linkedin/config.ts
@@ -4,7 +4,8 @@ const linkedin: IdentityConfig = {
   key: 'linkedin',
   name: 'LinkedIn',
   image: '/images/identities/linkedin.png',
-  icon: 'linkedin-box-fill',
+  icon: 'linkedin',
+  iconType: 'brands',
   color: '#2867B2',
   member: {
     urlPrefix: 'linkedin.com/in/',
diff --git a/frontend/src/config/integrations/confluence/components/confluence-params.vue b/frontend/src/config/integrations/confluence/components/confluence-params.vue
index 16d2e99c7a..044c025c63 100644
--- a/frontend/src/config/integrations/confluence/components/confluence-params.vue
+++ b/frontend/src/config/integrations/confluence/components/confluence-params.vue
@@ -7,9 +7,7 @@
             <div
               class="text-gray-600 text-2xs flex items-center leading-5 font-medium"
             >
-              <i
-                class="ri-folders-line text-base !text-gray-600 mr-1 h-4 flex items-center"
-              />
+              <lf-icon name="folders" class="!text-gray-600 mr-1 h-4 flex items-center" />
               1 organization
             </div>
             •
@@ -26,8 +24,9 @@
             Confluence organizations
           </p>
           <article class="flex items-center flex-nowrap mb-4 last:mb-0">
-            <i
-              class="ri-community-line text-[16px] mr-1 h-4 flex items-center"
+            <lf-icon
+              name="house-building"
+              class="mr-1 h-4 flex items-center"
             />
 
             <span class="text-gray-900 text-sm max-w-3xs truncate">{{
@@ -40,9 +39,7 @@
           </p>
 
           <article class="flex items-center flex-nowrap mb-4 last:mb-0">
-            <div
-              class="ri-folder-line text-[16px] mr-1 h-4 flex items-center"
-            />
+            <lf-icon name="folder" class="mr-1 h-4 flex items-center" />
 
             <span class="text-gray-900 text-sm max-w-3xs truncate">{{
               space?.name || space?.key || "Unnamed space"
@@ -56,6 +53,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps({
   integration: {
diff --git a/frontend/src/config/integrations/devto/components/devto-connect-drawer.vue b/frontend/src/config/integrations/devto/components/devto-connect-drawer.vue
index feeb0e12fc..2b43857d3d 100644
--- a/frontend/src/config/integrations/devto/components/devto-connect-drawer.vue
+++ b/frontend/src/config/integrations/devto/components/devto-connect-drawer.vue
@@ -85,7 +85,7 @@
                 class="btn btn-link btn-link--md btn-link--primary w-10 h-10"
                 @click="removeOrganization(org.id)"
               >
-                <i class="ri-delete-bin-line text-lg text-black" />
+                <lf-icon name="trash-can" :size="20" class="text-black" />
               </el-button>
             </div>
             <span
@@ -142,7 +142,7 @@
                 class="btn btn-link btn-link--md btn-link--primary w-10 h-10"
                 @click="removeUser(user.id)"
               >
-                <i class="ri-delete-bin-line text-lg text-black" />
+                <lf-icon name="trash-can" :size="20" class="text-black" />
               </el-button>
             </div>
             <span
@@ -205,6 +205,7 @@ import { IntegrationService } from '@/modules/integration/integration-service';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
 import { Platform } from '@/shared/modules/platform/types/Platform';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const { doDevtoConnect } = mapActions('integration');
 
diff --git a/frontend/src/config/integrations/devto/components/devto-params.vue b/frontend/src/config/integrations/devto/components/devto-params.vue
index 86bafdf64a..a90762d0aa 100644
--- a/frontend/src/config/integrations/devto/components/devto-params.vue
+++ b/frontend/src/config/integrations/devto/components/devto-params.vue
@@ -7,10 +7,7 @@
             <div
               class="text-gray-600 text-2xs flex items-center leading-5 font-medium"
             >
-              <i
-                class="ri-community-line text-base !text-gray-600 mr-1 h-4 flex items-center"
-              />
-
+              <lf-icon name="house-building" class="!text-gray-600 mr-1 h-4 flex items-center" />
               {{ pluralize("organization", organizations.length, true) }}
             </div>
             •
@@ -32,10 +29,7 @@
               :key="organization"
               class="flex items-center flex-nowrap mb-4 last:mb-0"
             >
-              <i
-                class="ri-community-line text-[16px] mr-1 h-4 flex items-center"
-              />
-
+              <lf-icon name="house-building" class="mr-1 h-4 flex items-center" />
               <span class="text-gray-900 text-sm max-w-3xs truncate">{{
                 organization
               }}</span>
@@ -55,9 +49,7 @@
               :key="user"
               class="flex items-center flex-nowrap mb-4 last:mb-0"
             >
-              <div
-                class="ri-user-line text-[16px] mr-1 h-4 flex items-center"
-              />
+              <lf-icon name="user" class="mr-1 h-4 flex items-center" />
 
               <span class="text-gray-900 text-sm max-w-3xs truncate">{{
                 user
@@ -73,6 +65,7 @@
 <script setup lang="ts">
 import { computed } from 'vue';
 import pluralize from 'pluralize';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps({
   integration: {
diff --git a/frontend/src/config/integrations/discourse/components/discourse-params.vue b/frontend/src/config/integrations/discourse/components/discourse-params.vue
index 40d335c81e..1e10297953 100644
--- a/frontend/src/config/integrations/discourse/components/discourse-params.vue
+++ b/frontend/src/config/integrations/discourse/components/discourse-params.vue
@@ -6,9 +6,7 @@
           <div
             class="text-gray-600 text-2xs flex items-center leading-5 font-medium"
           >
-            <i
-              class="ri-question-answer-line text-base !text-gray-600 mr-1 h-4 flex items-center"
-            />
+            <lf-icon name="messages" class="!text-gray-600 mr-1 h-4 flex items-center" />
             1 forum
           </div>
         </template>
@@ -18,10 +16,7 @@
         </p>
         <div class="max-h-44 overflow-auto -my-1 px-1">
           <article class="flex items-center flex-nowrap mb-4 last:mb-0">
-            <i
-              class="ri-question-answer-line text-[16px] mr-1 h-4 flex items-center"
-            />
-
+            <lf-icon name="messages" class="mr-1 h-4 flex items-center" />
             <span class="text-gray-900 text-sm max-w-3xs truncate">{{
               forum
             }}</span>
@@ -34,6 +29,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps({
   integration: {
diff --git a/frontend/src/config/integrations/github-archive/components/settings/github-settings-add-repository-modal.vue b/frontend/src/config/integrations/github-archive/components/settings/github-settings-add-repository-modal.vue
index 19ed448496..5c39612597 100644
--- a/frontend/src/config/integrations/github-archive/components/settings/github-settings-add-repository-modal.vue
+++ b/frontend/src/config/integrations/github-archive/components/settings/github-settings-add-repository-modal.vue
@@ -103,7 +103,7 @@
                   <lf-avatar :name="org.name" :src="org.logo" :size="32" class="!rounded border border-gray-200">
                     <template #placeholder>
                       <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                        <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+                        <lf-icon name="house-building" :size="12" class="text-gray-400" />
                       </div>
                     </template>
                   </lf-avatar>
diff --git a/frontend/src/config/integrations/github-archive/components/settings/github-settings-org-item.vue b/frontend/src/config/integrations/github-archive/components/settings/github-settings-org-item.vue
index 7828b191eb..e94968d054 100644
--- a/frontend/src/config/integrations/github-archive/components/settings/github-settings-org-item.vue
+++ b/frontend/src/config/integrations/github-archive/components/settings/github-settings-org-item.vue
@@ -6,7 +6,7 @@
         <lf-avatar :name="props.organization.name" :src="props.organization.logo" :size="24" class="!rounded border border-gray-200">
           <template #placeholder>
             <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-              <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+              <lf-icon name="house-building" :size="12" class="text-gray-400" />
             </div>
           </template>
         </lf-avatar>
@@ -17,7 +17,7 @@
 
       <div class="flex items-center gap-2">
         <lf-badge v-if="isSynced" type="primary" class="!flex items-center gap-1 !rounded-full !px-2">
-          <lf-icon-old name="loop-right-line" />
+          <lf-icon name="arrows-rotate" />
           Synced
         </lf-badge>
         <lf-dropdown placement="bottom-end" width="11.125rem">
@@ -70,7 +70,6 @@ import {
   GitHubSettingsRepository,
 } from '@/config/integrations/github-archive/types/GithubSettings';
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
 import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfBadge from '@/ui-kit/badge/Badge.vue';
diff --git a/frontend/src/config/integrations/github/components/connect/github-connect-modal.vue b/frontend/src/config/integrations/github/components/connect/github-connect-modal.vue
index 0d5b574025..1e371097b0 100644
--- a/frontend/src/config/integrations/github/components/connect/github-connect-modal.vue
+++ b/frontend/src/config/integrations/github/components/connect/github-connect-modal.vue
@@ -15,7 +15,7 @@
           class="-mt-2 -mr-2"
           @click="isModalOpen = false"
         >
-          <lf-icon-old name="close-line" :size="24" />
+          <lf-icon name="xmark" type="regular" :size="24" />
         </lf-button>
       </div>
       <section class="pt-6 pb-8">
@@ -58,11 +58,11 @@
             </p>
             <lf-button type="primary-link" size="small" @click="copy()">
               <template v-if="!copied">
-                <lf-icon-old name="file-copy-line" />
+                <lf-icon name="copy" />
                 Copy app installation link to clipboard
               </template>
               <template v-else>
-                <lf-icon-old name="checkbox-circle-fill" class="text-green-500" />
+                <lf-icon name="circle-check" class="text-green-500" />
                 <span class="text-green-500">Copied to clipboard!</span>
               </template>
             </lf-button>
@@ -100,7 +100,7 @@
               >
                 <template #placeholder>
                   <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                    <lf-icon-old name="community-line" :size="14" class="text-gray-400" />
+                    <lf-icon name="house-building" :size="14" class="text-gray-400" />
                   </div>
                 </template>
               </lf-avatar>
@@ -116,7 +116,7 @@
                 <lf-avatar :src="i.avatarUrl" :name="i.login" :size="18" class="!rounded border border-gray-200 mr-1 mt-px">
                   <template #placeholder>
                     <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                      <lf-icon-old name="community-line" :size="14" class="text-gray-400" />
+                      <lf-icon name="house-building" :size="14" class="text-gray-400" />
                     </div>
                   </template>
                 </lf-avatar>
@@ -139,6 +139,7 @@ import { computed, onMounted, ref } from 'vue';
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import config from '@/config';
 import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
 import { IntegrationService } from '@/modules/integration/integration-service';
diff --git a/frontend/src/config/integrations/jira/components/jira-params.vue b/frontend/src/config/integrations/jira/components/jira-params.vue
index a883a8c83c..7983d65400 100644
--- a/frontend/src/config/integrations/jira/components/jira-params.vue
+++ b/frontend/src/config/integrations/jira/components/jira-params.vue
@@ -6,9 +6,7 @@
           <div
             class="text-gray-600 text-2xs flex items-center leading-5 font-medium"
           >
-            <i
-              class="ri-folders-line text-base !text-gray-600 mr-1 h-4 flex items-center"
-            />
+            <lf-icon name="folders" class="!text-gray-600 mr-1 h-4 flex items-center" />
             {{ pluralize('project', projects.length, true) }}
           </div>
         </template>
@@ -22,10 +20,7 @@
             :key="project"
             class="flex items-center flex-nowrap mb-4 last:mb-0"
           >
-            <i
-              class="ri-folder-line text-[16px] mr-1 h-4 flex items-center"
-            />
-
+            <lf-icon name="folder" class="mr-1 h-4 flex items-center" />
             <span class="text-gray-900 text-sm max-w-3xs truncate">{{
               project
             }}</span>
@@ -39,6 +34,7 @@
 <script setup lang="ts">
 import { computed } from 'vue';
 import pluralize from 'pluralize';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps({
   integration: {
diff --git a/frontend/src/modules/admin/modules/integration/components/integration-status.vue b/frontend/src/modules/admin/modules/integration/components/integration-status.vue
index 8d9cdc317e..5b8f632acc 100644
--- a/frontend/src/modules/admin/modules/integration/components/integration-status.vue
+++ b/frontend/src/modules/admin/modules/integration/components/integration-status.vue
@@ -1,7 +1,7 @@
 <template>
   <div class="flex items-center text-medium gap-1.5 whitespace-nowrap">
     <template v-if="status">
-      <lf-icon-old :name="status.status.icon" :class="status.status.color" :size="20" />
+      <lf-icon v-if="status.status.icon" :name="status.status.icon" :type="status.status.iconType" :class="status.status.color" :size="20" />
       <span class="font-semibold" :class="status.status.color">{{ status.status.text }}</span>
     </template>
   </div>
@@ -9,7 +9,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { getIntegrationStatus } from '@/modules/admin/modules/integration/config/status';
 
 const props = defineProps<{
diff --git a/frontend/src/modules/admin/modules/integration/components/status/integration-platform-select.vue b/frontend/src/modules/admin/modules/integration/components/status/integration-platform-select.vue
index 81a7b3545c..e9933f9f8f 100644
--- a/frontend/src/modules/admin/modules/integration/components/status/integration-platform-select.vue
+++ b/frontend/src/modules/admin/modules/integration/components/status/integration-platform-select.vue
@@ -3,20 +3,20 @@
     <template #trigger>
       <lf-button type="secondary" class="!font-normal">
         <template v-if="!model">
-          <lf-icon-old name="apps-2-line" :size="16" />
+          <lf-icon name="grid-round-2" type="regular" :size="16" />
           All integrations
         </template>
         <template v-else>
           <img :src="lfIntegrations[model]?.image" :alt="lfIntegrations[model]?.name" class="w-4 h-4 object-contain">
           {{ lfIntegrations[model]?.name }}
         </template>
-        <lf-icon-old name="arrow-down-s-line" :size="16" />
+        <lf-icon name="chevron-down" :size="16" />
       </lf-button>
     </template>
     <div class="max-h-80 overflow-y-scroll -m-2 p-2">
       <lf-dropdown-item :selected="!model" @click="model = ''">
         <div class="flex items-center gap-2">
-          <lf-icon-old name="apps-2-line" :size="16" />
+          <lf-icon name="grid-round-2" type="regular" :size="16" />
           All integrations
         </div>
       </lf-dropdown-item>
@@ -40,7 +40,7 @@
 <script lang="ts" setup>
 import { computed } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
 import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
 import LfDropdownSeparator from '@/ui-kit/dropdown/DropdownSeparator.vue';
diff --git a/frontend/src/modules/admin/modules/integration/config/status/connecting.ts b/frontend/src/modules/admin/modules/integration/config/status/connecting.ts
index 0270e8a13b..929f43e3ce 100644
--- a/frontend/src/modules/admin/modules/integration/config/status/connecting.ts
+++ b/frontend/src/modules/admin/modules/integration/config/status/connecting.ts
@@ -6,7 +6,8 @@ const connecting: IntegrationStatusConfig = {
   statuses: ['in-progress'],
   status: {
     text: 'Connecting',
-    icon: 'loader-4-line animate-spin',
+    icon: 'circle-notch animate-spin',
+    iconType: 'solid',
     color: 'text-secondary-500',
   },
   actionBar: {
diff --git a/frontend/src/modules/admin/modules/integration/config/status/done.ts b/frontend/src/modules/admin/modules/integration/config/status/done.ts
index b7221d45bd..bdb0c6ce8d 100644
--- a/frontend/src/modules/admin/modules/integration/config/status/done.ts
+++ b/frontend/src/modules/admin/modules/integration/config/status/done.ts
@@ -6,7 +6,8 @@ const done: IntegrationStatusConfig = {
   statuses: ['done'],
   status: {
     text: 'Connected',
-    icon: 'checkbox-circle-fill',
+    icon: 'circle-check',
+    iconType: 'solid',
     color: 'text-green-600',
   },
   actionBar: {
diff --git a/frontend/src/modules/admin/modules/integration/config/status/error.ts b/frontend/src/modules/admin/modules/integration/config/status/error.ts
index 2588899aa9..41f9705fb9 100644
--- a/frontend/src/modules/admin/modules/integration/config/status/error.ts
+++ b/frontend/src/modules/admin/modules/integration/config/status/error.ts
@@ -6,7 +6,8 @@ const error: IntegrationStatusConfig = {
   statuses: ['error'],
   status: {
     text: 'Connection failed',
-    icon: 'error-warning-fill',
+    icon: 'circle-exclamation',
+    iconType: 'solid',
     color: 'text-red-500',
   },
   actionBar: {
diff --git a/frontend/src/modules/admin/modules/integration/config/status/index.ts b/frontend/src/modules/admin/modules/integration/config/status/index.ts
index b8901c9e69..41ddd8a2be 100644
--- a/frontend/src/modules/admin/modules/integration/config/status/index.ts
+++ b/frontend/src/modules/admin/modules/integration/config/status/index.ts
@@ -11,6 +11,7 @@ export interface IntegrationStatusConfig {
   status: {
     text: string;
     icon: string;
+    iconType?: string;
     color: string;
   },
   actionBar: {
diff --git a/frontend/src/modules/admin/modules/integration/config/status/waiting-for-action.ts b/frontend/src/modules/admin/modules/integration/config/status/waiting-for-action.ts
index 33bec2afa5..53f8994d8a 100644
--- a/frontend/src/modules/admin/modules/integration/config/status/waiting-for-action.ts
+++ b/frontend/src/modules/admin/modules/integration/config/status/waiting-for-action.ts
@@ -6,7 +6,8 @@ const waitingForAction: IntegrationStatusConfig = {
   statuses: ['pending-action', 'mapping'],
   status: {
     text: 'Action required',
-    icon: 'alert-fill',
+    icon: 'triangle-exclamation',
+    iconType: 'solid',
     color: 'text-yellow-600',
   },
   actionBar: {
diff --git a/frontend/src/modules/admin/modules/integration/pages/integration-status.page.vue b/frontend/src/modules/admin/modules/integration/pages/integration-status.page.vue
index c7923fe892..3746cb1391 100644
--- a/frontend/src/modules/admin/modules/integration/pages/integration-status.page.vue
+++ b/frontend/src/modules/admin/modules/integration/pages/integration-status.page.vue
@@ -64,7 +64,7 @@
                       <app-integration-progress-wrapper :segments="[integration.segmentId]">
                         <template #default="{ progress }">
                           <div class="flex items-center gap-1.5">
-                            <lf-icon-old name="loader-4-fill" class="text-gray-500 animate-spin" :size="16" />
+                            <lf-icon name="circle-notch" type="solid" class="text-gray-500 animate-spin" :size="16" />
                             <app-integration-progress-bar
                               :progress="progress.find((p) => p.platform === integration.platform)"
                               :hide-bar="true"
@@ -76,13 +76,13 @@
                     </template>
                     <template v-else-if="status === 'waitingForAction'">
                       <div class="flex items-center gap-1.5">
-                        <lf-icon-old name="alert-fill" class="text-yellow-600" :size="16" />
+                        <lf-icon name="triangle-exclamation" type="solid" class="text-yellow-600" :size="16" />
                         <span class="text-tiny text-yellow-600">Action required</span>
                       </div>
                     </template>
                     <template v-else-if="status === 'error'">
                       <div class="flex items-center gap-1.5">
-                        <lf-icon-old name="error-warning-fill" class="text-red-600" :size="16" />
+                        <lf-icon name="circle-exclamation" type="solid" class="text-red-600" :size="16" />
                         <span class="text-tiny text-red-600">Connection failed</span>
                       </div>
                     </template>
@@ -173,7 +173,6 @@ import LfTabs from '@/ui-kit/tabs/Tabs.vue';
 import LfTab from '@/ui-kit/tabs/Tab.vue';
 import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
 import AppIntegrationProgressBar from '@/modules/integration/components/integration-progress-bar.vue';
 import AppIntegrationProgressWrapper from '@/modules/integration/components/integration-progress-wrapper.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
diff --git a/frontend/src/modules/admin/modules/projects/components/fragments/lf-project-count.vue b/frontend/src/modules/admin/modules/projects/components/fragments/lf-project-count.vue
index 59a10bc8f8..0da48aa40d 100644
--- a/frontend/src/modules/admin/modules/projects/components/fragments/lf-project-count.vue
+++ b/frontend/src/modules/admin/modules/projects/components/fragments/lf-project-count.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <lf-badge type="secondary" class="!flex items-center gap-1 w-full !rounded-full !px-2.5">
-      <lf-icon-old name="stack-line" />
+      <lf-icon name="layer-group" type="regular" />
       {{ pluralize('project', props.count, true) }}
     </lf-badge>
   </div>
@@ -9,7 +9,7 @@
 
 <script lang="ts" setup>
 import pluralize from 'pluralize';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfBadge from '@/ui-kit/badge/Badge.vue';
 
 const props = defineProps<{
diff --git a/frontend/src/modules/contributor/components/details/contributor-details-actions.vue b/frontend/src/modules/contributor/components/details/contributor-details-actions.vue
index 0225d1a64c..3be6aa9add 100644
--- a/frontend/src/modules/contributor/components/details/contributor-details-actions.vue
+++ b/frontend/src/modules/contributor/components/details/contributor-details-actions.vue
@@ -8,7 +8,7 @@
           contributor: props.contributor,
         })"
       >
-        <lf-icon-old name="feedback-line" class="text-red-500" /> Report data issue
+        <lf-icon name="message-exclamation fa-sharp" class="text-red-500" /> Report data issue
       </lf-button>
       <lf-button
         v-if="mergeSuggestionsCount > 0 && hasPermission(LfPermission.mergeMembers)"
@@ -27,7 +27,7 @@
         type="secondary"
         @click="isMergeDialogOpen = props.contributor"
       >
-        <lf-icon-old name="p2p-line" />
+        <lf-icon name="merge" />
         Merge profile
       </lf-button>
 
@@ -43,7 +43,7 @@
             :icon-only="true"
             :class="hasPermission(LfPermission.mergeMembers) ? '!rounded-l-none -ml-px' : ''"
           >
-            <lf-icon-old name="more-fill" />
+            <lf-icon name="ellipsis" />
           </lf-button>
         </template>
 
@@ -81,7 +81,7 @@
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
 import LfButtonGroup from '@/ui-kit/button/ButtonGroup.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
diff --git a/frontend/src/modules/contributor/components/details/contributor-details-activities.vue b/frontend/src/modules/contributor/components/details/contributor-details-activities.vue
index 9520282716..1de4c5ed25 100644
--- a/frontend/src/modules/contributor/components/details/contributor-details-activities.vue
+++ b/frontend/src/modules/contributor/components/details/contributor-details-activities.vue
@@ -1,6 +1,6 @@
 <template>
   <div v-if="props.contributor.activitySycning?.state === MergeActionState.IN_PROGRESS" class="pt-12 flex flex-col items-center">
-    <lf-icon-old name="loader-4-line" :size="40" class="text-gray-300 animate-spin" />
+    <lf-icon name="circle-notch" type="solid" :size="40" class="text-gray-300 animate-spin" />
     <h6 class="text-center py-3">
       Syncing activities...
     </h6>
@@ -11,7 +11,7 @@
     </p>
   </div>
   <div v-else-if="props.contributor.activitySycning?.state === MergeActionState.ERROR" class="pt-12 flex flex-col items-center">
-    <lf-icon-old name="error-warning-line" :size="40" class="text-gray-300" />
+    <lf-icon name="circle-exclamation" :size="40" class="text-gray-300" />
     <h6 class="text-center py-3">
       Error syncing activities
     </h6>
@@ -37,6 +37,7 @@ import AppActivityTimeline from '@/modules/activity/components/activity-timeline
 import { useRoute } from 'vue-router';
 import { MergeActionState } from '@/shared/modules/merge/types/MemberActions';
 import { ref } from 'vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps<{
   contributor: Contributor,
diff --git a/frontend/src/modules/contributor/components/details/contributor-details-work-history.vue b/frontend/src/modules/contributor/components/details/contributor-details-work-history.vue
index 10741b979c..afb9acbd78 100644
--- a/frontend/src/modules/contributor/components/details/contributor-details-work-history.vue
+++ b/frontend/src/modules/contributor/components/details/contributor-details-work-history.vue
@@ -43,7 +43,7 @@
         </lf-timeline-item>
       </lf-timeline>
       <div v-if="orgGrouped.length === 0" class="pt-2 flex flex-col items-center">
-        <lf-icon-old name="survey-line" :size="40" class="text-gray-300" />
+        <lf-icon name="clipboard-list fa-sharp" :size="40" class="text-gray-300" />
         <p class="text-center pt-3 text-medium text-gray-400">
           No work experiences
         </p>
@@ -71,7 +71,6 @@
 
 <script setup lang="ts">
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
 import { computed, ref } from 'vue';
 import usePermissions from '@/shared/modules/permissions/helpers/usePermissions';
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
diff --git a/frontend/src/modules/contributor/components/details/header/contributor-details-header-profile-photo.vue b/frontend/src/modules/contributor/components/details/header/contributor-details-header-profile-photo.vue
index 5a1870d5f8..fe5cb1acbe 100644
--- a/frontend/src/modules/contributor/components/details/header/contributor-details-header-profile-photo.vue
+++ b/frontend/src/modules/contributor/components/details/header/contributor-details-header-profile-photo.vue
@@ -10,7 +10,7 @@
       <template #overlay>
         <div class="absolute top-0 left-0 w-full h-full bg-secondary-500 opacity-50" />
         <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">
-          <lf-icon-old name="pencil-line" :size="24" class="text-white" />
+          <lf-icon name="pen fa-sharp" :size="24" class="text-white" />
         </div>
       </template>
     </lf-avatar>
@@ -31,7 +31,7 @@
 
 <script setup lang="ts">
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { ref } from 'vue';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 import useContributorHelpers from '@/modules/contributor/helpers/contributor.helpers';
diff --git a/frontend/src/modules/contributor/components/details/header/contributor-details-header-profiles.vue b/frontend/src/modules/contributor/components/details/header/contributor-details-header-profiles.vue
index 118f43aeff..0bb0b78815 100644
--- a/frontend/src/modules/contributor/components/details/header/contributor-details-header-profiles.vue
+++ b/frontend/src/modules/contributor/components/details/header/contributor-details-header-profiles.vue
@@ -17,7 +17,7 @@
             <p class="!text-white">
               {{ lfIdentities[platform]?.name }} profile
             </p>
-            <lf-icon-old name="external-link-line" :size="14" class="text-gray-400" />
+            <lf-icon name="arrow-up-right-from-square" type="regular" :size="14" class="text-gray-400" />
           </a>
         </template>
         <a
@@ -29,8 +29,9 @@
           class="flex items-center gap-1"
           @click="idents.length > 1 ? $event.preventDefault() : null"
         >
-          <lf-icon-old
-            :name="lfIdentities[platform]?.icon || 'radar-line'"
+          <lf-icon
+            :name="lfIdentities[platform]?.icon || 'satellite-dish'"
+            :type="lfIdentities[platform]?.iconType"
             :size="20"
             :style="{ color: lfIdentities[platform]?.color }"
             class="platform-icon"
@@ -64,7 +65,7 @@ opacity-0 invisible transition group-hover:visible group-hover:opacity-100 z-30
               {{ identity.value }}
             </p>
           </div>
-          <lf-icon-old v-if="identity.url" name="external-link-line" :size="16" class="text-gray-300" />
+          <lf-icon v-if="identity.url" name="arrow-up-right-from-square" type="regular" :size="16" class="text-gray-300" />
         </a>
       </div>
     </div>
@@ -73,7 +74,7 @@ opacity-0 invisible transition group-hover:visible group-hover:opacity-100 z-30
 
 <script setup lang="ts">
 import { computed } from 'vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import useContributorHelpers from '@/modules/contributor/helpers/contributor.helpers';
 import { contributorDetailsHeaderProfilePlatforms } from '@/modules/contributor/config/details-header-profile-platforms';
diff --git a/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-add-dropdown.vue b/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-add-dropdown.vue
index 3d2a7ff81e..c0766f17ce 100644
--- a/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-add-dropdown.vue
+++ b/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-add-dropdown.vue
@@ -11,9 +11,10 @@
           placeholder="Search..."
         >
           <template #suffix>
-            <lf-icon-old
+            <lf-icon
               v-if="search.length"
-              name="close-circle-line"
+              name="circle-xmark"
+              type="regular"
               :size="16"
               class="text-gray-400 cursor-pointer"
               @click="search = ''"
@@ -41,7 +42,7 @@
           })"
         >
           <div class="w-full flex items-center gap-2">
-            <lf-icon-old name="mail-line" :size="16" /> Email
+            <lf-icon name="envelope" type="regular" :size="16" /> Email
           </div>
         </lf-dropdown-item>
       </template>
@@ -56,7 +57,7 @@
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
 import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
 import LfDropdownSeparator from '@/ui-kit/dropdown/DropdownSeparator.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { ContributorIdentity } from '@/modules/contributor/types/Contributor';
 import LfInput from '@/ui-kit/input/Input.vue';
 import { computed, ref } from 'vue';
diff --git a/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-item.vue b/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-item.vue
index e68daf39f6..e67cdedfe6 100644
--- a/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-item.vue
+++ b/frontend/src/modules/contributor/components/details/identity/contributor-details-identity-item.vue
@@ -6,7 +6,7 @@
   >
     <div class="mt-0.5">
       <lf-tooltip v-if="props.identity.type === 'email'" content="Email" placement="top-start">
-        <lf-icon-old name="mail-line" :size="20" />
+        <lf-icon name="envelope" type="regular" :size="20" />
       </lf-tooltip>
       <lf-tooltip v-else-if="lfIdentities[props.identity.platform]" placement="top-start" :content="lfIdentities[props.identity.platform].name">
         <img
@@ -16,8 +16,8 @@
         />
       </lf-tooltip>
       <lf-tooltip v-else content="Custom identity" placement="top-start">
-        <lf-icon-old
-          name="fingerprint-fill"
+        <lf-icon
+          name="fingerprint"
           :size="20"
           class="text-gray-600"
         />
@@ -62,7 +62,7 @@
     <lf-dropdown v-show="hovered" placement="bottom-end" width="232px">
       <template #trigger>
         <lf-button type="secondary-ghost" size="small" :icon-only="true">
-          <lf-icon-old name="more-fill" />
+          <lf-icon name="ellipsis" />
         </lf-button>
       </template>
       <!-- Edit identity -->
@@ -81,7 +81,7 @@
           class="w-full"
           @click="emit('edit')"
         >
-          <lf-icon-old name="pencil-line" />Edit identity
+          <lf-icon name="pen fa-sharp" />Edit identity
         </lf-dropdown-item>
       </lf-tooltip>
 
@@ -90,7 +90,7 @@
         v-if="hasPermission(LfPermission.memberEdit)"
         @click="emit('unmerge')"
       >
-        <lf-icon-old name="link-unlink" />Unmerge identity
+        <lf-icon name="link-simple-slash" />Unmerge identity
       </lf-dropdown-item>
 
       <lf-dropdown-item
@@ -100,7 +100,7 @@
           attribute: props.identity,
         })"
       >
-        <lf-icon-old name="feedback-line" class="!text-red-500" />Report issue
+        <lf-icon name="message-exclamation fa-sharp" class="!text-red-500" />Report issue
       </lf-dropdown-item>
 
       <template
@@ -122,7 +122,7 @@
             class="w-full"
             @click="removeIdentity"
           >
-            <lf-icon-old name="delete-bin-6-line" />Delete identity
+            <lf-icon name="trash-can" />Delete identity
           </lf-dropdown-item>
         </lf-tooltip>
       </template>
@@ -131,7 +131,7 @@
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Contributor, ContributorIdentity } from '@/modules/contributor/types/Contributor';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
diff --git a/frontend/src/modules/contributor/components/details/overview/contributor-details-attributes.vue b/frontend/src/modules/contributor/components/details/overview/contributor-details-attributes.vue
index 4bd694d11a..b475b00352 100644
--- a/frontend/src/modules/contributor/components/details/overview/contributor-details-attributes.vue
+++ b/frontend/src/modules/contributor/components/details/overview/contributor-details-attributes.vue
@@ -10,7 +10,7 @@
         size="small"
         @click="edit = true"
       >
-        <lf-icon-old name="pencil-line" />
+        <lf-icon name="pen fa-sharp" />
         Edit attributes
       </lf-button>
     </div>
@@ -174,7 +174,7 @@
         && Object.keys(attributes).length === 0"
       class="pt-2 flex flex-col items-center w-full"
     >
-      <lf-icon-old name="list-view" :size="80" class="text-gray-300" />
+      <lf-icon name="rectangle-list" :size="80" class="text-gray-300" />
       <p class="text-center pt-3 text-medium text-gray-400">
         No profile details yet
       </p>
@@ -189,7 +189,7 @@
 
 <script setup lang="ts">
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import AppMemberManageAttributesDrawer from '@/modules/member/components/member-manage-attributes-drawer.vue';
 import { computed, ref } from 'vue';
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
diff --git a/frontend/src/modules/contributor/components/details/overview/contributor-details-community.vue b/frontend/src/modules/contributor/components/details/overview/contributor-details-community.vue
index 262158e8b9..e21880ba5f 100644
--- a/frontend/src/modules/contributor/components/details/overview/contributor-details-community.vue
+++ b/frontend/src/modules/contributor/components/details/overview/contributor-details-community.vue
@@ -12,7 +12,7 @@
             </p>
             <el-popover placement="top" width="20rem">
               <template #reference>
-                <lf-icon-old name="question-line" :size="14" class="text-secondary-200 font-normal" />
+                <lf-icon name="circle-question" :size="14" class="text-secondary-200 font-normal" />
               </template>
               <div class="p-1">
                 <p class="text-small font-semibold mb-2 text-black">
@@ -44,7 +44,7 @@
                 Calculated based on the recency and importance<br> of a person's
                 activities in comparison<br> to the community.
               </template>
-              <lf-icon-old name="question-line" :size="14" class="text-secondary-200" />
+              <lf-icon name="circle-question" :size="14" class="text-secondary-200" />
             </el-tooltip>
           </div>
           <lf-contributor-engagement-level :contributor="props.contributor" />
@@ -87,7 +87,7 @@
 <script setup lang="ts">
 import LfCard from '@/ui-kit/card/Card.vue';
 import moment from 'moment';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { formatNumber } from '@/utils/number';
 import LfContributorEngagementLevel from '@/modules/contributor/components/shared/contributor-engagement-level.vue';
 import LfContributorSentiment from '@/modules/contributor/components/shared/contributor-sentiment.vue';
diff --git a/frontend/src/modules/contributor/components/details/overview/contributor-details-projects.vue b/frontend/src/modules/contributor/components/details/overview/contributor-details-projects.vue
index e9131068b6..29ee2105e3 100644
--- a/frontend/src/modules/contributor/components/details/overview/contributor-details-projects.vue
+++ b/frontend/src/modules/contributor/components/details/overview/contributor-details-projects.vue
@@ -14,7 +14,7 @@
               Affiliation
               <el-popover placement="top" width="20rem">
                 <template #reference>
-                  <lf-icon-old name="question-line" :size="14" class="text-secondary-200 font-normal" />
+                  <lf-icon name="circle-question" :size="14" class="text-secondary-200 font-normal" />
                 </template>
                 <div class="p-1">
                   <p class="text-small font-semibold mb-2 text-black">
@@ -33,7 +33,7 @@
               Role
               <el-popover placement="top" width="20rem">
                 <template #reference>
-                  <lf-icon-old name="question-line" :size="14" class="text-secondary-200 font-normal" />
+                  <lf-icon name="circle-question" :size="14" class="text-secondary-200 font-normal" />
                 </template>
                 <div class="p-1">
                   <p class="text-small font-semibold mb-2 text-black">
@@ -79,7 +79,7 @@
                   class="!text-primary-300 hover:!text-primary-600"
                   @click="isAffilationEditOpen = true"
                 >
-                  <lf-icon-old name="add-line" />Add affiliation
+                  <lf-icon name="plus" />Add affiliation
                 </lf-button>
               </div>
             </lf-table-cell>
@@ -90,14 +90,14 @@
               <lf-dropdown placement="bottom-end" width="160px">
                 <template #trigger>
                   <lf-button type="secondary-ghost" size="small" :icon-only="true">
-                    <lf-icon-old name="more-2-fill" />
+                    <lf-icon name="ellipsis-vertical" type="regular" />
                   </lf-button>
                 </template>
                 <lf-dropdown-item @click="viewActivity(project.id)">
-                  <lf-icon-old name="eye-line" />View activity
+                  <lf-icon name="eye" />View activity
                 </lf-dropdown-item>
                 <lf-dropdown-item v-if="hasPermission(LfPermission.memberEdit)" @click="isAffilationEditOpen = true">
-                  <lf-icon-old name="pencil-line" />Edit affiliation
+                  <lf-icon name="pen fa-sharp" />Edit affiliation
                 </lf-dropdown-item>
                 <lf-dropdown-item
                   @click="
@@ -108,7 +108,7 @@
                     })
                   "
                 >
-                  <lf-icon-old name="feedback-line" class="!text-red-500" />Report issue
+                  <lf-icon name="message-exclamation fa-sharp" class="!text-red-500" />Report issue
                 </lf-dropdown-item>
               </lf-dropdown>
             </lf-table-cell>
@@ -132,7 +132,6 @@
 <script setup lang="ts">
 import LfCard from '@/ui-kit/card/Card.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
 import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { computed, ref } from 'vue';
 import { useRoute, useRouter } from 'vue-router';
diff --git a/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-affiliation.vue b/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-affiliation.vue
index 54af6d053a..0a21732109 100644
--- a/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-affiliation.vue
+++ b/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-affiliation.vue
@@ -34,7 +34,7 @@
           >
             <template #placeholder>
               <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+                <lf-icon name="house-building" :size="12" class="text-gray-400" />
               </div>
             </template>
           </lf-avatar>
@@ -85,7 +85,7 @@
               >
                 <template #placeholder>
                   <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                    <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+                    <lf-icon name="house-building" :size="12" class="text-gray-400" />
                   </div>
                 </template>
               </lf-avatar>
@@ -104,7 +104,7 @@
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { ContributorAffiliation } from '@/modules/contributor/types/Contributor';
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
 import { storeToRefs } from 'pinia';
diff --git a/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-sorting.vue b/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-sorting.vue
index eec10c36a1..d53d8b83bd 100644
--- a/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-sorting.vue
+++ b/frontend/src/modules/contributor/components/details/overview/project/contributor-details-projects-sorting.vue
@@ -5,7 +5,7 @@
         <p class="text-small pr-1">
           <span class="font-semibold">Sort:</span> {{ label }}
         </p>
-        <lf-icon-old name="arrow-down-s-line" :size="16" />
+        <lf-icon name="chevron-down" :size="16" />
       </div>
     </template>
     <lf-dropdown-item
@@ -22,7 +22,7 @@
 import { computed } from 'vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
 import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps<{
   sorting: string,
diff --git a/frontend/src/modules/contributor/components/details/work-history/contributor-details-work-history-item.vue b/frontend/src/modules/contributor/components/details/work-history/contributor-details-work-history-item.vue
index bd84af0048..bcf2c090e7 100644
--- a/frontend/src/modules/contributor/components/details/work-history/contributor-details-work-history-item.vue
+++ b/frontend/src/modules/contributor/components/details/work-history/contributor-details-work-history-item.vue
@@ -13,7 +13,7 @@
           </p>
         </div>
         <p class="text-small text-gray-500 mb-1.5 flex items-center">
-          <lf-icon-old name="calendar-line" :size="16" class="mr-1.5 text-gray-400" />
+          <lf-icon name="calendar" :size="16" class="mr-1.5 text-gray-400" />
           {{ getDateRange(props.organization?.memberOrganizations?.dateStart, props.organization?.memberOrganizations?.dateEnd) }}
         </p>
       </div>
@@ -21,12 +21,12 @@
       <lf-dropdown v-show="hovered || isGroupHover" class="work-history-item-dropdown self-start" placement="bottom-end" width="14.5rem">
         <template #trigger>
           <lf-button type="secondary-ghost" size="small" :icon-only="true">
-            <lf-icon name="ellipsis" />
+            <lf-icon name="ellipsis" type="regular" />
           </lf-button>
         </template>
 
         <lf-dropdown-item v-if="hasPermission(LfPermission.memberEdit)" @click="emit('edit')">
-          <lf-icon-old name="pencil-line" />Edit work experience
+          <lf-icon name="pen fa-sharp" />Edit work experience
         </lf-dropdown-item>
         <lf-dropdown-item
           @click="setReportDataModal({
@@ -35,12 +35,12 @@
             attribute: props.organization,
           })"
         >
-          <lf-icon-old name="feedback-line" class="!text-red-500" />Report issue
+          <lf-icon name="message-exclamation fa-sharp" class="!text-red-500" />Report issue
         </lf-dropdown-item>
         <template v-if="hasPermission(LfPermission.memberEdit)">
           <lf-dropdown-separator />
           <lf-dropdown-item type="danger" @click="removeWorkHistory">
-            <lf-icon-old name="delete-bin-6-line" />Delete work experience
+            <lf-icon name="trash-can" />Delete work experience
           </lf-dropdown-item>
         </template>
       </lf-dropdown>
@@ -49,7 +49,7 @@
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 import LfSvg from '@/shared/svg/svg.vue';
 import { Organization } from '@/modules/organization/types/Organization';
@@ -68,7 +68,6 @@ import usePermissions from '@/shared/modules/permissions/helpers/usePermissions'
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import { useSharedStore } from '@/shared/pinia/shared.store';
 import { ReportDataType } from '@/shared/modules/report-issue/constants/report-data-type.enum';
-import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps<{
   organization: Organization,
diff --git a/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit-item.vue b/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit-item.vue
index 8c4740fcee..38e5111b03 100644
--- a/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit-item.vue
+++ b/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit-item.vue
@@ -17,7 +17,7 @@
             >
               <template #placeholder>
                 <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                  <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+                  <lf-icon name="house-building" :size="12" class="text-gray-400" />
                 </div>
               </template>
             </lf-avatar>
@@ -40,7 +40,7 @@
             >
               <template #placeholder>
                 <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                  <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+                  <lf-icon name="house-building" :size="12" class="text-gray-400" />
                 </div>
               </template>
             </lf-avatar>
@@ -108,7 +108,7 @@ import moment from 'moment';
 import useVuelidate from '@vuelidate/core';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 import useOrganizationHelpers from '@/modules/organization/helpers/organization.helpers';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
 import LfFieldMessages from '@/ui-kit/field-messages/FieldMessages.vue';
 import LfCheckbox from '@/ui-kit/checkbox/Checkbox.vue';
diff --git a/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit.vue b/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit.vue
index b812811967..a42f9402bc 100644
--- a/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit.vue
+++ b/frontend/src/modules/contributor/components/edit/affilations/contributor-affilations-edit.vue
@@ -6,7 +6,7 @@
           Activities affiliation
         </h5>
         <lf-button type="secondary-ghost-light" :icon-only="true" @click="isModalOpen = false">
-          <lf-icon-old name="close-line" />
+          <lf-icon name="xmark" />
         </lf-button>
       </div>
       <p class="text-gray-500 text-medium">
@@ -61,19 +61,19 @@
                             class="ml-2 my-1"
                             :icon-only="true"
                           >
-                            <lf-icon-old name="more-fill" />
+                            <lf-icon name="ellipsis" type="regular" />
                           </lf-button>
                         </template>
                         <lf-dropdown-item
                           @click="copyToOtherProjects(ai)"
                         >
-                          <lf-icon-old name="file-copy-line" /> Apply to all projects
+                          <lf-icon name="copy" type="regular" /> Apply to all projects
                         </lf-dropdown-item>
                         <lf-dropdown-item
                           type="danger"
                           @click="form.splice(ai, 1)"
                         >
-                          <lf-icon-old name="delete-bin-6-line" /> Delete affiliation
+                          <lf-icon name="trash-can" /> Delete affiliation
                         </lf-dropdown-item>
                       </lf-dropdown>
                     </lf-contributor-edit-affilations-item>
@@ -87,7 +87,7 @@
                   class="mt-1"
                   @click="addAffiliation(subproject.id)"
                 >
-                  <lf-icon-old name="add-line" />
+                  <lf-icon name="plus" />
                   Add affiliation
                 </lf-button>
               </div>
@@ -113,7 +113,7 @@ import { useContributorStore } from '@/modules/contributor/store/contributor.sto
 import { Contributor, ContributorAffiliation } from '@/modules/contributor/types/Contributor';
 import { computed, onMounted, ref } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfContributorEditAffilationsItem
 , { AffilationForm } from '@/modules/contributor/components/edit/affilations/contributor-affilations-edit-item.vue';
 import useVuelidate from '@vuelidate/core';
diff --git a/frontend/src/modules/contributor/components/edit/contributor-add.vue b/frontend/src/modules/contributor/components/edit/contributor-add.vue
index 352408c43d..97100c0cc3 100644
--- a/frontend/src/modules/contributor/components/edit/contributor-add.vue
+++ b/frontend/src/modules/contributor/components/edit/contributor-add.vue
@@ -4,7 +4,7 @@
     <section class="py-4 pr-4 pl-6 flex justify-between items-center">
       <h5>Add person</h5>
       <lf-button type="secondary-ghost-light" :icon-only="true" @click="isModalOpen = false">
-        <lf-icon-old name="close-line" />
+        <lf-icon name="xmark" />
       </lf-button>
     </section>
 
@@ -54,7 +54,7 @@
                       :icon-only="true"
                       @click="form.email.splice(ei, 1)"
                     >
-                      <lf-icon-old name="delete-bin-6-line" />
+                      <lf-icon name="trash-can" />
                     </lf-button>
                   </div>
                 </lf-contributor-add-email-item>
@@ -65,7 +65,7 @@
               />
             </lf-field>
             <lf-button type="primary-link" size="small" class="mt-3" @click="form.email.push('')">
-              <lf-icon-old name="add-line" />
+              <lf-icon name="plus" />
               Add another email
             </lf-button>
           </article>
@@ -122,7 +122,7 @@ import {
   computed, reactive, ref,
 } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import LfField from '@/ui-kit/field/Field.vue';
 import { Contributor, ContributorIdentity } from '@/modules/contributor/types/Contributor';
diff --git a/frontend/src/modules/contributor/components/edit/contributor-edit-profile-photo.vue b/frontend/src/modules/contributor/components/edit/contributor-edit-profile-photo.vue
index 8a77ea8bec..2aa095bde6 100644
--- a/frontend/src/modules/contributor/components/edit/contributor-edit-profile-photo.vue
+++ b/frontend/src/modules/contributor/components/edit/contributor-edit-profile-photo.vue
@@ -18,9 +18,10 @@
               @update:model-value="$v.profilePhoto.$touch()"
             >
               <template #suffix>
-                <lf-icon-old
+                <lf-icon
                   v-if="form.profilePhoto"
-                  name="close-circle-line"
+                  name="circle-xmark"
+                  type="regular"
                   :size="20"
                   class="text-gray-300 cursor-pointer"
                   @click="form.profilePhoto = ''"
@@ -68,7 +69,7 @@ import LfField from '@/ui-kit/field/Field.vue';
 import LfFieldMessage from '@/ui-kit/field-message/FieldMessage.vue';
 import LfFieldMessages from '@/ui-kit/field-messages/FieldMessages.vue';
 import Message from '@/shared/message/message';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { useContributorStore } from '@/modules/contributor/store/contributor.store';
 import useContributorHelpers from '@/modules/contributor/helpers/contributor.helpers';
 import { Contributor } from '@/modules/contributor/types/Contributor';
diff --git a/frontend/src/modules/contributor/components/edit/identity/contributor-identity-add.vue b/frontend/src/modules/contributor/components/edit/identity/contributor-identity-add.vue
index 810b9d8946..d1e5a5ade0 100644
--- a/frontend/src/modules/contributor/components/edit/identity/contributor-identity-add.vue
+++ b/frontend/src/modules/contributor/components/edit/identity/contributor-identity-add.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>Add identity</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -23,16 +23,16 @@
                   <template #prefix>
                     <div class="flex items-center flex-nowrap whitespace-nowrap">
                       <div class="min-w-5">
-                        <lf-icon-old v-if="identity.type === 'email'" name="mail-line" class="text-black" :size="20" />
+                        <lf-icon v-if="identity.type === 'email'" name="envelope" type="regular" class="text-black" :size="20" />
                         <img
                           v-else-if="lfIdentities[identity.platform]"
                           :src="lfIdentities[identity.platform]?.image"
                           class="h-5 w-5 object-contain"
                           :alt="identity.value"
                         />
-                        <lf-icon-old
+                        <lf-icon
                           v-else
-                          name="fingerprint-fill"
+                          name="fingerprint"
                           :size="20"
                           class="text-gray-600"
                         />
@@ -54,7 +54,7 @@
                   :icon-only="true"
                   @click="form.splice(ii, 1)"
                 >
-                  <lf-icon-old name="delete-bin-6-line" />
+                  <lf-icon name="trash-can" />
                 </lf-button>
               </div>
               <lf-field-messages
@@ -74,7 +74,7 @@
             })"
           >
             <lf-button type="primary-link" size="small">
-              <lf-icon-old name="add-line" />
+              <lf-icon name="plus" />
               Add identity
             </lf-button>
           </lf-contributor-details-identity-add-dropdown>
@@ -104,7 +104,7 @@ import {
 } from 'vue';
 import { Contributor, ContributorIdentity } from '@/modules/contributor/types/Contributor';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import { useContributorStore } from '@/modules/contributor/store/contributor.store';
 import Message from '@/shared/message/message';
diff --git a/frontend/src/modules/contributor/components/edit/identity/contributor-identity-edit.vue b/frontend/src/modules/contributor/components/edit/identity/contributor-identity-edit.vue
index 1b8c3315ef..62f1b2327d 100644
--- a/frontend/src/modules/contributor/components/edit/identity/contributor-identity-edit.vue
+++ b/frontend/src/modules/contributor/components/edit/identity/contributor-identity-edit.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>Edit identity</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -14,16 +14,16 @@
             <template #prefix>
               <div class="flex items-center flex-nowrap whitespace-nowrap">
                 <div class="min-w-5">
-                  <lf-icon-old v-if="form.type === 'email'" name="mail-line" class="text-black" :size="20" />
+                  <lf-icon v-if="form.type === 'email'" name="envelope" type="regular" class="text-black" :size="20" />
                   <img
                     v-else-if="platform"
                     :src="platform?.image"
                     class="h-5 w-5 object-contain"
                     :alt="form.value"
                   />
-                  <lf-icon-old
+                  <lf-icon
                     v-else
-                    name="fingerprint-fill"
+                    name="fingerprint"
                     :size="20"
                     class="text-gray-600"
                   />
@@ -64,7 +64,7 @@ import {
 } from 'vue';
 import { Contributor, ContributorIdentity } from '@/modules/contributor/types/Contributor';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import { useContributorStore } from '@/modules/contributor/store/contributor.store';
 import Message from '@/shared/message/message';
diff --git a/frontend/src/modules/contributor/components/edit/work-history/contributor-work-history-edit.vue b/frontend/src/modules/contributor/components/edit/work-history/contributor-work-history-edit.vue
index b68fa3d547..8570e1fae4 100644
--- a/frontend/src/modules/contributor/components/edit/work-history/contributor-work-history-edit.vue
+++ b/frontend/src/modules/contributor/components/edit/work-history/contributor-work-history-edit.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>{{ isEdit ? 'Edit' : 'Add' }} work experience</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -74,7 +74,7 @@
       </div>
       <div class="px-6 pb-10 flex">
         <div class="mt-0.5">
-          <lf-icon-old name="information-line" :size="16" class="text-gray-600" />
+          <lf-icon name="circle-info" :size="16" class="text-gray-600" />
         </div>
         <div class="flex-grow pl-2 text-xs text-gray-500">
           <span class="font-semibold">Activities affiliation</span> with a certain organization is automatically defined
@@ -111,7 +111,7 @@ import {
 } from 'vue';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import LfCheckbox from '@/ui-kit/checkbox/Checkbox.vue';
 import { useContributorStore } from '@/modules/contributor/store/contributor.store';
diff --git a/frontend/src/modules/contributor/components/shared/contributor-dropdown.vue b/frontend/src/modules/contributor/components/shared/contributor-dropdown.vue
index fbb86a3c8c..08d6672972 100644
--- a/frontend/src/modules/contributor/components/shared/contributor-dropdown.vue
+++ b/frontend/src/modules/contributor/components/shared/contributor-dropdown.vue
@@ -4,7 +4,7 @@
       && hasPermission(LfPermission.memberEdit)"
     @click="emit('unmerge')"
   >
-    <lf-icon-old name="link-unlink" />
+    <lf-icon name="link-simple-slash" />
     Unmerge profile
   </lf-dropdown-item>
   <lf-dropdown-item
@@ -12,28 +12,28 @@
     :disabled="!!props.contributor.username?.github"
     @click="emit('findGithub')"
   >
-    <lf-icon-old name="github-fill" />
+    <lf-icon name="github" type="brands" />
     Find GitHub
   </lf-dropdown-item>
   <lf-dropdown-item v-if="hasPermission(LfPermission.memberEdit)" @click="markTeamMember(!isTeamMember(props.contributor))">
-    <lf-icon-old name="team-line" />
+    <lf-icon name="people-group" />
     {{ isTeamMember(props.contributor) ? 'Unmark' : 'Mark' }} as team member
   </lf-dropdown-item>
   <lf-dropdown-item v-if="hasPermission(LfPermission.memberEdit)" @click="markBot(!isBot(props.contributor))">
-    <lf-icon-old name="robot-line" />
+    <lf-icon name="robot" />
     {{ isBot(props.contributor) ? 'Unmark' : 'Mark' }} as bot
   </lf-dropdown-item>
   <template v-if="hasPermission(LfPermission.memberDestroy)">
     <lf-dropdown-separator />
     <lf-dropdown-item type="danger" @click="deleteContributor()">
-      <lf-icon-old name="delete-bin-6-line" />
+      <lf-icon name="trash-can" />
       Delete profile
     </lf-dropdown-item>
   </template>
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
 import LfDropdownSeparator from '@/ui-kit/dropdown/DropdownSeparator.vue';
 import usePermissions from '@/shared/modules/permissions/helpers/usePermissions';
diff --git a/frontend/src/modules/contributor/components/shared/contributor-engagement-level.vue b/frontend/src/modules/contributor/components/shared/contributor-engagement-level.vue
index ac57186242..53d9679a08 100644
--- a/frontend/src/modules/contributor/components/shared/contributor-engagement-level.vue
+++ b/frontend/src/modules/contributor/components/shared/contributor-engagement-level.vue
@@ -2,7 +2,7 @@
   <div class="flex items-center gap-1.5 font-semibold text-small">
     <div v-if="!data" class="flex items-center text-secondary-400">
       <div class="animate-spin mr-1.5">
-        <lf-icon-old name="loader-4-fill" :size="16" class="text-secondary-400" />
+        <lf-icon name="circle-notch" type="solid" :size="16" class="text-secondary-400" />
       </div>
       Calculating
     </div>
@@ -19,7 +19,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 
 const props = defineProps<{
diff --git a/frontend/src/modules/contributor/components/shared/contributor-sentiment.vue b/frontend/src/modules/contributor/components/shared/contributor-sentiment.vue
index 9affe49d49..4ce7ef7348 100644
--- a/frontend/src/modules/contributor/components/shared/contributor-sentiment.vue
+++ b/frontend/src/modules/contributor/components/shared/contributor-sentiment.vue
@@ -1,7 +1,7 @@
 <template>
   <lf-tooltip v-if="data" :content="`Score: ${props.contributor.averageSentiment}`">
     <div class="flex items-center gap-1.5" :class="data.class">
-      <lf-icon-old
+      <lf-icon
         :size="16"
         :name="data.icon"
       />
@@ -14,7 +14,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 
@@ -32,20 +32,20 @@ const data = computed<{
   }
   if (props.contributor.averageSentiment >= 67) {
     return {
-      icon: 'emotion-happy-line',
+      icon: 'face-smile',
       label: 'Positive',
       class: 'text-green-600',
     };
   }
   if (props.contributor.averageSentiment <= 33) {
     return {
-      icon: 'emotion-unhappy-line',
+      icon: 'face-frown',
       label: 'Negative',
       class: 'text-red-500',
     };
   }
   return {
-    icon: 'emotion-normal-line',
+    icon: 'face-meh',
     label: 'Neutral',
     class: 'text-gray-400',
   };
diff --git a/frontend/src/modules/contributor/components/shared/contributor-syncing-activities.vue b/frontend/src/modules/contributor/components/shared/contributor-syncing-activities.vue
index 0b9ce33486..5aeef235c5 100644
--- a/frontend/src/modules/contributor/components/shared/contributor-syncing-activities.vue
+++ b/frontend/src/modules/contributor/components/shared/contributor-syncing-activities.vue
@@ -6,7 +6,7 @@
       ${ props.contributor.activitySycning?.operationType === 'merge' ? 'merged' : 'unmerged' }. This process may take some minutes.`"
     >
       <div class="flex items-center gap-1.5 cursor-default">
-        <lf-icon-old name="loader-4-fill" :size="16" class="text-secondary-400 animate-spin" />
+        <lf-icon name="circle-notch" type="solid" :size="16" class="text-secondary-400 animate-spin" />
         <p class="text-small text-secondary-400 font-semibold">
           Syncing activities...
         </p>
@@ -20,7 +20,7 @@ import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 import { computed } from 'vue';
 import { MergeActionState } from '@/shared/modules/merge/types/MemberActions';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps<{
   contributor: Contributor,
diff --git a/frontend/src/modules/contributor/components/shared/contributor-work-position.vue b/frontend/src/modules/contributor/components/shared/contributor-work-position.vue
index bb45c9ce1f..94d69aed82 100644
--- a/frontend/src/modules/contributor/components/shared/contributor-work-position.vue
+++ b/frontend/src/modules/contributor/components/shared/contributor-work-position.vue
@@ -12,7 +12,7 @@
     >
       <template #placeholder>
         <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-          <lf-icon-old name="community-line" :size="14" class="text-gray-400" />
+          <lf-icon name="house-building" :size="14" class="text-gray-400" />
         </div>
       </template>
     </lf-avatar>
@@ -39,7 +39,7 @@ import { computed } from 'vue';
 import { useLfSegmentsStore } from '@/modules/lf/segments/store';
 import { storeToRefs } from 'pinia';
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Contributor } from '@/modules/contributor/types/Contributor';
 
 const props = defineProps<{
diff --git a/frontend/src/modules/contributor/pages/contributor-details.page.vue b/frontend/src/modules/contributor/pages/contributor-details.page.vue
index 47f9338c46..5f0d30cf56 100644
--- a/frontend/src/modules/contributor/pages/contributor-details.page.vue
+++ b/frontend/src/modules/contributor/pages/contributor-details.page.vue
@@ -13,7 +13,7 @@
         <div class="flex items-center">
           <lf-back :to="{ path: '/people' }" class="mr-2" @mouseover.stop @mouseout.stop>
             <lf-button type="secondary-ghost" :icon-only="true">
-              <lf-icon-old name="arrow-left-s-line" />
+              <lf-icon name="chevron-left" />
             </lf-button>
           </lf-back>
           <lf-contributor-details-header :contributor="contributor" />
@@ -51,9 +51,9 @@
               <lf-tab v-model="tabs" name="activities">
                 <div class="flex items-center gap-1">
                   Activities
-                  <lf-icon-old
+                  <lf-icon
                     v-if="contributor.activitySycning?.state === MergeActionState.ERROR"
-                    name="error-warning-line"
+                    name="circle-exclamation"
                     :size="16"
                     class="text-red-500"
                   />
@@ -85,7 +85,7 @@ import LfTab from '@/ui-kit/tabs/Tab.vue';
 import { onMounted, ref } from 'vue';
 import LfBack from '@/ui-kit/back/Back.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { useRoute } from 'vue-router';
 import LfSpinner from '@/ui-kit/spinner/Spinner.vue';
 import { useMemberStore } from '@/modules/member/store/pinia';
diff --git a/frontend/src/modules/data-quality/components/member/data-quality-member-issues.vue b/frontend/src/modules/data-quality/components/member/data-quality-member-issues.vue
index 4694414c6d..1b9d15deb7 100644
--- a/frontend/src/modules/data-quality/components/member/data-quality-member-issues.vue
+++ b/frontend/src/modules/data-quality/components/member/data-quality-member-issues.vue
@@ -21,7 +21,7 @@
             @click="trackReviewProfile(member.id)"
           >
             <lf-button type="secondary" size="small">
-              <lf-icon-old name="external-link-line" />Review profile
+              <lf-icon name="arrow-up-right-from-square" />Review profile
             </lf-button>
           </router-link>
         </template>
@@ -59,7 +59,7 @@ import { DataIssueType } from '@/modules/data-quality/types/DataIssueType';
 import { DataQualityApiService } from '@/modules/data-quality/services/data-quality.api.service';
 import LfDataQualityMemberIssuesItem
   from '@/modules/data-quality/components/member/data-quality-member-issues-item.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { storeToRefs } from 'pinia';
 import { useLfSegmentsStore } from '@/modules/lf/segments/store';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
diff --git a/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions-item.vue b/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions-item.vue
index 170055e931..854be5332f 100644
--- a/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions-item.vue
+++ b/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions-item.vue
@@ -3,7 +3,7 @@
     <div class="flex items-center gap-4">
       <template v-for="(member, mi) of props.suggestion.members" :key="member.id">
         <div v-if="mi > 0">
-          <lf-icon-old name="arrow-left-line" :size="16" class="text-gray-400" />
+          <lf-icon name="arrow-left" :size="16" class="text-gray-400" />
         </div>
         <div class="flex items-center gap-3">
           <lf-avatar
@@ -34,7 +34,7 @@
 
 <script lang="ts" setup>
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfBadge from '@/ui-kit/badge/Badge.vue';
 import AppMemberMergeSimilarity from '@/modules/member/components/suggestions/member-merge-similarity.vue';
 
diff --git a/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions.vue b/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions.vue
index 2ddc158622..e478abb62b 100644
--- a/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions.vue
+++ b/frontend/src/modules/data-quality/components/member/data-quality-member-merge-suggestions.vue
@@ -12,7 +12,7 @@
         <template #action>
           <div class="flex gap-3">
             <lf-button type="secondary" size="small" @click="isModalOpen = true; detailsOffset = si">
-              <lf-icon-old name="eye-line" />View suggestion
+              <lf-icon name="eye" />View suggestion
             </lf-button>
             <lf-member-merge-suggestion-dropdown :suggestion="suggestion" @reload="reload()" />
           </div>
@@ -62,7 +62,7 @@ import LfDataQualityMemberMergeSuggestionsItem
   from '@/modules/data-quality/components/member/data-quality-member-merge-suggestions-item.vue';
 import LfSpinner from '@/ui-kit/spinner/Spinner.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import AppMemberMergeSuggestionsDialog from '@/modules/member/components/member-merge-suggestions-dialog.vue';
 import { storeToRefs } from 'pinia';
 import { useLfSegmentsStore } from '@/modules/lf/segments/store';
diff --git a/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions-item.vue b/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions-item.vue
index a08508f0ad..968954e6a6 100644
--- a/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions-item.vue
+++ b/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions-item.vue
@@ -3,7 +3,7 @@
     <div class="flex items-center gap-4">
       <template v-for="(organization, mi) of props.suggestion.organizations" :key="organization.id">
         <div v-if="mi > 0">
-          <lf-icon-old name="arrow-left-line" :size="16" class="text-gray-400" />
+          <lf-icon name="arrow-left" :size="16" class="text-gray-400" />
         </div>
         <div class="flex items-center gap-3">
           <lf-avatar
@@ -14,7 +14,7 @@
           >
             <template #placeholder>
               <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                <lf-icon-old name="community-line" :size="16" class="text-gray-400" />
+                <lf-icon name="house-building" :size="16" class="text-gray-400" />
               </div>
             </template>
           </lf-avatar>
@@ -36,7 +36,7 @@
 
 <script lang="ts" setup>
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfBadge from '@/ui-kit/badge/Badge.vue';
 import AppMemberMergeSimilarity from '@/modules/member/components/suggestions/member-merge-similarity.vue';
 
diff --git a/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions.vue b/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions.vue
index a7522f3103..65e6f2844a 100644
--- a/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions.vue
+++ b/frontend/src/modules/data-quality/components/organization/data-quality-organization-merge-suggestions.vue
@@ -11,7 +11,7 @@
       >
         <template #action>
           <lf-button type="secondary" size="small" @click="isModalOpen = true; detailsOffset = si">
-            <lf-icon-old name="eye-line" />View merge suggestion
+            <lf-icon name="eye" />View merge suggestion
           </lf-button>
         </template>
       </lf-data-quality-organization-merge-suggestions-item>
@@ -54,7 +54,7 @@
 import { computed, onMounted, ref } from 'vue';
 import LfSpinner from '@/ui-kit/spinner/Spinner.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { OrganizationService } from '@/modules/organization/organization-service';
 import LfDataQualityOrganizationMergeSuggestionsItem
   from '@/modules/data-quality/components/organization/data-quality-organization-merge-suggestions-item.vue';
diff --git a/frontend/src/modules/data-quality/components/shared/data-quality-project-dropdown.vue b/frontend/src/modules/data-quality/components/shared/data-quality-project-dropdown.vue
index 56632983cd..3f3ade7d13 100644
--- a/frontend/src/modules/data-quality/components/shared/data-quality-project-dropdown.vue
+++ b/frontend/src/modules/data-quality/components/shared/data-quality-project-dropdown.vue
@@ -2,7 +2,7 @@
   <lf-dropdown>
     <template #trigger>
       <lf-button type="secondary">
-        <lf-icon-old name="stack-line" />
+        <lf-icon name="layer-group" />
         <div class="truncate" style="max-width: 28ch;">
           {{ getProjectName }}
         </div>
@@ -15,7 +15,7 @@
         class=" !border-0 !rounded-none shadow-none"
       >
         <template #prefix>
-          <lf-icon-old name="search-line" />
+          <lf-icon name="magnifying-glass" />
         </template>
       </lf-input>
     </div>
@@ -36,7 +36,7 @@
 <script lang="ts" setup>
 import LfButton from '@/ui-kit/button/Button.vue';
 import { computed, ref } from 'vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
 import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
 import { storeToRefs } from 'pinia';
diff --git a/frontend/src/modules/lf/layout/components/lf-menu-project-group-selection.vue b/frontend/src/modules/lf/layout/components/lf-menu-project-group-selection.vue
index b18b253c60..f7185b489a 100644
--- a/frontend/src/modules/lf/layout/components/lf-menu-project-group-selection.vue
+++ b/frontend/src/modules/lf/layout/components/lf-menu-project-group-selection.vue
@@ -33,7 +33,7 @@
 
     <div>
       <div v-if="loading" class="text-gray-400 px-3 h-20 flex items-center justify-center">
-        <lf-icon-old name="loader-4-line" class="animate-spin text-gray-400" :size="16" />
+        <lf-icon name="circle-notch" class="animate-spin text-gray-400" :size="16" />
         <span class="text-tiny ml-1 text-gray-400">
           Loading project groups...
         </span>
@@ -80,7 +80,7 @@ import pluralize from 'pluralize';
 import debounce from 'lodash/debounce';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const SearchIcon = h(
   'i', // type
diff --git a/frontend/src/modules/member/components/list/member-list-table.vue b/frontend/src/modules/member/components/list/member-list-table.vue
index 7b380b7738..ae4bd1a33c 100644
--- a/frontend/src/modules/member/components/list/member-list-table.vue
+++ b/frontend/src/modules/member/components/list/member-list-table.vue
@@ -278,7 +278,7 @@
                         Contributions require that code was successfully merged into a repository.
                       </p>
                       <div class="flex gap-1">
-                        <lf-icon-old name="information-line" :size="16" class="text-gray-400" />
+                        <lf-icon name="circle-info" :size="16" class="text-gray-400" />
                         <p class="text-tiny text-gray-400">
                           Roles are automatically assigned based on data from connected integrations and individual activities on behalf of a project.
                         </p>
@@ -794,7 +794,7 @@ import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/ev
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import LfContributorDetailsProjectsMaintainer
   from '@/modules/contributor/components/details/overview/project/contributor-details-projects-maintainer.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import AppMemberBadge from '../member-badge.vue';
 import AppMemberDropdownContent from '../member-dropdown-content.vue';
 import AppMemberReach from '../member-reach.vue';
diff --git a/frontend/src/modules/member/components/member-dropdown-content.vue b/frontend/src/modules/member/components/member-dropdown-content.vue
index 3b99c6b514..660f7c75e7 100644
--- a/frontend/src/modules/member/components/member-dropdown-content.vue
+++ b/frontend/src/modules/member/components/member-dropdown-content.vue
@@ -8,7 +8,8 @@
         member,
       })"
     >
-      <i class="ri-link-unlink-m text-base mr-2" /><span class="text-xs">Unmerge identity</span>
+      <lf-icon name="link-simple-slash" class="mr-2" />
+      <span class="text-xs">Unmerge identity</span>
     </button>
     <el-divider class="border-gray-200" />
   </template>
@@ -26,7 +27,7 @@
       class="h-10 el-dropdown-menu__item w-full mb-1"
       type="button"
     >
-      <i class="ri-pencil-line text-base mr-2" />
+      <lf-icon name="pen fa-sharp" class="mr-2" />
       <span class="text-xs">Edit profile</span>
     </button>
   </router-link>
@@ -42,7 +43,8 @@
     <span
       class="max-w-[16px]"
       color="#9CA3AF"
-    ><i class="ri-github-fill" /></span>
+    >
+      <lf-icon name="github" type="brands" /></span>
     <span class="ml-2 text-xs"> Find GitHub </span>
   </button>
 
@@ -58,7 +60,8 @@
       })
     "
   >
-    <i class="ri-group-line text-base mr-2" /><span class="text-xs">Merge profile</span>
+    <lf-icon name="user-group" class="mr-2" />
+    <span class="text-xs">Merge profile</span>
   </button>
 
   <template v-if="hasPermission(LfPermission.memberEdit)">
@@ -80,7 +83,8 @@
             })
           "
         >
-          <i class="ri-bookmark-line text-base mr-2" /><span class="text-xs">Mark as team member</span>
+          <lf-icon name="bookmark" class="mr-2" />
+          <span class="text-xs">Mark as team member</span>
         </button>
       </span>
     </el-tooltip>
@@ -96,7 +100,8 @@
         })
       "
     >
-      <i class="ri-bookmark-2-line text-base mr-2" /><span class="text-xs">Unmark as team member</span>
+      <lf-icon name="bookmark-slash" class="mr-2" />
+      <span class="text-xs">Unmark as team member</span>
     </button>
     <button
       v-if="!member.attributes.isBot?.default"
@@ -109,7 +114,8 @@
         })
       "
     >
-      <i class="ri-robot-line text-base mr-2" /><span class="text-xs">Mark as bot</span>
+      <lf-icon name="robot" class="mr-2" />
+      <span class="text-xs">Mark as bot</span>
     </button>
     <button
       v-if="member.attributes.isBot?.default"
@@ -122,7 +128,8 @@
         })
       "
     >
-      <i class="ri-robot-line text-base mr-2" /><span class="text-xs">Unmark as bot</span>
+      <lf-icon name="robot" class="mr-2" />
+      <span class="text-xs">Unmark as bot</span>
     </button>
   </template>
   <template v-if="hasPermission(LfPermission.memberDestroy)">
@@ -137,11 +144,8 @@
         })
       "
     >
-      <i
-        class="ri-delete-bin-line text-base mr-2 text-red-500"
-      /><span
-        class="text-xs text-red-500"
-      >Delete profile</span>
+      <lf-icon name="trash-can" class="mr-2 text-red-500" />
+      <span class="text-xs text-red-500">Delete profile</span>
     </button>
   </template>
 </template>
@@ -160,6 +164,7 @@ import usePermissions from '@/shared/modules/permissions/helpers/usePermissions'
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Member } from '../types/Member';
 
 enum Actions {
diff --git a/frontend/src/modules/member/components/member-unmerge-dialog.vue b/frontend/src/modules/member/components/member-unmerge-dialog.vue
index e88a745cca..1283d1103d 100644
--- a/frontend/src/modules/member/components/member-unmerge-dialog.vue
+++ b/frontend/src/modules/member/components/member-unmerge-dialog.vue
@@ -163,9 +163,9 @@
                                 :alt="lfIdentities[i.platform]?.name"
                                 :src="lfIdentities[i.platform]?.image"
                               />
-                              <lf-icon-old
+                              <lf-icon
                                 v-else
-                                name="fingerprint-fill"
+                                name="fingerprint"
                                 :size="20"
                                 class="text-gray-600 mr-2"
                               />
@@ -237,9 +237,9 @@
                       :alt="lfIdentities[i.platform]?.name"
                       :src="lfIdentities[i.platform]?.image"
                     />
-                    <lf-icon-old
+                    <lf-icon
                       v-else
-                      name="fingerprint-fill"
+                      name="fingerprint"
                       :size="20"
                       class="text-gray-600 mr-2"
                     />
@@ -265,7 +265,7 @@ import LfSpinner from '@/ui-kit/spinner/Spinner.vue';
 import AppMemberOrganizationList from '@/modules/member/components/suggestions/member-organizations-list.vue';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { useContributorStore } from '@/modules/contributor/store/contributor.store';
 import { useRouter } from 'vue-router';
 import { lfIdentities } from '@/config/identities';
diff --git a/frontend/src/modules/member/components/suggestions/member-merge-suggestion-dropdown.vue b/frontend/src/modules/member/components/suggestions/member-merge-suggestion-dropdown.vue
index 62dcb1894b..d42d83c3a7 100644
--- a/frontend/src/modules/member/components/suggestions/member-merge-suggestion-dropdown.vue
+++ b/frontend/src/modules/member/components/suggestions/member-merge-suggestion-dropdown.vue
@@ -6,7 +6,7 @@
         type="secondary-ghost"
         :icon-only="true"
       >
-        <lf-icon-old name="more-fill" />
+        <lf-icon name="ellipsis" />
       </lf-button>
     </template>
 
@@ -29,7 +29,7 @@ import useMemberMergeMessage from '@/shared/modules/merge/config/useMemberMergeM
 import { MemberService } from '@/modules/member/member-service';
 import Message from '@/shared/message/message';
 import { ref } from 'vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 
 const props = defineProps<{
diff --git a/frontend/src/modules/organization/components/details/domains/organization-details-domain-item.vue b/frontend/src/modules/organization/components/details/domains/organization-details-domain-item.vue
index 1326e5f91c..f702ace9be 100644
--- a/frontend/src/modules/organization/components/details/domains/organization-details-domain-item.vue
+++ b/frontend/src/modules/organization/components/details/domains/organization-details-domain-item.vue
@@ -5,7 +5,7 @@
   >
     <div class="flex items-center justify-between min-h-7">
       <div class="flex items-center">
-        <lf-icon-old name="link" :size="20" class="text-gray-500 mr-2" />
+        <lf-icon name="link" :size="20" class="text-gray-500 mr-2" />
         <lf-tooltip
           :content="props.domain.value"
           :disabled="props.domain.value.length < 25"
@@ -22,7 +22,7 @@
           </a>
         </lf-tooltip>
         <lf-tooltip v-if="props.domain.verified" content="Verified domain" class="ml-1.5">
-          <lf-icon-old name="verified-badge-line" :size="16" class="text-primary-500" />
+          <lf-icon name="badge-check" :size="16" class="text-primary-500" />
         </lf-tooltip>
       </div>
       <lf-dropdown
@@ -33,7 +33,7 @@
       >
         <template #trigger>
           <lf-button type="secondary-ghost" size="small" :icon-only="true">
-            <lf-icon-old name="more-fill" />
+            <lf-icon name="ellipsis" type="regular" />
           </lf-button>
         </template>
 
@@ -42,7 +42,7 @@
           class="w-full"
           @click="emit('edit')"
         >
-          <lf-icon-old name="pencil-line" />Edit domain
+          <lf-icon name="pen fa-sharp" />Edit domain
         </lf-dropdown-item>
 
         <!-- Unmerge -->
@@ -50,7 +50,7 @@
           v-if="hasPermission(LfPermission.memberEdit)"
           @click="emit('unmerge')"
         >
-          <lf-icon-old name="link-unlink" />Unmerge domain
+          <lf-icon name="link-simple-slash" />Unmerge domain
         </lf-dropdown-item>
 
         <lf-dropdown-item
@@ -60,7 +60,7 @@
             attribute: props.domain,
           })"
         >
-          <lf-icon name="feedback-line" class="!text-red-500" />Report issue
+          <lf-icon name="message-exclamation" class="!text-red-500" />Report issue
         </lf-dropdown-item>
 
         <lf-dropdown-separator
@@ -72,7 +72,7 @@
           class="w-full"
           @click="removeDomain()"
         >
-          <lf-icon-old name="delete-bin-6-line" />Delete domain
+          <lf-icon name="trash-can" />Delete domain
         </lf-dropdown-item>
       </lf-dropdown>
     </div>
@@ -91,7 +91,7 @@ import {
   OrganizationIdentity,
   OrganizationIdentityType,
 } from '@/modules/organization/types/Organization';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { withHttp } from '@/utils/string';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
diff --git a/frontend/src/modules/organization/components/details/email/organization-details-email-item.vue b/frontend/src/modules/organization/components/details/email/organization-details-email-item.vue
index 68402c66fc..ffd0eb7509 100644
--- a/frontend/src/modules/organization/components/details/email/organization-details-email-item.vue
+++ b/frontend/src/modules/organization/components/details/email/organization-details-email-item.vue
@@ -5,7 +5,7 @@
     @mouseleave="hovered = false"
   >
     <div class="flex items-start">
-      <lf-icon-old name="mail-line" :size="20" class="text-gray-500" />
+      <lf-icon name="envelope" :size="20" class="text-gray-500" />
       <div class="pl-2">
         <div class="flex items-center">
           <lf-tooltip
@@ -24,8 +24,8 @@
             </a>
           </lf-tooltip>
           <lf-tooltip v-if="props.email.verified" content="Verified email">
-            <lf-icon-old
-              name="verified-badge-line"
+            <lf-icon
+              name="badge-check"
               :size="16"
               class="ml-1 text-primary-500"
             />
@@ -42,7 +42,7 @@
     <lf-dropdown v-show="hovered" placement="bottom-end" width="232px">
       <template #trigger>
         <lf-button type="secondary-ghost" size="small" :icon-only="true">
-          <lf-icon-old name="more-fill" />
+          <lf-icon name="ellipsis" type="regular" />
         </lf-button>
       </template>
       <!-- Edit identity -->
@@ -51,14 +51,14 @@
         class="w-full"
         @click="emit('edit')"
       >
-        <lf-icon-old name="pencil-line" />Edit email
+        <lf-icon name="pen fa-sharp" />Edit email
       </lf-dropdown-item>
       <!-- Unmerge -->
       <lf-dropdown-item
         v-if="hasPermission(LfPermission.organizationEdit)"
         @click="emit('unmerge')"
       >
-        <lf-icon-old name="link-unlink" />Unmerge email
+        <lf-icon name="link-simple-slash" />Unmerge email
       </lf-dropdown-item>
 
       <lf-dropdown-item
@@ -68,7 +68,7 @@
           attribute: props.organization,
         })"
       >
-        <lf-icon name="feedback-line" class="!text-red-500" />Report issue
+        <lf-icon name="message-exclamation" class="!text-red-500" />Report issue
       </lf-dropdown-item>
 
       <lf-dropdown-separator
@@ -80,14 +80,14 @@
         class="w-full"
         @click="removeEmail"
       >
-        <lf-icon-old name="delete-bin-6-line" />Delete email
+        <lf-icon name="trash-can" />Delete email
       </lf-dropdown-item>
     </lf-dropdown>
   </article>
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
diff --git a/frontend/src/modules/organization/components/details/header/organization-details-header-logo.vue b/frontend/src/modules/organization/components/details/header/organization-details-header-logo.vue
index 956916f844..e5605de3c8 100644
--- a/frontend/src/modules/organization/components/details/header/organization-details-header-logo.vue
+++ b/frontend/src/modules/organization/components/details/header/organization-details-header-logo.vue
@@ -10,13 +10,13 @@
     >
       <template #placeholder>
         <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-          <lf-icon-old name="community-line" :size="32" class="text-gray-300" />
+          <lf-icon name="house-building" :size="32" class="text-gray-300" />
         </div>
       </template>
       <template #overlay>
         <div class="absolute top-0 left-0 w-full h-full bg-secondary-500 opacity-50" />
         <div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2">
-          <lf-icon-old name="pencil-line" :size="24" class="text-white" />
+          <lf-icon name="pen fa-sharp" :size="24" class="text-white" />
         </div>
       </template>
     </lf-avatar>
@@ -37,7 +37,7 @@
 
 <script setup lang="ts">
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { ref } from 'vue';
 import { Organization } from '@/modules/organization/types/Organization';
 import useOrganizationHelpers from '@/modules/organization/helpers/organization.helpers';
diff --git a/frontend/src/modules/organization/components/details/header/organization-details-header-profiles.vue b/frontend/src/modules/organization/components/details/header/organization-details-header-profiles.vue
index 53776bbc2a..96275794dc 100644
--- a/frontend/src/modules/organization/components/details/header/organization-details-header-profiles.vue
+++ b/frontend/src/modules/organization/components/details/header/organization-details-header-profiles.vue
@@ -17,7 +17,7 @@
             <p class="!text-white">
               {{ lfIdentities[platform]?.name }} profile
             </p>
-            <lf-icon-old name="external-link-line" :size="14" class="text-gray-400" />
+            <lf-icon name="arrow-up-right-from-square" :size="14" class="text-gray-400" />
           </a>
         </template>
         <a
@@ -29,8 +29,10 @@
           class="flex items-center gap-1"
           @click="idents.length > 1 ? $event.preventDefault() : null"
         >
-          <lf-icon-old
+          <lf-icon
+            v-if="lfIdentities[platform]?.icon"
             :name="lfIdentities[platform]?.icon"
+            :type="lfIdentities[platform]?.iconType"
             :size="20"
             :style="{ color: lfIdentities[platform]?.color }"
             class="platform-icon"
@@ -64,7 +66,7 @@
               {{ identity.value }}
             </p>
           </div>
-          <lf-icon-old v-if="identity.url" name="external-link-line" :size="16" class="text-gray-300" />
+          <lf-icon v-if="identity.url" name="arrow-up-right-from-square" :size="16" class="text-gray-300" />
         </a>
       </div>
     </div>
@@ -73,7 +75,7 @@
 
 <script setup lang="ts">
 import { computed } from 'vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import useOrganizationHelpers from '@/modules/organization/helpers/organization.helpers';
 import {
diff --git a/frontend/src/modules/organization/components/details/identity/organization-details-identity-item.vue b/frontend/src/modules/organization/components/details/identity/organization-details-identity-item.vue
index 9f518eedc9..dfdd43367c 100644
--- a/frontend/src/modules/organization/components/details/identity/organization-details-identity-item.vue
+++ b/frontend/src/modules/organization/components/details/identity/organization-details-identity-item.vue
@@ -17,8 +17,8 @@
         />
       </lf-tooltip>
       <lf-tooltip v-else content="Custom identity" placement="top-start">
-        <lf-icon-old
-          name="fingerprint-fill"
+        <lf-icon
+          name="fingerprint"
           :size="20"
           class="text-gray-600"
         />
@@ -50,7 +50,7 @@
     <lf-dropdown v-show="hovered" placement="bottom-end" width="232px">
       <template #trigger>
         <lf-button type="secondary-ghost" size="small" :icon-only="true">
-          <lf-icon-old name="more-fill" />
+          <lf-icon name="ellipsis" type="regular" />
         </lf-button>
       </template>
       <!-- Edit identity -->
@@ -59,7 +59,7 @@
         class="w-full"
         @click="emit('edit')"
       >
-        <lf-icon-old name="pencil-line" />Edit identity
+        <lf-icon name="pen fa-sharp" />Edit identity
       </lf-dropdown-item>
 
       <!-- Unmerge -->
@@ -67,7 +67,7 @@
         v-if="hasPermission(LfPermission.organizationEdit)"
         @click="emit('unmerge')"
       >
-        <lf-icon-old name="link-unlink" />Unmerge identity
+        <lf-icon name="link-simple-slash" />Unmerge identity
       </lf-dropdown-item>
 
       <lf-dropdown-item
@@ -77,7 +77,7 @@
           attribute: props.identity,
         })"
       >
-        <lf-icon name="feedback-line" class="!text-red-500" />Report issue
+        <lf-icon name="message-exclamation" class="!text-red-500" />Report issue
       </lf-dropdown-item>
 
       <lf-dropdown-separator
@@ -89,14 +89,14 @@
         class="w-full"
         @click="removeIdentity"
       >
-        <lf-icon-old name="delete-bin-6-line" />Delete identity
+        <lf-icon name="trash-can" />Delete identity
       </lf-dropdown-item>
     </lf-dropdown>
   </article>
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
diff --git a/frontend/src/modules/organization/components/details/organization-details-actions.vue b/frontend/src/modules/organization/components/details/organization-details-actions.vue
index 7703858711..c9ccd46a43 100644
--- a/frontend/src/modules/organization/components/details/organization-details-actions.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-actions.vue
@@ -7,7 +7,7 @@
           organization: props.organization,
         })"
       >
-        <lf-icon-old name="feedback-line" class="text-red-500" /> Report data issue
+        <lf-icon name="message-exclamation" class="text-red-500" /> Report data issue
       </lf-button>
       <template v-if="hasSegments">
         <!-- Merge suggestions -->
@@ -24,7 +24,7 @@
 
         <!-- Merge -->
         <lf-button v-else-if="hasPermission(LfPermission.mergeOrganizations)" type="secondary" @click="isMergeDialogOpen = props.organization">
-          <lf-icon-old name="exchange-2-line" />
+          <lf-icon name="merge" />
           Merge organization
         </lf-button>
       </template>
@@ -41,7 +41,7 @@
             :icon-only="true"
             :class="hasSegments && hasPermission(LfPermission.mergeOrganizations) ? '!rounded-l-none -ml-px' : ''"
           >
-            <lf-icon-old name="more-fill" />
+            <lf-icon name="ellipsis" type="regular" />
           </lf-button>
         </template>
 
@@ -68,7 +68,7 @@
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
 import LfButtonGroup from '@/ui-kit/button/ButtonGroup.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
diff --git a/frontend/src/modules/organization/components/details/organization-details-activities.vue b/frontend/src/modules/organization/components/details/organization-details-activities.vue
index c1eaa8d045..16071b43ef 100644
--- a/frontend/src/modules/organization/components/details/organization-details-activities.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-activities.vue
@@ -1,6 +1,6 @@
 <template>
   <div v-if="props.organization.activitySycning?.state === MergeActionState.IN_PROGRESS" class="pt-12 flex flex-col items-center">
-    <lf-icon-old name="loader-4-line" :size="40" class="text-gray-300 animate-spin" />
+    <lf-icon name="circle-notch" :size="40" class="text-gray-300 animate-spin" />
     <h6 class="text-center py-3">
       Syncing activities...
     </h6>
@@ -11,7 +11,7 @@
     </p>
   </div>
   <div v-else-if="props.organization.activitySycning?.state === MergeActionState.ERROR" class="pt-12 flex flex-col items-center">
-    <lf-icon-old name="error-warning-line" :size="40" class="text-gray-300" />
+    <lf-icon name="circle-exclamation" :size="40" class="text-gray-300" />
     <h6 class="text-center py-3">
       Error syncing activities
     </h6>
@@ -35,7 +35,7 @@
 <script setup lang="ts">
 import { Organization } from '@/modules/organization/types/Organization';
 import AppActivityTimeline from '@/modules/activity/components/activity-timeline.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { MergeActionState } from '@/shared/modules/merge/types/MemberActions';
 import { ref } from 'vue';
 
diff --git a/frontend/src/modules/organization/components/details/organization-details-contributors.vue b/frontend/src/modules/organization/components/details/organization-details-contributors.vue
index 10944a52be..6b966cdf2d 100644
--- a/frontend/src/modules/organization/components/details/organization-details-contributors.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-contributors.vue
@@ -23,7 +23,7 @@
             <span class="font-semibold"> Sort: </span>
             {{ sorters[sort] }}
           </p>
-          <lf-icon-old name="arrow-down-s-line" :size="16" />
+          <lf-icon name="chevron-down" :size="16" />
         </div>
       </template>
 
@@ -35,7 +35,7 @@
         @click="onSortChange(key)"
       >
         <span>{{ label }}</span>
-        <lf-icon-old v-if="sort === key" name="check-line" :size="16" class="text-primary-500" />
+        <lf-icon v-if="sort === key" name="check" :size="16" class="text-primary-500" />
       </lf-dropdown-item>
     </lf-dropdown>
   </div>
@@ -85,7 +85,7 @@
             <template #badge>
               <div>
                 <div class="h-6 flex items-center px-2 border border-gray-200 rounded-md gap-1.5 whitespace-nowrap">
-                  <lf-icon-old name="fingerprint-line" :size="16" />
+                  <lf-icon name="fingerprint" :size="16" />
                   <p class="text-small text-gray-600 whitespace-nowrap">
                     {{ pluralize('identity', identities(contributor).length, true) }}
                   </p>
@@ -98,7 +98,7 @@
     </div>
     <div v-if="!loading && !contributors.length">
       <div class="flex justify-center pb-8">
-        <lf-icon-old name="group-2-line" :size="80" class="text-gray-200" />
+        <lf-icon name="people-group" :size="80" class="text-gray-200" />
       </div>
       <h5 class="text-center text-h5">
         No people found
@@ -135,7 +135,7 @@ import { Filter } from '@/shared/modules/filters/types/FilterConfig';
 import { Pagination } from '@/shared/types/Pagination';
 import { Member } from '@/modules/member/types/Member';
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfDropdown from '@/ui-kit/dropdown/Dropdown.vue';
 import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
 import { useLfSegmentsStore } from '@/modules/lf/segments/store';
diff --git a/frontend/src/modules/organization/components/details/organization-details-domains.vue b/frontend/src/modules/organization/components/details/organization-details-domains.vue
index 9706ebd620..2d3517e78f 100644
--- a/frontend/src/modules/organization/components/details/organization-details-domains.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-domains.vue
@@ -12,7 +12,7 @@
             size="small"
             :icon-only="true"
           >
-            <lf-icon-old name="add-fill" />
+            <lf-icon name="plus" type="regular" />
           </lf-button>
         </lf-tooltip>
       </lf-organization-details-domains-add-dropdown>
@@ -35,7 +35,7 @@
     </div>
 
     <div v-if="!domains(props.organization).length" class="pt-2 flex flex-col items-center w-full">
-      <lf-icon-old name="link" :size="40" class="text-gray-300" />
+      <lf-icon name="link" :size="40" class="text-gray-300" />
       <p class="text-center pt-3 text-medium text-gray-400">
         No domains
       </p>
@@ -57,7 +57,7 @@
 
 <script setup lang="ts">
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { ref } from 'vue';
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import usePermissions from '@/shared/modules/permissions/helpers/usePermissions';
diff --git a/frontend/src/modules/organization/components/details/organization-details-emails.vue b/frontend/src/modules/organization/components/details/organization-details-emails.vue
index b767125249..8e7056239e 100644
--- a/frontend/src/modules/organization/components/details/organization-details-emails.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-emails.vue
@@ -12,7 +12,7 @@
           class="my-1"
           @click="addEmail = true"
         >
-          <lf-icon-old name="add-fill" />
+          <lf-icon name="plus" type="regular" />
         </lf-button>
       </lf-tooltip>
     </div>
@@ -29,7 +29,7 @@
     </div>
     <div>
       <div v-if="emailList.length === 0" class="pt-2 flex flex-col items-center w-full">
-        <lf-icon-old name="at-line" :size="40" class="text-gray-300" />
+        <lf-icon name="at" :size="40" class="text-gray-300" />
         <p class="text-center pt-3 text-medium text-gray-400">
           No emails
         </p>
@@ -65,7 +65,7 @@
 
 <script setup lang="ts">
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { computed, ref } from 'vue';
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import usePermissions from '@/shared/modules/permissions/helpers/usePermissions';
diff --git a/frontend/src/modules/organization/components/details/organization-details-header.vue b/frontend/src/modules/organization/components/details/organization-details-header.vue
index 4045a18b34..d1ba1685d2 100644
--- a/frontend/src/modules/organization/components/details/organization-details-header.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-header.vue
@@ -25,7 +25,7 @@
           target="_blank"
           rel="noopener noreferrer"
         >
-          <lf-icon-old name="link" :size="16" class="text-gray-400" />
+          <lf-icon name="link" :size="16" class="text-gray-400" />
           <div class="text-gray-500 text-small truncate hover:text-primary-500" style="max-width: 20ch">
             {{ websiteCom.value }}
           </div>
@@ -42,7 +42,7 @@
 <script setup lang="ts">
 import LfBadge from '@/ui-kit/badge/Badge.vue';
 import { Organization } from '@/modules/organization/types/Organization';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import useOrganizationHelpers from '@/modules/organization/helpers/organization.helpers';
 import LfOrganizationMembership from '@/modules/organization/components/shared/organization-membership.vue';
 import { withHttp } from '@/utils/string';
diff --git a/frontend/src/modules/organization/components/details/organization-details-identities.vue b/frontend/src/modules/organization/components/details/organization-details-identities.vue
index d888b64a6e..aaff83263c 100644
--- a/frontend/src/modules/organization/components/details/organization-details-identities.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-identities.vue
@@ -16,7 +16,7 @@
             :icon-only="true"
             class="my-1"
           >
-            <lf-icon-old name="add-fill" />
+            <lf-icon name="plus" type="regular" />
           </lf-button>
         </lf-tooltip>
       </lf-organization-details-identity-add-dropdown>
@@ -33,7 +33,7 @@
         @unmerge="unmerge(identity)"
       />
       <div v-if="identityList.length === 0" class="pt-2 flex flex-col items-center w-full">
-        <lf-icon-old name="fingerprint-fill" :size="40" class="text-gray-300" />
+        <lf-icon name="fingerprint" :size="40" class="text-gray-300" />
         <p class="text-center pt-3 text-medium text-gray-400">
           No identities
         </p>
@@ -70,7 +70,7 @@
 
 <script setup lang="ts">
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { computed, ref } from 'vue';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
diff --git a/frontend/src/modules/organization/components/details/organization-details-phone-numbers.vue b/frontend/src/modules/organization/components/details/organization-details-phone-numbers.vue
index e396f6e65c..b895276aa0 100644
--- a/frontend/src/modules/organization/components/details/organization-details-phone-numbers.vue
+++ b/frontend/src/modules/organization/components/details/organization-details-phone-numbers.vue
@@ -11,7 +11,7 @@
         :icon-only="true"
         @click="edit = true"
       >
-        <lf-icon-old name="pencil-line" />
+        <lf-icon name="pen fa-sharp" />
       </lf-button>
     </div>
 
@@ -32,7 +32,7 @@
       </lf-tooltip>
 
       <div v-if="phoneNumbersList.length === 0" class="pt-2 flex flex-col items-center w-full">
-        <lf-icon-old name="phone-line" :size="40" class="text-gray-300" />
+        <lf-icon name="phone" :size="40" class="text-gray-300" />
         <p class="text-center pt-3 text-medium text-gray-400">
           No phone numbers
         </p>
@@ -60,7 +60,7 @@
 
 <script setup lang="ts">
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { computed, ref } from 'vue';
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import usePermissions from '@/shared/modules/permissions/helpers/usePermissions';
diff --git a/frontend/src/modules/organization/components/details/overview/community/organization-details-community-project-select.vue b/frontend/src/modules/organization/components/details/overview/community/organization-details-community-project-select.vue
index 1df8874247..5141377673 100644
--- a/frontend/src/modules/organization/components/details/overview/community/organization-details-community-project-select.vue
+++ b/frontend/src/modules/organization/components/details/overview/community/organization-details-community-project-select.vue
@@ -3,7 +3,7 @@
     <template #trigger="{ open }">
       <lf-button type="secondary-link">
         {{ selectedSegmentName }}
-        <lf-icon-old name="arrow-up-s-line" :size="16" class="transition" :class="{ 'rotate-180': open }" />
+        <lf-icon name="chevron-up" :size="16" class="transition" :class="{ 'rotate-180': open }" />
       </lf-button>
     </template>
     <lf-dropdown-item
@@ -21,7 +21,7 @@
           placeholder="Search project groups..."
         >
           <template #prefix>
-            <lf-icon-old name="search-line" :size="16" />
+            <lf-icon name="magnifying-glass" :size="16" />
           </template>
         </lf-input>
       </div>
@@ -54,7 +54,7 @@ import LfDropdownSeparator from '@/ui-kit/dropdown/DropdownSeparator.vue';
 import { Organization } from '@/modules/organization/types/Organization';
 import { computed, ref } from 'vue';
 import LfInput from '@/ui-kit/input/Input.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
 
 const props = defineProps<{
diff --git a/frontend/src/modules/organization/components/details/overview/organization-details-attributes.vue b/frontend/src/modules/organization/components/details/overview/organization-details-attributes.vue
index fffd274f71..236e76c64f 100644
--- a/frontend/src/modules/organization/components/details/overview/organization-details-attributes.vue
+++ b/frontend/src/modules/organization/components/details/overview/organization-details-attributes.vue
@@ -58,7 +58,7 @@
       </article>
 
       <div v-if="Object.keys(visibleAttributes).length === 0" class="pt-2 flex flex-col items-center w-full">
-        <lf-icon-old name="list-view" :size="80" class="text-gray-300" />
+        <lf-icon name="rectangle-list" :size="80" class="text-gray-300" />
         <p class="text-center pt-3 text-medium text-gray-400">
           No organization details yet
         </p>
@@ -78,7 +78,7 @@ import LfOrganizationAttributeArray
   from '@/modules/organization/components/details/overview/attributes/organization-attribute-array.vue';
 import LfOrganizationAttributeJson
   from '@/modules/organization/components/details/overview/attributes/organization-attribute-json.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfOrganizationAttributeSource
   from '@/modules/organization/components/details/overview/attributes/organization-attribute-source.vue';
 import useOrganizationHelpers from '@/modules/organization/helpers/organization.helpers';
diff --git a/frontend/src/modules/organization/components/edit/domain/organization-domain-add.vue b/frontend/src/modules/organization/components/edit/domain/organization-domain-add.vue
index 24a5cb6a31..22f10b7588 100644
--- a/frontend/src/modules/organization/components/edit/domain/organization-domain-add.vue
+++ b/frontend/src/modules/organization/components/edit/domain/organization-domain-add.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>Add {{ modelValue?.type?.replace('-', ' ') }}</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -21,7 +21,7 @@
                   @blur="$v.form[di].value.$touch()"
                 >
                   <template #prefix>
-                    <lf-icon-old name="link" class="text-black" :size="20" />
+                    <lf-icon name="link" class="text-black" :size="20" />
                   </template>
                 </lf-input>
                 <lf-button
@@ -31,7 +31,7 @@
                   :icon-only="true"
                   @click="form.splice(di, 1)"
                 >
-                  <lf-icon-old name="delete-bin-6-line" />
+                  <lf-icon name="trash-can" />
                 </lf-button>
               </div>
               <lf-field-messages
@@ -50,7 +50,7 @@
               ...props.modelValue,
             })"
           >
-            <lf-icon-old name="add-line" />
+            <lf-icon name="plus" />
             Add domain
           </lf-button>
         </div>
@@ -76,7 +76,7 @@
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import { computed, reactive, ref } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import Message from '@/shared/message/message';
 import pluralize from 'pluralize';
diff --git a/frontend/src/modules/organization/components/edit/domain/organization-domain-edit.vue b/frontend/src/modules/organization/components/edit/domain/organization-domain-edit.vue
index 38ea590c25..0e9a137813 100644
--- a/frontend/src/modules/organization/components/edit/domain/organization-domain-edit.vue
+++ b/frontend/src/modules/organization/components/edit/domain/organization-domain-edit.vue
@@ -5,7 +5,7 @@
         Update {{ modelValue?.type?.replace('-', ' ') }}
       </h5>
       <lf-button type="secondary-ghost-light" :icon-only="true" @click="isModalOpen = false">
-        <lf-icon-old name="close-line" />
+        <lf-icon name="xmark" />
       </lf-button>
     </div>
     <div class="pt-2 pb-10 px-6 w-full">
@@ -18,7 +18,7 @@
           <template #prefix>
             <div class="flex items-center flex-nowrap whitespace-nowrap">
               <div class="min-w-5">
-                <lf-icon-old name="link" class="text-black" :size="20" />
+                <lf-icon name="link" class="text-black" :size="20" />
               </div>
             </div>
           </template>
@@ -50,7 +50,7 @@ import {
 import { computed, reactive, ref } from 'vue';
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { required } from '@vuelidate/validators';
 import useVuelidate from '@vuelidate/core';
 import LfInput from '@/ui-kit/input/Input.vue';
diff --git a/frontend/src/modules/organization/components/edit/email/organization-email-add.vue b/frontend/src/modules/organization/components/edit/email/organization-email-add.vue
index a8ba832959..4985468e98 100644
--- a/frontend/src/modules/organization/components/edit/email/organization-email-add.vue
+++ b/frontend/src/modules/organization/components/edit/email/organization-email-add.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>Add emails</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -22,7 +22,7 @@
                 >
                   <template #prefix>
                     <div class="min-w-5">
-                      <lf-icon-old name="mail-line" class="text-black" :size="20" />
+                      <lf-icon name="envelope" class="text-black" :size="20" />
                     </div>
                   </template>
                 </lf-input>
@@ -33,7 +33,7 @@
                   :icon-only="true"
                   @click="form.splice(ii, 1)"
                 >
-                  <lf-icon-old name="delete-bin-6-line" />
+                  <lf-icon name="trash-can" />
                 </lf-button>
               </div>
               <lf-field-messages
@@ -47,7 +47,7 @@
           </article>
 
           <lf-button type="primary-link" size="small" @click="form.push({ ...defaultForm })">
-            <lf-icon-old name="add-line" />
+            <lf-icon name="plus" />
             Add email
           </lf-button>
         </div>
@@ -73,7 +73,7 @@
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import { computed, reactive, ref } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import Message from '@/shared/message/message';
 import pluralize from 'pluralize';
diff --git a/frontend/src/modules/organization/components/edit/email/organization-email-edit.vue b/frontend/src/modules/organization/components/edit/email/organization-email-edit.vue
index 8fba9bd306..db0a084f75 100644
--- a/frontend/src/modules/organization/components/edit/email/organization-email-edit.vue
+++ b/frontend/src/modules/organization/components/edit/email/organization-email-edit.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>Edit email</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -20,7 +20,7 @@
             >
               <template #prefix>
                 <div class="min-w-5">
-                  <lf-icon-old name="mail-line" class="text-black" :size="20" />
+                  <lf-icon name="envelope" class="text-black" :size="20" />
                 </div>
               </template>
             </lf-input>
@@ -55,7 +55,7 @@
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import { computed, reactive, ref } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import Message from '@/shared/message/message';
 import { email, required } from '@vuelidate/validators';
diff --git a/frontend/src/modules/organization/components/edit/identity/organization-identity-add.vue b/frontend/src/modules/organization/components/edit/identity/organization-identity-add.vue
index dfd9ff3090..10edf3775c 100644
--- a/frontend/src/modules/organization/components/edit/identity/organization-identity-add.vue
+++ b/frontend/src/modules/organization/components/edit/identity/organization-identity-add.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>Add identity</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -29,9 +29,9 @@
                           class="h-5 w-5 object-contain"
                           :alt="identity.value"
                         />
-                        <lf-icon-old
+                        <lf-icon
                           v-else
-                          name="fingerprint-fill"
+                          name="fingerprint"
                           :size="20"
                           class="text-gray-600"
                         />
@@ -53,7 +53,7 @@
                   :icon-only="true"
                   @click="form.splice(ii, 1)"
                 >
-                  <lf-icon-old name="delete-bin-6-line" />
+                  <lf-icon name="trash-can" />
                 </lf-button>
               </div>
               <lf-field-messages
@@ -73,7 +73,7 @@
             })"
           >
             <lf-button type="primary-link" size="small">
-              <lf-icon-old name="add-line" />
+              <lf-icon name="plus" />
               Add identity
             </lf-button>
           </lf-organization-details-identity-add-dropdown>
@@ -100,7 +100,7 @@
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import { computed, reactive, ref } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import Message from '@/shared/message/message';
 import pluralize from 'pluralize';
diff --git a/frontend/src/modules/organization/components/edit/identity/organization-identity-edit.vue b/frontend/src/modules/organization/components/edit/identity/organization-identity-edit.vue
index 23b84afc0e..e5305cbdc0 100644
--- a/frontend/src/modules/organization/components/edit/identity/organization-identity-edit.vue
+++ b/frontend/src/modules/organization/components/edit/identity/organization-identity-edit.vue
@@ -5,7 +5,7 @@
         <div class="flex items-center justify-between pb-6">
           <h5>Edit identity</h5>
           <lf-button type="secondary-ghost-light" :icon-only="true" @click="close">
-            <lf-icon-old name="close-line" />
+            <lf-icon name="xmark" />
           </lf-button>
         </div>
 
@@ -20,9 +20,9 @@
                     class="h-5 w-5 object-contain"
                     :alt="form.value"
                   />
-                  <lf-icon-old
+                  <lf-icon
                     v-else
-                    name="fingerprint-fill"
+                    name="fingerprint"
                     :size="20"
                     class="text-gray-600"
                   />
@@ -60,7 +60,7 @@
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import { computed, reactive, ref } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import Message from '@/shared/message/message';
 import { required } from '@vuelidate/validators';
diff --git a/frontend/src/modules/organization/components/edit/organization-add.vue b/frontend/src/modules/organization/components/edit/organization-add.vue
index 405f9e3a28..c1f8e83354 100644
--- a/frontend/src/modules/organization/components/edit/organization-add.vue
+++ b/frontend/src/modules/organization/components/edit/organization-add.vue
@@ -4,7 +4,7 @@
     <section class="py-4 pr-4 pl-6 flex justify-between items-center">
       <h5>Add organization</h5>
       <lf-button type="secondary-ghost-light" :icon-only="true" @click="isModalOpen = false">
-        <lf-icon-old name="close-line" />
+        <lf-icon name="xmark" />
       </lf-button>
     </section>
 
@@ -101,7 +101,7 @@
 import LfModal from '@/ui-kit/modal/Modal.vue';
 import { computed, reactive, ref } from 'vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfInput from '@/ui-kit/input/Input.vue';
 import LfField from '@/ui-kit/field/Field.vue';
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
diff --git a/frontend/src/modules/organization/components/edit/organization-edit-logo.vue b/frontend/src/modules/organization/components/edit/organization-edit-logo.vue
index 2d7e848990..b9c538ee01 100644
--- a/frontend/src/modules/organization/components/edit/organization-edit-logo.vue
+++ b/frontend/src/modules/organization/components/edit/organization-edit-logo.vue
@@ -12,7 +12,7 @@
           >
             <template #placeholder>
               <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                <lf-icon-old name="community-line" :size="48" class="text-gray-300" />
+                <lf-icon name="house-building" :size="48" class="text-gray-300" />
               </div>
             </template>
           </lf-avatar>
@@ -26,9 +26,9 @@
               @update:model-value="$v.logo.$touch()"
             >
               <template #suffix>
-                <lf-icon-old
+                <lf-icon
                   v-if="form.logo"
-                  name="close-circle-line"
+                  name="circle-xmark"
                   :size="20"
                   class="text-gray-300 cursor-pointer"
                   @click="form.logo = ''"
@@ -77,7 +77,7 @@ import LfField from '@/ui-kit/field/Field.vue';
 import LfFieldMessage from '@/ui-kit/field-message/FieldMessage.vue';
 import LfFieldMessages from '@/ui-kit/field-messages/FieldMessages.vue';
 import Message from '@/shared/message/message';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Organization } from '@/modules/organization/types/Organization';
 import { useOrganizationStore } from '@/modules/organization/store/pinia';
 import useOrganizationHelpers from '@/modules/organization/helpers/organization.helpers';
diff --git a/frontend/src/modules/organization/components/form/organization-form-emails.vue b/frontend/src/modules/organization/components/form/organization-form-emails.vue
index 77e6f2fbcc..5abba8e733 100644
--- a/frontend/src/modules/organization/components/form/organization-form-emails.vue
+++ b/frontend/src/modules/organization/components/form/organization-form-emails.vue
@@ -13,7 +13,7 @@
             class="btn btn--md btn--transparent w-10 h-10"
             @click="removeEmail(ei)"
           >
-            <i class="ri-delete-bin-line text-lg" />
+            <lf-icon name="trash-can" :size="20" />
           </el-button>
         </template>
       </app-organization-form-emails-item>
@@ -32,6 +32,7 @@ import {
 } from 'vue';
 import AppOrganizationFormEmailsItem from '@/modules/organization/components/form/organization-form-emails-item.vue';
 import { Platform } from '@/shared/modules/platform/types/Platform';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Organization, OrganizationIdentityType, OrganizationIdentity } from '../../types/Organization';
 
 const emit = defineEmits<{(e: 'update:modelValue', value: Organization): void }>();
diff --git a/frontend/src/modules/organization/components/form/organization-form-identities.vue b/frontend/src/modules/organization/components/form/organization-form-identities.vue
index a545ddd234..8b9c2da2f8 100644
--- a/frontend/src/modules/organization/components/form/organization-form-identities.vue
+++ b/frontend/src/modules/organization/components/form/organization-form-identities.vue
@@ -52,7 +52,7 @@
                 class="btn btn--md btn--transparent w-8 !h-8"
                 @click="removeUsername(ii)"
               >
-                <i class="ri-delete-bin-line text-lg" />
+                <lf-icon name="trash-can" :size="20" />
               </el-button>
             </article>
           </template>
@@ -66,6 +66,7 @@
 import {
   computed, ref, watch, reactive,
 } from 'vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { lfIdentities } from '@/config/identities';
 import { OrganizationIdentityType } from '../../types/Organization';
 
diff --git a/frontend/src/modules/organization/components/form/organization-form-phone-number.vue b/frontend/src/modules/organization/components/form/organization-form-phone-number.vue
index 88b00911ba..511f35aefe 100644
--- a/frontend/src/modules/organization/components/form/organization-form-phone-number.vue
+++ b/frontend/src/modules/organization/components/form/organization-form-phone-number.vue
@@ -13,7 +13,7 @@
             class="btn btn--md btn--transparent w-10 h-10"
             @click="removePhoneNumber(ei)"
           >
-            <i class="ri-delete-bin-line text-lg" />
+            <lf-icon name="trash-can" :size="20" />
           </el-button>
         </template>
       </app-organization-form-phone-number-item>
@@ -32,6 +32,7 @@ import {
 } from 'vue';
 import AppOrganizationFormPhoneNumberItem
   from '@/modules/organization/components/form/organization-form-phone-number-item.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const emit = defineEmits(['update:modelValue']);
 
diff --git a/frontend/src/modules/organization/components/lf-member/organization-lf-member-tag.vue b/frontend/src/modules/organization/components/lf-member/organization-lf-member-tag.vue
index 111da38c7f..b8e9226be0 100644
--- a/frontend/src/modules/organization/components/lf-member/organization-lf-member-tag.vue
+++ b/frontend/src/modules/organization/components/lf-member/organization-lf-member-tag.vue
@@ -1,13 +1,14 @@
 <template>
   <el-tooltip v-if="!!organization.lfxMembership" content="Active member organization of the LF or one of its projects" placement="top">
     <div class="text-primary-500 flex items-center gap-1 flex-nowrap">
-      <i :class="`ri-bookmark-3-fill ${iconFontSize}`" />
+      <lf-icon name="circle-bookmark" :class="iconFontSize" />
       <span v-if="!onlyShowIcon" class="font-semibold text-xs whitespace-nowrap">Member</span>
     </div>
   </el-tooltip>
 </template>
 
 <script setup lang="ts">
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Organization } from '../../types/Organization';
 
 withDefaults(
diff --git a/frontend/src/modules/organization/components/list/organization-common-list-table.vue b/frontend/src/modules/organization/components/list/organization-common-list-table.vue
index 315d1b0354..08a4001cee 100644
--- a/frontend/src/modules/organization/components/list/organization-common-list-table.vue
+++ b/frontend/src/modules/organization/components/list/organization-common-list-table.vue
@@ -34,7 +34,7 @@
               <el-popover v-if="getSegments(org.segments).length > 0" placement="top-start" width="264px">
                 <template #reference>
                   <div class="border border-gray-200 h-6 px-1.5 rounded-md bg-white text-small gap-1 flex items-center whitespace-nowrap text-black">
-                    <lf-icon-old name="folders-line" :size="14" />
+                    <lf-icon name="folders" :size="14" />
                     {{ pluralize('project group', getSegments(org.segments).length, true) }}
                   </div>
                 </template>
@@ -48,7 +48,7 @@
                       :key="segment.id"
                       class="flex items-center gap-2"
                     >
-                      <lf-icon-old name="folder-line" :size="16" class="text-gray-400" />
+                      <lf-icon name="folder" :size="16" class="text-gray-400" />
                       <span class="text-small text-black">{{ segment.name }}</span>
                     </div>
                   </div>
@@ -72,18 +72,18 @@
               <lf-dropdown placement="bottom-end" @click.stop.prevent>
                 <template #trigger>
                   <lf-button type="secondary-ghost-light" :icon-only="true" size="small" @click.prevent>
-                    <i class="ri-more-fill !text-lg" />
+                    <lf-icon name="ellipsis" :size="20" />
                   </lf-button>
                 </template>
                 <lf-dropdown-item
                   @click="markAsTeamOrganization(org)"
                 >
-                  <i class="ri-team-line" />
+                  <lf-icon name="people-group" />
                   {{ org.isTeamOrganization ? 'Unmark' : 'Mark' }} as team organization
                 </lf-dropdown-item>
                 <lf-dropdown-separator />
                 <lf-dropdown-item type="danger" @click="deleteOrganization(org)">
-                  <i class="ri-delete-bin-6-line" />
+                  <lf-icon name="trash-can" />
                   Delete organization
                 </lf-dropdown-item>
               </lf-dropdown>
@@ -127,7 +127,7 @@ import Message from '@/shared/message/message';
 import ConfirmDialog from '@/shared/dialog/confirm-dialog';
 import pluralize from 'pluralize';
 import { getSegmentName } from '@/utils/segments';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps<{
   sorting: string,
diff --git a/frontend/src/modules/organization/components/list/organization-list-table.vue b/frontend/src/modules/organization/components/list/organization-list-table.vue
index f90f85ed63..4d858ea3ef 100644
--- a/frontend/src/modules/organization/components/list/organization-list-table.vue
+++ b/frontend/src/modules/organization/components/list/organization-list-table.vue
@@ -734,10 +734,7 @@
                         type="button"
                         @click.prevent.stop="() => onActionBtnClick(scope.row)"
                       >
-                        <i
-                          :id="`buttonRefIcon-${scope.row.id}`"
-                          class="text-xl ri-more-fill"
-                        />
+                        <lf-icon :id="`buttonRefIcon-${scope.row.id}`" name="ellipsis" type="regular" :size="24" />
                       </button>
                     </router-link>
                   </template>
@@ -830,6 +827,7 @@ import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { getOrganizationWebsite } from '@/utils/organization';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import AppOrganizationListToolbar from './organization-list-toolbar.vue';
 import AppOrganizationName from '../organization-name.vue';
 import AppOrganizationDropdownContent from '../organization-dropdown-content.vue';
diff --git a/frontend/src/modules/organization/components/list/organization-list-toolbar.vue b/frontend/src/modules/organization/components/list/organization-list-toolbar.vue
index a23f3ed328..d0c39f6cf0 100644
--- a/frontend/src/modules/organization/components/list/organization-list-toolbar.vue
+++ b/frontend/src/modules/organization/components/list/organization-list-toolbar.vue
@@ -13,11 +13,11 @@
     <el-dropdown trigger="click" @command="handleCommand">
       <button type="button" class="btn btn--secondary btn--sm">
         <span class="mr-2">Actions</span>
-        <i class="ri-xl ri-arrow-down-s-line" />
+        <lf-icon name="chevron-down" :size="24" />
       </button>
       <template #dropdown>
         <el-dropdown-item :command="{ action: 'export' }">
-          <i class="ri-lg ri-file-download-line mr-1" />
+          <lf-icon name="file-arrow-down" :size="20" class="mr-1" />
           Export to CSV
         </el-dropdown-item>
 
@@ -38,9 +38,7 @@
                   || !hasPermission(LfPermission.mergeOrganizations)
               "
             >
-              <i
-                class="ri-lg mr-1 ri-shuffle-line"
-              />
+              <lf-icon name="shuffling" :size="20" class="mr-1" />
               Merge organizations
             </el-dropdown-item>
           </span>
@@ -53,10 +51,7 @@
             value: markAsTeamOrganizationOptions.value,
           }"
         >
-          <i
-            class="ri-lg mr-1"
-            :class="markAsTeamOrganizationOptions.icon"
-          />
+          <lf-icon :name="markAsTeamOrganizationOptions.icon" :size="20" class="mr-1" />
           {{ markAsTeamOrganizationOptions.copy }}
         </el-dropdown-item>
 
@@ -70,7 +65,7 @@
             <div
               class="flex items-center text-red-500"
             >
-              <i class="ri-lg ri-delete-bin-line mr-2" />
+              <lf-icon name="trash-can" :size="20" class="mr-2" />
               <span>Delete organizations</span>
             </div>
           </el-dropdown-item>
@@ -98,6 +93,7 @@ import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
 import AppOrganizationMergeDialog from '@/modules/organization/components/organization-merge-dialog.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { OrganizationService } from '../../organization-service';
 
 const { trackEvent } = useProductTracking();
@@ -129,14 +125,14 @@ const markAsTeamOrganizationOptions = computed(() => {
 
   if (isTeamView) {
     return {
-      icon: 'ri-bookmark-2-line',
+      icon: 'bookmark-slash',
       copy: `Unmark as team ${organizationsCopy}`,
       value: false,
     };
   }
 
   return {
-    icon: 'ri-bookmark-line',
+    icon: 'bookmark',
     copy: `Mark as team ${organizationsCopy}`,
     value: true,
   };
diff --git a/frontend/src/modules/organization/components/organization-badge.vue b/frontend/src/modules/organization/components/organization-badge.vue
index e04af0de4b..3981510e62 100644
--- a/frontend/src/modules/organization/components/organization-badge.vue
+++ b/frontend/src/modules/organization/components/organization-badge.vue
@@ -8,7 +8,7 @@
       content="Your own organization"
     >
       <div class="px-2 py-0.5 flex items-center text-2xs font-medium bg-gray-200 text-gray-600 rounded-md gap-1">
-        <i class="ri-team-line text-2xs" />Team
+        <lf-icon name="people-group" :size="12" />Team
       </div>
     </el-tooltip>
   </div>
@@ -16,6 +16,7 @@
 
 <script setup>
 import { computed } from 'vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps({
   organization: {
diff --git a/frontend/src/modules/organization/components/organization-dropdown-content.vue b/frontend/src/modules/organization/components/organization-dropdown-content.vue
index 6b37109844..971ff144d4 100644
--- a/frontend/src/modules/organization/components/organization-dropdown-content.vue
+++ b/frontend/src/modules/organization/components/organization-dropdown-content.vue
@@ -31,7 +31,8 @@
       class="h-10 el-dropdown-menu__item w-full"
       type="button"
     >
-      <i class="ri-pencil-line text-base mr-2" /><span class="text-xs">Edit organization</span>
+      <lf-icon name="pen fa-sharp" class="text-base mr-2" />
+      <span class="text-xs">Edit organization</span>
     </button>
   </router-link>
 
@@ -89,7 +90,7 @@
         })
       "
     >
-      <i class="ri-bookmark-2-line text-base mr-2" /><span class="text-xs">Unmark as team organization</span>
+      <lf-icon name="bookmark-slash" class="mr-2" /><span class="text-xs">Unmark as team organization</span>
     </button>
   </template>
 
@@ -107,9 +108,8 @@
         })
       "
     >
-      <i
-        class="ri-delete-bin-line text-base mr-2 text-red-500"
-      /><span
+      <lf-icon name="trash-can" :size="16" class="mr-2 text-red-500" />
+      <span
         class="text-xs text-red-500"
       >Delete organization</span>
     </button>
@@ -125,6 +125,7 @@ import usePermissions from '@/shared/modules/permissions/helpers/usePermissions'
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { OrganizationService } from '../organization-service';
 import { Organization } from '../types/Organization';
 
diff --git a/frontend/src/modules/organization/components/organization-dropdown.vue b/frontend/src/modules/organization/components/organization-dropdown.vue
index 18a28bcf47..77d99a0378 100644
--- a/frontend/src/modules/organization/components/organization-dropdown.vue
+++ b/frontend/src/modules/organization/components/organization-dropdown.vue
@@ -11,7 +11,7 @@
         type="button"
         @click.prevent.stop
       >
-        <i class="text-xl ri-more-fill" />
+        <lf-icon name="ellipsis" type="regular" :size="24" />
       </button>
     </slot>
     <template #dropdown>
@@ -31,6 +31,7 @@
 import { computed, ref } from 'vue';
 import usePermissions from '@/shared/modules/permissions/helpers/usePermissions';
 import { LfPermission } from '@/shared/modules/permissions/types/Permissions';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import AppOrganizationDropdownContent from './organization-dropdown-content.vue';
 
 defineProps({
diff --git a/frontend/src/modules/organization/components/organization-merge-suggestions-dialog.vue b/frontend/src/modules/organization/components/organization-merge-suggestions-dialog.vue
index 54a832c8b3..11d7aae2da 100644
--- a/frontend/src/modules/organization/components/organization-merge-suggestions-dialog.vue
+++ b/frontend/src/modules/organization/components/organization-merge-suggestions-dialog.vue
@@ -16,7 +16,7 @@
         >
           <template #actions>
             <lf-button type="secondary-ghost-light" :icon-only="true" @click="isModalOpen = false">
-              <i class="ri-close-line" />
+              <lf-icon name="xmark" />
             </lf-button>
           </template>
         </app-organization-merge-suggestions>
@@ -30,6 +30,7 @@ import { computed } from 'vue';
 import AppOrganizationMergeSuggestions from '@/modules/organization/components/organization-merge-suggestions.vue';
 import AppDialog from '@/shared/dialog/dialog.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = withDefaults(defineProps<{
   modelValue: boolean,
diff --git a/frontend/src/modules/organization/components/organization-merge-suggestions.vue b/frontend/src/modules/organization/components/organization-merge-suggestions.vue
index eb87c43aa1..1daf9ae8d2 100644
--- a/frontend/src/modules/organization/components/organization-merge-suggestions.vue
+++ b/frontend/src/modules/organization/components/organization-merge-suggestions.vue
@@ -11,7 +11,7 @@
             :icon-only="true"
             @click="fetch(offset - 1)"
           >
-            <i class="ri-arrow-left-s-line" />
+            <lf-icon name="chevron-left" />
           </lf-button>
           <lf-button
             type="secondary"
@@ -20,7 +20,7 @@
             :icon-only="true"
             @click="fetch(offset + 1)"
           >
-            <i class="ri-arrow-right-s-line" />
+            <lf-icon name="chevron-right" />
           </lf-button>
         </div>
 
@@ -152,6 +152,7 @@ import LfButton from '@/ui-kit/button/Button.vue';
 import AppMemberMergeSimilarity from '@/modules/member/components/suggestions/member-merge-similarity.vue';
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { OrganizationService } from '../organization-service';
 
 const props = defineProps({
diff --git a/frontend/src/modules/organization/components/organization-name.vue b/frontend/src/modules/organization/components/organization-name.vue
index 7f91c66c63..a26a992035 100644
--- a/frontend/src/modules/organization/components/organization-name.vue
+++ b/frontend/src/modules/organization/components/organization-name.vue
@@ -12,7 +12,7 @@
           :src="organization.logo"
           class="max-h-8"
         >
-          <i class="ri-community-line text-lg text-gray-300" />
+          <lf-icon name="house-building" :size="20" class="text-gray-300" />
         </app-avatar-image>
         <app-avatar-new-badge
           :entity="organization"
@@ -57,6 +57,7 @@ import AppOrganizationBadge from '@/modules/organization/components/organization
 import AppAvatarNewBadge from '@/shared/avatar/avatar-new-badge.vue';
 import AppAvatarImage from '@/shared/avatar-image/avatar-image.vue';
 import LfOrganizationLfMemberTag from '@/modules/organization/components/lf-member/organization-lf-member-tag.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 defineProps({
   organization: {
diff --git a/frontend/src/modules/organization/components/organization-selection-dropdown.vue b/frontend/src/modules/organization/components/organization-selection-dropdown.vue
index a17364a834..00bb414135 100644
--- a/frontend/src/modules/organization/components/organization-selection-dropdown.vue
+++ b/frontend/src/modules/organization/components/organization-selection-dropdown.vue
@@ -1,9 +1,7 @@
 <template>
   <div class="pt-16">
     <div class="flex justify-center">
-      <i
-        class="ri-community-line text-gray-200 account-icon text-center h-16 flex items-center"
-      />
+      <lf-icon name="house-building" class="text-gray-200 account-icon text-center h-16 flex items-center" />
     </div>
     <div class="text-gray-600 text-sm text-center py-4">
       Select the organization you want to merge with
@@ -55,6 +53,7 @@ import AppAutocompleteOneInput from '@/shared/form/autocomplete-one-input.vue';
 import AppAvatar from '@/shared/avatar/avatar.vue';
 import { OrganizationService } from '@/modules/organization/organization-service';
 import { useRoute } from 'vue-router';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const emit = defineEmits('update:modelValue');
 const props = defineProps({
diff --git a/frontend/src/modules/organization/components/organization-unmerge-dialog.vue b/frontend/src/modules/organization/components/organization-unmerge-dialog.vue
index 8356cf34bb..ac342d304c 100644
--- a/frontend/src/modules/organization/components/organization-unmerge-dialog.vue
+++ b/frontend/src/modules/organization/components/organization-unmerge-dialog.vue
@@ -106,10 +106,12 @@
                               :label="i.displayValue"
                               @click="fetchPreview(i)"
                             >
-                              <i v-if="i.type === 'email'" class="text-gray-900 text-lg leading-5 mr-2 ri-mail-line" />
-                              <i
+                              <lf-icon v-if="i.type === 'email'" name="envelope" :size="20" class="text-gray-900 leading-5 mr-2" />
+                              <lf-icon
                                 v-else-if="['primary-domain', 'alternative-domain', 'affiliated-profile'].includes(i.type)"
-                                class="text-gray-900 text-lg leading-5 mr-2 ri-window-line"
+                                name="window"
+                                :size="20"
+                                class="text-gray-900 text-lg leading-5 mr-2"
                               />
                               <img
                                 v-else-if="lfIdentities[i.platform]"
@@ -117,9 +119,9 @@
                                 :alt="lfIdentities[i.platform]?.name"
                                 :src="lfIdentities[i.platform]?.image"
                               />
-                              <lf-icon-old
+                              <lf-icon
                                 v-else
-                                name="fingerprint-fill"
+                                name="fingerprint"
                                 :size="20"
                                 class="text-gray-600 mr-2"
                               />
@@ -136,7 +138,7 @@
             <!-- Identity selection -->
             <div v-else class="pt-14">
               <div class="flex justify-center pb-5">
-                <div class="ri-fingerprint-line text-5xl text-gray-200" />
+                <lf-icon name="fingerprint" :size="64" class="text-gray-200" />
               </div>
               <p class="text-center text-xs leading-5 text-gray-500">
                 Select the organization identity you want to unmerge
@@ -154,10 +156,12 @@
                     :value="i"
                     :label="i.displayValue"
                   >
-                    <i v-if="i.type === 'email'" class="text-gray-900 text-lg leading-5 mr-2 ri-mail-line" />
-                    <i
+                    <lf-icon v-if="i.type === 'email'" name="envelope" :size="20" class="text-gray-900 leading-5 mr-2" />
+                    <lf-icon
                       v-else-if="['primary-domain', 'alternative-domain', 'affiliated-profile'].includes(i.type)"
-                      class="text-gray-900 text-lg leading-5 mr-2 ri-window-line"
+                      name="window"
+                      size="20"
+                      class="text-gray-900 text-lg leading-5 mr-2"
                     />
                     <img
                       v-else-if="lfIdentities[i.platform]"
@@ -165,9 +169,9 @@
                       :alt="lfIdentities[i.platform]?.name"
                       :src="lfIdentities[i.platform]?.image"
                     />
-                    <lf-icon-old
+                    <lf-icon
                       v-else
-                      name="fingerprint-fill"
+                      name="fingerprint"
                       :size="20"
                       class="text-gray-600 mr-2"
                     />
@@ -194,7 +198,7 @@ import AppOrganizationMergeSuggestionsDetails
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
 import { Platform } from '@/shared/modules/platform/types/Platform';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { useOrganizationStore } from '@/modules/organization/store/pinia';
 import { lfIdentities } from '@/config/identities';
 
diff --git a/frontend/src/modules/organization/components/shared/organization-dropdown.vue b/frontend/src/modules/organization/components/shared/organization-dropdown.vue
index 2e18e6a59c..ca42e77d93 100644
--- a/frontend/src/modules/organization/components/shared/organization-dropdown.vue
+++ b/frontend/src/modules/organization/components/shared/organization-dropdown.vue
@@ -3,21 +3,21 @@
     v-if="hasPermission(LfPermission.organizationEdit) && props.organization.identities.length > 1"
     @click="unmerge = props.organization"
   >
-    <lf-icon-old name="link-unlink-m" />
+    <lf-icon name="link-simple-slash" />
     Unmerge identity
   </lf-dropdown-item>
   <lf-dropdown-item
     v-if="hasPermission(LfPermission.organizationEdit)"
     @click="markTeamOrganization(!props.organization.isTeamOrganization)"
   >
-    <lf-icon-old name="team-line" />
+    <lf-icon name="people-group" />
     {{ props.organization.isTeamOrganization ? 'Unmark' : 'Mark' }} as team organization
   </lf-dropdown-item>
 
   <template v-if="hasPermission(LfPermission.organizationDestroy)">
     <lf-dropdown-separator />
     <lf-dropdown-item type="danger" @click="deleteOrganization()">
-      <lf-icon-old name="delete-bin-6-line" />
+      <lf-icon name="trash-can" />
       Delete organization
     </lf-dropdown-item>
   </template>
@@ -29,7 +29,7 @@
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfDropdownItem from '@/ui-kit/dropdown/DropdownItem.vue';
 import LfDropdownSeparator from '@/ui-kit/dropdown/DropdownSeparator.vue';
 import usePermissions from '@/shared/modules/permissions/helpers/usePermissions';
diff --git a/frontend/src/modules/organization/components/shared/organization-membership.vue b/frontend/src/modules/organization/components/shared/organization-membership.vue
index aacb1a27b5..3064414887 100644
--- a/frontend/src/modules/organization/components/shared/organization-membership.vue
+++ b/frontend/src/modules/organization/components/shared/organization-membership.vue
@@ -4,7 +4,7 @@
     content="Active member organization of the LF or one of its projects"
   >
     <div class="text-primary-500 flex items-center gap-1 flex-nowrap">
-      <lf-icon-old name="bookmark-3-fill" :size="16" />
+      <lf-icon name="circle-bookmark" />
       <span class="font-semibold text-tiny whitespace-nowrap" v-bind="$attrs">Member</span>
     </div>
   </lf-tooltip>
@@ -12,7 +12,7 @@
 
 <script setup lang="ts">
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Organization } from '../../types/Organization';
 
 const props = withDefaults(
diff --git a/frontend/src/modules/organization/components/shared/organization-select.vue b/frontend/src/modules/organization/components/shared/organization-select.vue
index 4439032e64..53566e37ab 100644
--- a/frontend/src/modules/organization/components/shared/organization-select.vue
+++ b/frontend/src/modules/organization/components/shared/organization-select.vue
@@ -24,7 +24,7 @@
         >
           <template #placeholder>
             <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-              <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+              <lf-icon name="house-building" :size="12" class="text-gray-400" />
             </div>
           </template>
         </lf-avatar>
@@ -41,7 +41,7 @@
           >
             <template #placeholder>
               <div class="w-full h-full bg-gray-50 flex items-center justify-center">
-                <lf-icon-old name="community-line" :size="12" class="text-gray-400" />
+                <lf-icon name="house-building" :size="12" class="text-gray-400" />
               </div>
             </template>
           </lf-avatar>
@@ -59,7 +59,7 @@ import { ref, computed, onMounted } from 'vue';
 import { OrganizationService } from '@/modules/organization/organization-service';
 import { Organization } from '@/modules/organization/types/Organization';
 import LfAvatar from '@/ui-kit/avatar/Avatar.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import LfProjectGroupsTags from '@/shared/modules/project-groups/components/project-groups-tags.vue';
 import AppAutocompleteOneInput from '@/shared/form/autocomplete-one-input.vue';
 import { storeToRefs } from 'pinia';
diff --git a/frontend/src/modules/organization/components/shared/organization-syncing-activities.vue b/frontend/src/modules/organization/components/shared/organization-syncing-activities.vue
index c76b55646a..9b9a9130a1 100644
--- a/frontend/src/modules/organization/components/shared/organization-syncing-activities.vue
+++ b/frontend/src/modules/organization/components/shared/organization-syncing-activities.vue
@@ -6,7 +6,7 @@
       ${props.organization.activitySycning?.operationType === 'merge' ? 'merged' : 'unmerged'}. This process may take some minutes.`"
     >
       <div class="flex items-center gap-1.5 cursor-default">
-        <lf-icon-old name="loader-4-fill" :size="16" class="text-secondary-400 animate-spin" />
+        <lf-icon name="circle-notch" :size="16" class="text-secondary-400 animate-spin" />
         <p class="text-small text-secondary-400 font-semibold">
           Syncing activities...
         </p>
@@ -18,7 +18,7 @@
 <script setup lang="ts">
 import LfTooltip from '@/ui-kit/tooltip/Tooltip.vue';
 import { MergeActionState } from '@/shared/modules/merge/types/MemberActions';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { Organization } from '@/modules/organization/types/Organization';
 
 const props = defineProps<{
diff --git a/frontend/src/modules/organization/pages/organization-details.page.vue b/frontend/src/modules/organization/pages/organization-details.page.vue
index de535fd714..491a7d5eaa 100644
--- a/frontend/src/modules/organization/pages/organization-details.page.vue
+++ b/frontend/src/modules/organization/pages/organization-details.page.vue
@@ -13,7 +13,7 @@
         <div class="flex items-center flex-grow">
           <lf-back :to="{ path: hasSegments ? '/organizations' : '/admin' }" class="mr-2" @mouseover.stop @mouseout.stop>
             <lf-button type="secondary-ghost" :icon-only="true">
-              <lf-icon-old name="arrow-left-s-line" />
+              <lf-icon name="chevron-left" />
             </lf-button>
           </lf-back>
           <lf-organization-details-header :organization="organization" />
@@ -67,9 +67,9 @@
               <lf-tab v-model="tabs" name="activities">
                 <div class="flex items-center gap-1">
                   Activities
-                  <lf-icon-old
+                  <lf-icon
                     v-if="organization.activitySycning?.state === MergeActionState.ERROR"
-                    name="error-warning-line"
+                    name="circle-exclamation"
                     :size="16"
                     class="text-red-500"
                   />
@@ -106,7 +106,7 @@ import LfTab from '@/ui-kit/tabs/Tab.vue';
 import { computed, onMounted, ref } from 'vue';
 import LfBack from '@/ui-kit/back/Back.vue';
 import LfButton from '@/ui-kit/button/Button.vue';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { useRoute } from 'vue-router';
 import { useLfSegmentsStore } from '@/modules/lf/segments/store';
 import { storeToRefs } from 'pinia';
diff --git a/frontend/src/modules/organization/pages/organization-form-page.vue b/frontend/src/modules/organization/pages/organization-form-page.vue
index 1f768003e9..8f4648fcc4 100644
--- a/frontend/src/modules/organization/pages/organization-form-page.vue
+++ b/frontend/src/modules/organization/pages/organization-form-page.vue
@@ -35,7 +35,7 @@
                 :disabled="isFormSubmitting"
                 @click="onReset"
               >
-                <i class="ri-arrow-go-back-line" />
+                <lf-icon name="arrow-turn-left" />
                 <span>Reset changes</span>
               </el-button>
               <div
@@ -163,6 +163,7 @@ import AppOrganizationFormEmails from '@/modules/organization/components/form/or
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
 import AppLfSubProjectsListDropdown from '@/modules/admin/modules/projects/components/lf-sub-projects-list-dropdown.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 import { useOrganizationStore } from '../store/pinia';
 
 const LoaderIcon = h(
diff --git a/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue b/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue
index 934deb6e6d..b1ca7567db 100644
--- a/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue
+++ b/frontend/src/modules/organization/pages/organization-merge-suggestions-page.vue
@@ -20,7 +20,7 @@
           placement="top"
           content="LFX is constantly checking your community for duplicate organizations. Here you can check all the merging suggestions."
         >
-          <i class="ri-question-line text-lg text-gray-500 flex items-center ml-2 h-5" />
+          <lf-icon name="circle-question" :size="20" class="text-gray-500 flex items-center ml-2 h-5" />
         </el-tooltip>
       </div>
 
@@ -93,7 +93,7 @@
                   class="text-black hover:text-primary-500"
                 >
                   <div class="flex items-center gap-2">
-                    <i class="text-xl ri-subtract-line text-gray-300" />
+                    <lf-icon name="minus" :size="24" class="text-gray-300" />
                     <app-avatar
                       size="xs"
                       :entity="{
@@ -133,16 +133,16 @@
                       :loading="sending === `${suggestion.organizations[0].id}:${suggestion.organizations[1].id}`"
                       :icon-only="true"
                     >
-                      <i class="ri-more-fill" />
+                      <lf-icon name="ellipsis" type="regular" />
                     </lf-button>
                   </template>
 
                   <lf-dropdown-item @click="merge(suggestion)">
-                    <i class="ri-shuffle-line" /> Merge suggestion
+                    <lf-icon name="shuffle" /> Merge suggestion
                   </lf-dropdown-item>
 
                   <lf-dropdown-item @click="ignore(suggestion)">
-                    <i class="ri-close-circle-line" />Ignore suggestion
+                    <lf-icon name="circle-xmark" />Ignore suggestion
                   </lf-dropdown-item>
                 </lf-dropdown>
               </div>
@@ -151,9 +151,7 @@
         </tbody>
       </lf-table>
       <div v-else class="py-20 flex flex-col items-center">
-        <div
-          class="ri-shuffle-line text-gray-200 text-10xl h-40 flex items-center mb-8"
-        />
+        <lf-icon name="shuffle" :size="160" class="text-gray-200 flex items-center mb-8" />
         <h5 class="text-center text-lg font-semibold mb-4">
           No merge suggestions
         </h5>
@@ -164,7 +162,7 @@
 
       <div v-if="total > mergeSuggestions.length" class="mt-6 flex justify-center">
         <lf-button type="primary-ghost" size="small" :loading="loading" @click="loadMore()">
-          <i class="ri-arrow-down-line" />Load more
+          <lf-icon name="arrow-down" />Load more
         </lf-button>
       </div>
     </div>
@@ -202,6 +200,7 @@ import AppMergeSuggestionsFilters from '@/modules/member/components/suggestions/
 import useProductTracking from '@/shared/modules/monitoring/useProductTracking';
 import { EventType, FeatureEventKey } from '@/shared/modules/monitoring/types/event';
 import LfOrganizationLfMemberTag from '@/modules/organization/components/lf-member/organization-lf-member-tag.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const { selectedProjectGroup } = storeToRefs(useLfSegmentsStore());
 
diff --git a/frontend/src/shared/modules/identities/components/verified-identity-badge.vue b/frontend/src/shared/modules/identities/components/verified-identity-badge.vue
index 79f5bd286d..e4fd026e5f 100644
--- a/frontend/src/shared/modules/identities/components/verified-identity-badge.vue
+++ b/frontend/src/shared/modules/identities/components/verified-identity-badge.vue
@@ -14,8 +14,8 @@
       </span>
     </template>
 
-    <lf-icon-old
-      name="verified-badge-line"
+    <lf-icon
+      name="badge-check"
       :size="16"
       class="ml-1 text-primary-500"
     />
@@ -23,5 +23,5 @@
 </template>
 
 <script setup lang="ts">
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 </script>
diff --git a/frontend/src/shared/modules/report-issue/component/report-data-issue-modal.vue b/frontend/src/shared/modules/report-issue/component/report-data-issue-modal.vue
index 911d317061..1bfa403495 100644
--- a/frontend/src/shared/modules/report-issue/component/report-data-issue-modal.vue
+++ b/frontend/src/shared/modules/report-issue/component/report-data-issue-modal.vue
@@ -7,7 +7,7 @@
     <!-- header -->
     <section class="px-6 pt-4 pb-6 flex justify-between items-center">
       <div class="flex items-center gap-3">
-        <lf-icon-old name="feedback-line" class="text-red-500" :size="24" />
+        <lf-icon name="circle-exclamation" class="text-red-500" :size="24" />
         <h5>Report data issue</h5>
       </div>
       <lf-button
@@ -15,7 +15,7 @@
         :icon-only="true"
         @click="isModalOpen = false;reset()"
       >
-        <lf-icon-old name="close-line" />
+        <lf-icon name="xmark" />
       </lf-button>
     </section>
 
@@ -133,7 +133,7 @@ import LfFieldMessages from '@/ui-kit/field-messages/FieldMessages.vue';
 import { ReportDataType } from '@/shared/modules/report-issue/constants/report-data-type.enum';
 import authAxios from '@/shared/axios/auth-axios';
 import Message from '@/shared/message/message';
-import LfIconOld from '@/ui-kit/icon/IconOld.vue';
+import LfIcon from '@/ui-kit/icon/Icon.vue';
 
 const props = defineProps<{
   modelValue: boolean,
diff --git a/frontend/src/ui-kit/timeline/Timeline.stories.ts b/frontend/src/ui-kit/timeline/Timeline.stories.ts
index 6098d24582..fb1dba5be9 100644
--- a/frontend/src/ui-kit/timeline/Timeline.stories.ts
+++ b/frontend/src/ui-kit/timeline/Timeline.stories.ts
@@ -44,7 +44,7 @@ export const Regular = {
           </p>
         </div>
         <p class="text-small text-gray-500 mb-1.5 flex items-center">
-          <lf-icon-old name="calendar-line" :size="16" class="mr-1.5 text-gray-400" />
+        <lf-icon name="calendar fa-sharp" :size="16" class="mr-1.5 text-gray-400" />
           {{ item.date }}
         </p>
       </lf-timeline-item>