diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx
index baee20f82bb..48a37bce4f1 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/active-cycles/header.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 // ui
-import { CycleIcon } from "@plane/propel/icons";
+import { CyclesOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -24,7 +24,7 @@ export const WorkspaceActiveCycleHeader = observer(function WorkspaceActiveCycle
             component={
               <BreadcrumbLink
                 label={t("active_cycles")}
-                icon={<CycleIcon className="h-4 w-4 rotate-180 text-tertiary" />}
+                icon={<CyclesOutline className="h-4 w-4 rotate-180 text-tertiary" />}
               />
             }
           />
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx
index ed2c9215a87..992476e6d3d 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/analytics/[tabId]/header.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
-import { AnalyticsIcon } from "@plane/propel/icons";
+import { AnalyticsOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
@@ -22,7 +22,7 @@ export const WorkspaceAnalyticsHeader = observer(function WorkspaceAnalyticsHead
             component={
               <BreadcrumbLink
                 label={t("workspace_analytics.label")}
-                icon={<AnalyticsIcon className="h-4 w-4 text-tertiary" />}
+                icon={<AnalyticsOutline className="h-4 w-4 text-tertiary" />}
               />
             }
           />
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx
index f8f18b1fc6f..4b7111e9753 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/browse/[workItem]/work-item-header.tsx
@@ -8,7 +8,7 @@ import React from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane ui
-import { WorkItemsIcon } from "@plane/propel/icons";
+import { WorkItemsOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -46,7 +46,7 @@ export const WorkItemDetailsHeader = observer(function WorkItemDetailsHeader() {
               <BreadcrumbLink
                 label="Work Items"
                 href={`/${workspaceSlug}/projects/${projectId}/issues/`}
-                icon={<WorkItemsIcon className="h-4 w-4 text-tertiary" />}
+                icon={<WorkItemsOutline className="h-4 w-4 text-tertiary" />}
               />
             }
           />
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx
index a063df5256f..027b8edd7d7 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx
@@ -10,7 +10,7 @@ import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
 import { Button } from "@plane/propel/button";
-import { DraftIcon } from "@plane/propel/icons";
+import { DraftsOutline } from "@makeplane/propel/icons";
 import { EIssuesStoreType } from "@plane/types";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
@@ -52,7 +52,7 @@ export const WorkspaceDraftHeader = observer(function WorkspaceDraftHeader() {
             <Breadcrumbs>
               <Breadcrumbs.Item
                 component={
-                  <BreadcrumbLink label={t("drafts")} icon={<DraftIcon className="h-4 w-4 text-tertiary" />} />
+                  <BreadcrumbLink label={t("drafts")} icon={<DraftsOutline className="h-4 w-4 text-tertiary" />} />
                 }
               />
             </Breadcrumbs>
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx
index 50a5bd692f1..5d7c69f0852 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/extended-project-sidebar.tsx
@@ -11,7 +11,7 @@ import { useParams } from "next/navigation";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { EmptyStateCompact } from "@plane/propel/empty-state";
-import { PlusIcon, SearchIcon } from "@plane/propel/icons";
+import { AddOutline, SearchOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { copyUrlToClipboard, orderJoinedProjects } from "@plane/utils";
@@ -123,13 +123,13 @@ export const ExtendedProjectSidebar = observer(function ExtendedProjectSidebar()
                     setIsProjectModalOpen(true);
                   }}
                 >
-                  <PlusIcon className="size-3" />
+                  <AddOutline className="size-3" />
                 </button>
               </Tooltip>
             )}
           </div>
           <div className="ml-auto flex w-full items-center gap-1.5 rounded-md border border-subtle bg-surface-1 px-2.5 py-1">
-            <SearchIcon className="h-3.5 w-3.5 text-placeholder" />
+            <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
             <input
               className="w-full max-w-[234px] border-none bg-transparent text-13 outline-none placeholder:text-placeholder"
               placeholder={t("search")}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
index f15d7673882..ce784524694 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx
@@ -5,11 +5,10 @@
  */
 
 import { observer } from "mobx-react";
-import { Shapes } from "lucide-react";
+import { HomeOutline, WidgetOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { HomeIcon } from "@plane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -30,7 +29,7 @@ export const WorkspaceDashboardHeader = observer(function WorkspaceDashboardHead
             <Breadcrumbs>
               <Breadcrumbs.Item
                 component={
-                  <BreadcrumbLink label={t("home.title")} icon={<HomeIcon className="h-4 w-4 text-tertiary" />} />
+                  <BreadcrumbLink label={t("home.title")} icon={<HomeOutline className="h-4 w-4 text-tertiary" />} />
                 }
               />
             </Breadcrumbs>
@@ -42,7 +41,7 @@ export const WorkspaceDashboardHeader = observer(function WorkspaceDashboardHead
             size="lg"
             onClick={() => toggleWidgetSettings(true)}
             className="my-auto mb-0"
-            prependIcon={<Shapes />}
+            prependIcon={<WidgetOutline />}
           >
             <div className="hidden sm:hidden md:block">{t("home.manage_widgets")}</div>
           </Button>
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx
index 296b780c91e..28f415bdde1 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/header.tsx
@@ -7,10 +7,9 @@
 // ui
 import { observer } from "mobx-react";
 import { useParams, useRouter } from "next/navigation";
-import { PanelRight } from "lucide-react";
+import { ChevronDownOutline, RightSidePaneOutline, YourWorkOutline } from "@makeplane/propel/icons";
 import { PROFILE_VIEWER_TAB, PROFILE_ADMINS_TAB, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { YourWorkIcon, ChevronDownIcon } from "@plane/propel/icons";
 import type { IUserProfileProjectSegregation } from "@plane/types";
 import { Breadcrumbs, Header, CustomMenu } from "@plane/ui";
 // components
@@ -62,7 +61,7 @@ export const UserProfileHeader = observer(function UserProfileHeader(props: TUse
               <BreadcrumbLink
                 label={breadcrumbLabel}
                 disableTooltip
-                icon={<YourWorkIcon className="h-4 w-4 text-tertiary" />}
+                icon={<YourWorkOutline className="h-4 w-4 text-tertiary" />}
               />
             }
           />
@@ -78,7 +77,7 @@ export const UserProfileHeader = observer(function UserProfileHeader(props: TUse
             customButton={
               <div className="flex items-center gap-2 rounded-md border border-subtle px-2 py-1.5">
                 <span className="flex flex-grow justify-center text-13 text-secondary">{type}</span>
-                <ChevronDownIcon className="h-4 w-4 text-placeholder" />
+                <ChevronDownOutline className="h-4 w-4 text-placeholder" />
               </div>
             }
             customButtonClassName="flex flex-grow justify-center text-secondary text-13"
@@ -103,7 +102,7 @@ export const UserProfileHeader = observer(function UserProfileHeader(props: TUse
                 toggleProfileSidebar();
               }}
               appendIcon={
-                <PanelRight className={!profileSidebarCollapsed ? "text-accent-primary" : "text-secondary"} />
+                <RightSidePaneOutline className={!profileSidebarCollapsed ? "text-accent-primary" : "text-secondary"} />
               }
             ></Button>
           </div>
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx
index 0b9dded5ef2..fa8b73dbbf3 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/mobile-header.tsx
@@ -12,7 +12,7 @@ import { EIssueFilterType, ISSUE_LAYOUTS, ISSUE_DISPLAY_FILTERS_BY_PAGE } from "
 // plane i18n
 import { useTranslation } from "@plane/i18n";
 // icons
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 // types
 import type {
   IIssueDisplayFilterOptions,
@@ -92,7 +92,7 @@ export const ProfileIssuesMobileHeader = observer(function ProfileIssuesMobileHe
         customButton={
           <div className="flex-center flex text-13 text-secondary">
             {t("common.layout")}
-            <ChevronDownIcon className="my-auto ml-2 h-4 w-4 text-secondary" strokeWidth={2} />
+            <ChevronDownOutline className="my-auto ml-2 h-4 w-4 text-secondary" />
           </div>
         }
         customButtonClassName="flex flex-center text-secondary text-13"
@@ -121,7 +121,7 @@ export const ProfileIssuesMobileHeader = observer(function ProfileIssuesMobileHe
           menuButton={
             <div className="flex-center flex text-13 text-secondary">
               {t("common.display")}
-              <ChevronDownIcon className="ml-2 h-4 w-4 text-secondary" strokeWidth={2} />
+              <ChevronDownOutline className="ml-2 h-4 w-4 text-secondary" />
             </div>
           }
         >
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx
index ad9983b50ef..fcfdfe3b715 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/header.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ArchiveIcon, CycleIcon, ModuleIcon, WorkItemsIcon } from "@plane/propel/icons";
+import { ArchiveOutline, CyclesOutline, ModuleOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { EIssuesStoreType } from "@plane/types";
 // ui
@@ -35,17 +35,17 @@ const PROJECT_ARCHIVES_BREADCRUMB_LIST: {
   issues: {
     label: "Work items",
     href: "/issues",
-    icon: WorkItemsIcon,
+    icon: WorkItemsOutline,
   },
   cycles: {
     label: "Cycles",
     href: "/cycles",
-    icon: CycleIcon,
+    icon: CyclesOutline,
   },
   modules: {
     label: "Modules",
     href: "/modules",
-    icon: ModuleIcon,
+    icon: ModuleOutline,
   },
 };
 
@@ -78,7 +78,7 @@ export const ProjectArchivesHeader = observer(function ProjectArchivesHeader(pro
                 <BreadcrumbLink
                   href={`/${workspaceSlug}/projects/${projectId}/archives/issues`}
                   label="Archives"
-                  icon={<ArchiveIcon className="h-4 w-4 text-tertiary" />}
+                  icon={<ArchiveOutline className="h-4 w-4 text-tertiary" />}
                 />
               }
             />
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx
index 592bf09a50f..c9d7d890b48 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/[archivedIssueId]/page.tsx
@@ -10,7 +10,7 @@ import useSWR from "swr";
 // ui
 import { Banner } from "@plane/propel/banner";
 import { Button } from "@plane/propel/button";
-import { ArchiveIcon } from "@plane/propel/icons";
+import { ArchiveOutline } from "@makeplane/propel/icons";
 import { Loader } from "@plane/ui";
 // components
 import { PageHead } from "@/components/core/page-title";
@@ -70,7 +70,7 @@ function ArchivedIssueDetailsPage({ params }: Route.ComponentProps) {
           <Banner
             variant="warning"
             title="This work item has been archived. Visit the Archives section to restore it."
-            icon={<ArchiveIcon className="size-4" />}
+            icon={<ArchiveOutline className="size-4" />}
             action={
               <Button
                 variant="secondary"
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx
index 8fb15fe5acf..dca11117aca 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/archives/issues/(detail)/header.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
 // ui
-import { ArchiveIcon, WorkItemsIcon } from "@plane/propel/icons";
+import { ArchiveOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -47,7 +47,7 @@ export const ProjectArchivedIssueDetailsHeader = observer(function ProjectArchiv
               <BreadcrumbLink
                 href={`/${workspaceSlug}/projects/${projectId}/archives/issues`}
                 label="Archives"
-                icon={<ArchiveIcon className="h-4 w-4 text-tertiary" />}
+                icon={<ArchiveOutline className="h-4 w-4 text-tertiary" />}
               />
             }
           />
@@ -56,7 +56,7 @@ export const ProjectArchivedIssueDetailsHeader = observer(function ProjectArchiv
               <BreadcrumbLink
                 href={`/${workspaceSlug}/projects/${projectId}/archives/issues`}
                 label="Work items"
-                icon={<WorkItemsIcon className="h-4 w-4 text-tertiary" />}
+                icon={<WorkItemsOutline className="h-4 w-4 text-tertiary" />}
               />
             }
           />
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx
index 1ccb3331292..cb5425b95e3 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx
@@ -8,7 +8,7 @@ import { useCallback, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { ChartNoAxesColumn, PanelRight, SlidersHorizontal } from "lucide-react";
+import { BarOutline, CyclesOutline, PreferencesOutline, RightSidePaneOutline } from "@makeplane/propel/icons";
 // plane imports
 import {
   EIssueFilterType,
@@ -20,7 +20,6 @@ import { usePlatformOS } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { IconButton } from "@plane/propel/icon-button";
-import { CycleIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { ICustomSearchSelectOption, IIssueDisplayFilterOptions, IIssueDisplayProperties } from "@plane/types";
 import { EIssuesStoreType, EIssueLayoutTypes } from "@plane/types";
@@ -118,7 +117,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() {
       return {
         value: _cycle.id,
         query: _cycle.name,
-        content: <SwitcherLabel name={_cycle.name} LabelIcon={CycleIcon} />,
+        content: <SwitcherLabel name={_cycle.name} LabelIcon={CyclesOutline} />,
       };
     })
     .filter((option) => option !== undefined) as ICustomSearchSelectOption[];
@@ -143,7 +142,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() {
                   <BreadcrumbLink
                     label="Cycles"
                     href={`/${workspaceSlug}/projects/${projectId}/cycles/`}
-                    icon={<CycleIcon className="h-4 w-4 text-tertiary" />}
+                    icon={<CyclesOutline className="h-4 w-4 text-tertiary" />}
                   />
                 }
               />
@@ -158,7 +157,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() {
                     title={cycleDetails?.name}
                     icon={
                       <Breadcrumbs.Icon>
-                        <CycleIcon className="size-4 flex-shrink-0 text-tertiary" />
+                        <CyclesOutline className="size-4 flex-shrink-0 text-tertiary" />
                       </Breadcrumbs.Icon>
                     }
                     isLast
@@ -213,7 +212,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() {
             <FiltersDropdown
               title={t("common.display")}
               placement="bottom-end"
-              miniIcon={<SlidersHorizontal className="size-3.5" />}
+              miniIcon={<PreferencesOutline className="size-3.5" />}
             >
               <DisplayFiltersSelection
                 layoutDisplayFiltersOptions={
@@ -234,7 +233,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() {
                 <Button onClick={() => setAnalyticsModal(true)} variant="secondary" size="lg">
                   <span className="hidden @4xl:flex">Analytics</span>
                   <span className="@4xl:hidden">
-                    <ChartNoAxesColumn className="size-3.5" />
+                    <BarOutline className="size-3.5" />
                   </span>
                 </Button>
                 {!isCompletedCycle && (
@@ -253,7 +252,7 @@ export const CycleIssuesHeader = observer(function CycleIssuesHeader() {
             <IconButton
               variant="tertiary"
               size="lg"
-              icon={PanelRight}
+              icon={RightSidePaneOutline}
               onClick={toggleSidebar}
               className={cn({
                 "bg-accent-subtle text-accent-primary": !isSidebarCollapsed,
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx
index 56ef5ef3a85..4c005147128 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/mobile-header.tsx
@@ -10,7 +10,7 @@ import { useParams } from "next/navigation";
 // plane imports
 import { EIssueFilterType, ISSUE_LAYOUTS, ISSUE_DISPLAY_FILTERS_BY_PAGE } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CalendarLayoutIcon, BoardLayoutIcon, ListLayoutIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { BoardOutline, CalendarOutline, ChevronDownOutline, ListOutline } from "@makeplane/propel/icons";
 import type { IIssueDisplayFilterOptions, IIssueDisplayProperties, EIssueLayoutTypes } from "@plane/types";
 import { EIssuesStoreType } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
@@ -24,9 +24,9 @@ import { useIssues } from "@/hooks/store/use-issues";
 import { useProject } from "@/hooks/store/use-project";
 
 const SUPPORTED_LAYOUTS = [
-  { key: "list", titleTranslationKey: "issue.layouts.list", icon: ListLayoutIcon },
-  { key: "kanban", titleTranslationKey: "issue.layouts.kanban", icon: BoardLayoutIcon },
-  { key: "calendar", titleTranslationKey: "issue.layouts.calendar", icon: CalendarLayoutIcon },
+  { key: "list", titleTranslationKey: "issue.layouts.list", icon: ListOutline },
+  { key: "kanban", titleTranslationKey: "issue.layouts.kanban", icon: BoardOutline },
+  { key: "calendar", titleTranslationKey: "issue.layouts.calendar", icon: CalendarOutline },
 ];
 
 export const CycleIssuesMobileHeader = observer(function CycleIssuesMobileHeader() {
@@ -127,7 +127,7 @@ export const CycleIssuesMobileHeader = observer(function CycleIssuesMobileHeader
             menuButton={
               <span className="flex items-center text-13 text-secondary">
                 {t("common.display")}
-                <ChevronDownIcon className="ml-2 h-4 w-4 text-secondary" />
+                <ChevronDownOutline className="ml-2 h-4 w-4 text-secondary" />
               </span>
             }
           >
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx
index 5e757289535..2f871518ffe 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx
@@ -10,7 +10,7 @@ import { useParams } from "next/navigation";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CycleIcon } from "@plane/propel/icons";
+import { CyclesOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -49,7 +49,7 @@ export const CyclesListHeader = observer(function CyclesListHeader() {
               <BreadcrumbLink
                 label="Cycles"
                 href={`/${workspaceSlug}/projects/${currentProjectDetails?.id}/cycles/`}
-                icon={<CycleIcon className="h-4 w-4 text-tertiary" />}
+                icon={<CyclesOutline className="h-4 w-4 text-tertiary" />}
                 isLast
               />
             }
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx
index b5108be8100..6784458772b 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/mobile-header.tsx
@@ -8,7 +8,7 @@ import type React from "react";
 import { observer } from "mobx-react";
 // ui
 import type { ISvgIcons } from "@plane/propel/icons";
-import { TimelineLayoutIcon, GridLayoutIcon, ListLayoutIcon } from "@plane/propel/icons";
+import { GridOutline, ListOutline, TimelineOutline } from "@makeplane/propel/icons";
 // plane package imports
 import type { TCycleLayoutOptions } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
@@ -23,17 +23,17 @@ const CYCLE_VIEW_LAYOUTS: {
 }[] = [
   {
     key: "list",
-    icon: ListLayoutIcon,
+    icon: ListOutline,
     title: "List layout",
   },
   {
     key: "board",
-    icon: GridLayoutIcon,
+    icon: GridOutline,
     title: "Gallery layout",
   },
   {
     key: "gantt",
-    icon: TimelineLayoutIcon,
+    icon: TimelineOutline,
     title: "Timeline layout",
   },
 ];
@@ -50,7 +50,7 @@ export const CyclesListMobileHeader = observer(function CyclesListMobileHeader()
         // placement="bottom-start"
         customButton={
           <span className="flex items-center gap-2">
-            <ListLayoutIcon className="h-4 w-4" />
+            <ListOutline className="h-4 w-4" />
             <span className="flex flex-grow justify-center text-13 text-secondary">Layout</span>
           </span>
         }
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx
index dfe400d3bea..75916ac868d 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/issues/(list)/mobile-header.tsx
@@ -10,7 +10,7 @@ import { useParams } from "next/navigation";
 // plane imports
 import { EIssueFilterType, ISSUE_DISPLAY_FILTERS_BY_PAGE } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import type { IIssueDisplayFilterOptions, IIssueDisplayProperties } from "@plane/types";
 import { EIssuesStoreType, EIssueLayoutTypes } from "@plane/types";
 // components
@@ -80,7 +80,7 @@ export const ProjectIssuesMobileHeader = observer(function ProjectIssuesMobileHe
             menuButton={
               <span className="flex items-center text-13 text-secondary">
                 {t("common.display")}
-                <ChevronDownIcon className="ml-2 h-4 w-4 text-secondary" />
+                <ChevronDownOutline className="ml-2 h-4 w-4 text-secondary" />
               </span>
             }
           >
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx
index 8eed837e510..2a0e462c9c4 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx
@@ -8,7 +8,7 @@ import { useCallback, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { ChartNoAxesColumn, PanelRight, SlidersHorizontal } from "lucide-react";
+import { BarOutline, ModuleOutline, PreferencesOutline, RightSidePaneOutline } from "@makeplane/propel/icons";
 // plane imports
 import {
   EIssueFilterType,
@@ -17,7 +17,6 @@ import {
   EUserPermissionsLevel,
 } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { ModuleIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { ICustomSearchSelectOption, IIssueDisplayFilterOptions, IIssueDisplayProperties } from "@plane/types";
 import { EIssuesStoreType, EIssueLayoutTypes } from "@plane/types";
@@ -117,7 +116,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() {
       return {
         value: _module.id,
         query: _module.name,
-        content: <SwitcherLabel name={_module.name} LabelIcon={ModuleIcon} />,
+        content: <SwitcherLabel name={_module.name} LabelIcon={ModuleOutline} />,
       };
     })
     .filter((option) => option !== undefined) as ICustomSearchSelectOption[];
@@ -140,7 +139,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() {
                   <BreadcrumbLink
                     label="Modules"
                     href={`/${workspaceSlug}/projects/${projectId}/modules/`}
-                    icon={<ModuleIcon className="h-4 w-4 text-tertiary" />}
+                    icon={<ModuleOutline className="h-4 w-4 text-tertiary" />}
                     isLast
                   />
                 }
@@ -155,7 +154,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() {
                       router.push(`/${workspaceSlug}/projects/${projectId}/modules/${value}`);
                     }}
                     title={moduleDetails?.name}
-                    icon={<ModuleIcon className="size-3.5 flex-shrink-0 text-tertiary" />}
+                    icon={<ModuleOutline className="size-3.5 flex-shrink-0 text-tertiary" />}
                     isLast
                   />
                 }
@@ -207,7 +206,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() {
             <FiltersDropdown
               title="Display"
               placement="bottom-end"
-              miniIcon={<SlidersHorizontal className="size-3.5" />}
+              miniIcon={<PreferencesOutline className="size-3.5" />}
             >
               <DisplayFiltersSelection
                 layoutDisplayFiltersOptions={
@@ -229,7 +228,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() {
               <Button className="hidden md:block" onClick={() => setAnalyticsModal(true)} variant="secondary" size="lg">
                 <span className="hidden @4xl:flex">Analytics</span>
                 <span className="@4xl:hidden">
-                  <ChartNoAxesColumn className="size-3.5" />
+                  <BarOutline className="size-3.5" />
                 </span>
               </Button>
               <Button
@@ -249,7 +248,7 @@ export const ModuleIssuesHeader = observer(function ModuleIssuesHeader() {
           <IconButton
             variant="tertiary"
             size="lg"
-            icon={PanelRight}
+            icon={RightSidePaneOutline}
             onClick={toggleSidebar}
             className={cn({
               "bg-accent-subtle text-accent-primary": !isSidebarCollapsed,
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx
index 317a7b0775c..b6a5c670f88 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/mobile-header.tsx
@@ -10,7 +10,7 @@ import { useParams } from "next/navigation";
 // plane imports
 import { EIssueFilterType, ISSUE_LAYOUTS, ISSUE_DISPLAY_FILTERS_BY_PAGE } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CalendarLayoutIcon, BoardLayoutIcon, ListLayoutIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { BoardOutline, CalendarOutline, ChevronDownOutline, ListOutline } from "@makeplane/propel/icons";
 import type { IIssueDisplayFilterOptions, IIssueDisplayProperties, EIssueLayoutTypes } from "@plane/types";
 import { EIssuesStoreType } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
@@ -24,9 +24,9 @@ import { useModule } from "@/hooks/store/use-module";
 import { useProject } from "@/hooks/store/use-project";
 
 const SUPPORTED_LAYOUTS = [
-  { key: "list", i18n_title: "issue.layouts.list", icon: ListLayoutIcon },
-  { key: "kanban", i18n_title: "issue.layouts.kanban", icon: BoardLayoutIcon },
-  { key: "calendar", i18n_title: "issue.layouts.calendar", icon: CalendarLayoutIcon },
+  { key: "list", i18n_title: "issue.layouts.list", icon: ListOutline },
+  { key: "kanban", i18n_title: "issue.layouts.kanban", icon: BoardOutline },
+  { key: "calendar", i18n_title: "issue.layouts.calendar", icon: CalendarOutline },
 ];
 
 export const ModuleIssuesMobileHeader = observer(function ModuleIssuesMobileHeader() {
@@ -107,7 +107,7 @@ export const ModuleIssuesMobileHeader = observer(function ModuleIssuesMobileHead
             menuButton={
               <span className="flex items-center text-13 text-secondary">
                 Display
-                <ChevronDownIcon className="ml-2 h-4 w-4 text-secondary" />
+                <ChevronDownOutline className="ml-2 h-4 w-4 text-secondary" />
               </span>
             }
           >
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx
index e5497ed82a5..41d166695cd 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx
@@ -11,7 +11,7 @@ import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
 import { Button } from "@plane/propel/button";
-import { ModuleIcon } from "@plane/propel/icons";
+import { ModuleOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -53,7 +53,7 @@ export const ModulesListHeader = observer(function ModulesListHeader() {
                 <BreadcrumbLink
                   label="Modules"
                   href={`/${workspaceSlug}/projects/${projectId}/modules/`}
-                  icon={<ModuleIcon className="h-4 w-4 text-tertiary" />}
+                  icon={<ModuleOutline className="h-4 w-4 text-tertiary" />}
                   isLast
                 />
               }
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx
index a571f7c2d27..414579284e3 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/mobile-header.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 import { MODULE_VIEW_LAYOUTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import { CustomMenu, Row } from "@plane/ui";
 import { ModuleLayoutIcon } from "@/components/modules";
 import { useModuleFilter } from "@/hooks/store/use-module-filter";
@@ -26,7 +26,7 @@ export const ModulesListMobileHeader = observer(function ModulesListMobileHeader
         // placement="bottom-start"
         customButton={
           <Row className="flex flex-grow justify-center gap-2 text-13 text-secondary">
-            <span>Layout</span> <ChevronDownIcon className="my-auto h-4 w-4 text-secondary" strokeWidth={1} />
+            <span>Layout</span> <ChevronDownOutline className="my-auto h-4 w-4 text-secondary" />
           </Row>
         }
         customButtonClassName="flex flex-grow justify-center items-center text-secondary text-13"
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
index f43c36accc8..d005cfb009b 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/header.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
-import { PageIcon } from "@plane/propel/icons";
+import { PagesOutline } from "@makeplane/propel/icons";
 import type { ICustomSearchSelectOption } from "@plane/types";
 import { Breadcrumbs, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
 import { getPageName } from "@plane/utils";
@@ -52,7 +52,7 @@ export const PageDetailsHeader = observer(function PageDetailsHeader() {
         query: _page.name,
         content: (
           <div className="flex items-center justify-between gap-2">
-            <SwitcherLabel logo_props={_page.logo_props} name={getPageName(_page.name)} LabelIcon={PageIcon} />
+            <SwitcherLabel logo_props={_page.logo_props} name={getPageName(_page.name)} LabelIcon={PagesOutline} />
             <PageAccessIcon {..._page} />
           </div>
         ),
@@ -73,7 +73,7 @@ export const PageDetailsHeader = observer(function PageDetailsHeader() {
                 <BreadcrumbLink
                   label="Pages"
                   href={`/${workspaceSlug}/projects/${projectId}/pages/`}
-                  icon={<PageIcon className="h-4 w-4 text-tertiary" />}
+                  icon={<PagesOutline className="h-4 w-4 text-tertiary" />}
                 />
               }
             />
@@ -89,7 +89,7 @@ export const PageDetailsHeader = observer(function PageDetailsHeader() {
                   title={getPageName(page?.name)}
                   icon={
                     <Breadcrumbs.Icon>
-                      <SwitcherIcon logo_props={page.logo_props} LabelIcon={PageIcon} size={16} />
+                      <SwitcherIcon logo_props={page.logo_props} LabelIcon={PagesOutline} size={16} />
                     </Breadcrumbs.Icon>
                   }
                   isLast
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
index a26a539dd64..7105d1cd733 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx
@@ -11,7 +11,7 @@ import { useParams, useRouter, useSearchParams } from "next/navigation";
 import { EPageAccess } from "@plane/constants";
 // plane types
 import { Button } from "@plane/propel/button";
-import { PageIcon } from "@plane/propel/icons";
+import { PagesOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TPage } from "@plane/types";
 // plane ui
@@ -69,7 +69,7 @@ export const PagesListHeader = observer(function PagesListHeader() {
               <BreadcrumbLink
                 label="Pages"
                 href={`/${workspaceSlug}/projects/${currentProjectDetails?.id}/pages/`}
-                icon={<PageIcon className="h-4 w-4 text-tertiary" />}
+                icon={<PagesOutline className="h-4 w-4 text-tertiary" />}
                 isLast
               />
             }
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx
index dd08651290e..5db2b2fccd0 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx
@@ -16,7 +16,7 @@ import {
   EUserPermissionsLevel,
 } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { LockIcon, ViewsIcon } from "@plane/propel/icons";
+import { LockOutline, ViewsOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { ICustomSearchSelectOption, IIssueDisplayFilterOptions, IIssueDisplayProperties } from "@plane/types";
 import { EIssuesStoreType, EViewAccess, EIssueLayoutTypes } from "@plane/types";
@@ -114,7 +114,7 @@ export const ProjectViewIssuesHeader = observer(function ProjectViewIssuesHeader
       return {
         value: _view.id,
         query: _view.name,
-        content: <SwitcherLabel logo_props={_view.logo_props} name={_view.name} LabelIcon={ViewsIcon} />,
+        content: <SwitcherLabel logo_props={_view.logo_props} name={_view.name} LabelIcon={ViewsOutline} />,
       };
     })
     .filter((option) => option !== undefined) as ICustomSearchSelectOption[];
@@ -129,7 +129,7 @@ export const ProjectViewIssuesHeader = observer(function ProjectViewIssuesHeader
               <BreadcrumbLink
                 label="Views"
                 href={`/${workspaceSlug}/projects/${projectId}/views/`}
-                icon={<ViewsIcon className="h-4 w-4 text-tertiary" />}
+                icon={<ViewsOutline className="h-4 w-4 text-tertiary" />}
               />
             }
           />
@@ -144,7 +144,7 @@ export const ProjectViewIssuesHeader = observer(function ProjectViewIssuesHeader
                 title={viewDetails?.name}
                 icon={
                   <Breadcrumbs.Icon>
-                    <SwitcherIcon logo_props={viewDetails.logo_props} LabelIcon={ViewsIcon} size={16} />
+                    <SwitcherIcon logo_props={viewDetails.logo_props} LabelIcon={ViewsOutline} size={16} />
                   </Breadcrumbs.Icon>
                 }
                 isLast
@@ -156,7 +156,7 @@ export const ProjectViewIssuesHeader = observer(function ProjectViewIssuesHeader
         {viewDetails?.access === EViewAccess.PRIVATE ? (
           <div className="cursor-default text-tertiary">
             <Tooltip label={"Private"}>
-              <LockIcon className="h-4 w-4" />
+              <LockOutline className="h-4 w-4" />
             </Tooltip>
           </div>
         ) : (
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx
index 97339cf30de..a4304aab663 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // ui
 import { Button } from "@plane/propel/button";
-import { ViewsIcon } from "@plane/propel/icons";
+import { ViewsOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -36,7 +36,7 @@ export const ProjectViewsHeader = observer(function ProjectViewsHeader() {
                 <BreadcrumbLink
                   label="Views"
                   href={`/${workspaceSlug}/projects/${projectId}/views/`}
-                  icon={<ViewsIcon className="h-4 w-4 text-tertiary" />}
+                  icon={<ViewsOutline className="h-4 w-4 text-tertiary" />}
                   isLast
                 />
               }
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx
index 73e5f722bae..bbe4d131aad 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/mobile-header.tsx
@@ -6,8 +6,7 @@
 
 import { observer } from "mobx-react";
 // icons
-import { ListFilter } from "lucide-react";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, FilterOutline } from "@makeplane/propel/icons";
 // components
 import { Row } from "@plane/ui";
 import { FiltersDropdown } from "@/components/issues/issue-layouts/filters";
@@ -40,14 +39,14 @@ export const ViewMobileHeader = observer(function ViewMobileHeader() {
         </Row>
         <div className="flex flex-grow items-center justify-center border-l border-subtle text-13 text-secondary">
           <FiltersDropdown
-            icon={<ListFilter className="h-3 w-3" />}
+            icon={<FilterOutline className="h-3 w-3" />}
             title="Filters"
             placement="bottom-end"
             isFiltersApplied={false}
             menuButton={
               <Row className="flex items-center text-13 text-secondary">
                 Filters
-                <ChevronDownIcon className="ml-2 h-4 w-4 text-secondary" strokeWidth={2} />
+                <ChevronDownOutline className="ml-2 h-4 w-4 text-secondary" />
               </Row>
             }
           >
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx
index 7eab6a4a7fc..aef45ee768b 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
 import { Button } from "@plane/propel/button";
-import { RecentStickyIcon } from "@plane/propel/icons";
+import { MultipleStickyOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -33,7 +33,7 @@ export const WorkspaceStickyHeader = observer(function WorkspaceStickyHeader() {
                 component={
                   <BreadcrumbLink
                     label={`Stickies`}
-                    icon={<RecentStickyIcon className="size-5 rotate-90 text-secondary" />}
+                    icon={<MultipleStickyOutline className="size-5 rotate-90 text-secondary" />}
                   />
                 }
               />
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx
index f4fdddc4ed8..c852b4d535c 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx
@@ -11,7 +11,7 @@ import { useParams } from "next/navigation";
 import { EIssueFilterType, ISSUE_DISPLAY_FILTERS_BY_PAGE, DEFAULT_GLOBAL_VIEWS_LIST } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { ViewsIcon } from "@plane/propel/icons";
+import { ViewsOutline } from "@makeplane/propel/icons";
 import type { IIssueDisplayFilterOptions, IIssueDisplayProperties, ICustomSearchSelectOption } from "@plane/types";
 import { EIssuesStoreType, EIssueLayoutTypes } from "@plane/types";
 import { Breadcrumbs, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
@@ -78,7 +78,7 @@ export const GlobalIssuesHeader = observer(function GlobalIssuesHeader() {
   const defaultOptions = DEFAULT_GLOBAL_VIEWS_LIST.map((view) => ({
     value: view.key,
     query: view.key,
-    content: <SwitcherLabel name={t(view.i18n_label)} LabelIcon={ViewsIcon} />,
+    content: <SwitcherLabel name={t(view.i18n_label)} LabelIcon={ViewsOutline} />,
   }));
 
   const workspaceOptions = (currentWorkspaceViews || []).map((view) => {
@@ -87,7 +87,7 @@ export const GlobalIssuesHeader = observer(function GlobalIssuesHeader() {
     return {
       value: _view.id,
       query: _view.name,
-      content: <SwitcherLabel name={_view.name} LabelIcon={ViewsIcon} />,
+      content: <SwitcherLabel name={_view.name} LabelIcon={ViewsOutline} />,
     };
   });
 
@@ -106,7 +106,9 @@ export const GlobalIssuesHeader = observer(function GlobalIssuesHeader() {
         <Header.LeftItem>
           <Breadcrumbs>
             <Breadcrumbs.Item
-              component={<BreadcrumbLink label={t("views")} icon={<ViewsIcon className="h-4 w-4 text-tertiary" />} />}
+              component={
+                <BreadcrumbLink label={t("views")} icon={<ViewsOutline className="h-4 w-4 text-tertiary" />} />
+              }
             />
             <Breadcrumbs.Item
               component={
@@ -119,7 +121,7 @@ export const GlobalIssuesHeader = observer(function GlobalIssuesHeader() {
                   title={viewDetails?.name ?? t(defaultViewDetails?.i18n_label ?? "")}
                   icon={
                     <Breadcrumbs.Icon>
-                      <ViewsIcon className="size-4 flex-shrink-0 text-tertiary" />
+                      <ViewsOutline className="size-4 flex-shrink-0 text-tertiary" />
                     </Breadcrumbs.Icon>
                   }
                   isLast
diff --git a/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/page.tsx
index ca468e2d3cf..eeaee139993 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/page.tsx
@@ -10,7 +10,7 @@ import { observer } from "mobx-react";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { DEFAULT_GLOBAL_VIEWS_LIST } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon } from "@plane/propel/icons";
+import { SearchOutline } from "@makeplane/propel/icons";
 
 // components
 import { PageHead } from "@/components/core/page-title";
@@ -33,7 +33,7 @@ function WorkspaceViewsPage() {
       <div className="flex h-full w-full flex-col overflow-hidden">
         <div className="flex h-11 w-full items-center overflow-hidden border-b border-subtle px-5 py-3">
           <InputGroup size="2xl">
-            <SearchIcon className="text-secondary" width={14} height={14} strokeWidth={2} />
+            <SearchOutline className="text-secondary" width={14} height={14} />
             <Input
               size="2xl"
               value={query}
diff --git a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx
index 0c7ea4e12a8..142f7b31c04 100644
--- a/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx
+++ b/apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx
@@ -10,7 +10,7 @@ import { observer } from "mobx-react";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { SearchIcon } from "@plane/propel/icons";
+import { SearchOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { IWorkspaceBulkInviteFormData } from "@plane/types";
 import { cn } from "@plane/utils";
@@ -120,7 +120,7 @@ const WorkspaceMembersSettingsPage = observer(function WorkspaceMembersSettingsP
           </h4>
           <div className="flex items-center gap-2">
             <div className="flex items-center gap-1.5 rounded-md border border-subtle bg-surface-1 px-2.5 py-1.5">
-              <SearchIcon className="h-3.5 w-3.5 text-placeholder" />
+              <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
               <input
                 className="w-full max-w-[234px] border-none bg-transparent text-body-xs-regular outline-none placeholder:text-placeholder"
                 placeholder={`${t("search")}...`}
diff --git a/apps/web/app/(all)/invitations/page.tsx b/apps/web/app/(all)/invitations/page.tsx
index 0da54f0a888..f325f27ebd1 100644
--- a/apps/web/app/(all)/invitations/page.tsx
+++ b/apps/web/app/(all)/invitations/page.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import Link from "next/link";
 
 import useSWR, { mutate } from "swr";
-import { CheckCircle2 } from "lucide-react";
+import { TickCircleOutline } from "@makeplane/propel/icons";
 // plane imports
 import { ROLE } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -153,7 +153,7 @@ function UserInvitationsPage() {
                           <p className="text-11 text-secondary">{ROLE[invitation.role]}</p>
                         </div>
                         <span className={`flex-shrink-0 ${isSelected ? "text-accent-primary" : "text-secondary"}`}>
-                          <CheckCircle2 className="h-5 w-5" />
+                          <TickCircleOutline className="h-5 w-5" />
                         </span>
                       </div>
                     );
diff --git a/apps/web/app/(all)/workspace-invitations/page.tsx b/apps/web/app/(all)/workspace-invitations/page.tsx
index d6267d1888c..d7e580e86fc 100644
--- a/apps/web/app/(all)/workspace-invitations/page.tsx
+++ b/apps/web/app/(all)/workspace-invitations/page.tsx
@@ -7,8 +7,14 @@
 import { observer } from "mobx-react";
 import { useSearchParams } from "next/navigation";
 import useSWR from "swr";
-import { Boxes, Share2, Star, User2 } from "lucide-react";
-import { CheckIcon, CloseIcon } from "@plane/propel/icons";
+import {
+  BoxesOutline,
+  CloseOutline,
+  ShareAltOutline,
+  StarOutline,
+  TickOutline,
+  UserOutline,
+} from "@makeplane/propel/icons";
 // components
 import { LogoSpinner } from "@/components/common/logo-spinner";
 import { EmptySpace, EmptySpaceItem } from "@/components/ui/empty-space";
@@ -88,8 +94,8 @@ function WorkspaceInvitationPage() {
               title={`You have been invited to ${invitationDetail.workspace.name}`}
               description="Your workspace is where you'll create projects, collaborate on your work items, and organize different streams of work in your Plane account."
             >
-              <EmptySpaceItem Icon={CheckIcon} title="Accept" action={handleAccept} />
-              <EmptySpaceItem Icon={CloseIcon} title="Ignore" action={handleReject} />
+              <EmptySpaceItem Icon={TickOutline} title="Accept" action={handleAccept} />
+              <EmptySpaceItem Icon={CloseOutline} title="Ignore" action={handleReject} />
             </EmptySpace>
           )
         ) : error || invitationDetail?.responded_at ? (
@@ -98,7 +104,7 @@ function WorkspaceInvitationPage() {
               title={`You are already a member of ${invitationDetail.workspace.name}`}
               description="Your workspace is where you'll create projects, collaborate on your work items, and organize different streams of work in your Plane account."
             >
-              <EmptySpaceItem Icon={Boxes} title="Continue to home" href="/" />
+              <EmptySpaceItem Icon={BoxesOutline} title="Continue to home" href="/" />
             </EmptySpace>
           ) : (
             <EmptySpace
@@ -107,13 +113,13 @@ function WorkspaceInvitationPage() {
               link={{ text: "Or start from an empty project", href: "/" }}
             >
               {!currentUser ? (
-                <EmptySpaceItem Icon={User2} title="Sign in to continue" href="/" />
+                <EmptySpaceItem Icon={UserOutline} title="Sign in to continue" href="/" />
               ) : (
-                <EmptySpaceItem Icon={Boxes} title="Continue to home" href="/" />
+                <EmptySpaceItem Icon={BoxesOutline} title="Continue to home" href="/" />
               )}
-              <EmptySpaceItem Icon={Star} title="Star us on GitHub" href="https://github.com/makeplane" />
+              <EmptySpaceItem Icon={StarOutline} title="Star us on GitHub" href="https://github.com/makeplane" />
               <EmptySpaceItem
-                Icon={Share2}
+                Icon={ShareAltOutline}
                 title="Join our community of active creators"
                 href="https://forum.plane.so"
               />
diff --git a/apps/web/app/error/dev.tsx b/apps/web/app/error/dev.tsx
index 0269dcbdcb1..ca49d0189ad 100644
--- a/apps/web/app/error/dev.tsx
+++ b/apps/web/app/error/dev.tsx
@@ -9,7 +9,7 @@ import { isRouteErrorResponse } from "react-router";
 import { Banner } from "@plane/propel/banner";
 import { Button } from "@plane/propel/button";
 import { Card, ECardVariant } from "@plane/propel/card";
-import { InfoFillIcon } from "@plane/propel/icons";
+import { InfoFilled } from "@makeplane/propel/icons";
 
 interface ErrorActionsProps {
   onGoHome: () => void;
@@ -44,7 +44,7 @@ export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorCompone
         <div className="mt-12 w-full max-w-4xl space-y-4 transition-none">
           <Banner
             variant="error"
-            icon={<InfoFillIcon className="size-5" />}
+            icon={<InfoFilled className="size-5" />}
             title="Route Error Response"
             animationDuration={0}
           />
@@ -79,7 +79,7 @@ export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorCompone
         <div className="mt-12 w-full max-w-4xl space-y-4 transition-none">
           <Banner
             variant="error"
-            icon={<InfoFillIcon className="size-5" />}
+            icon={<InfoFilled className="size-5" />}
             title="Runtime Error"
             animationDuration={0}
           />
@@ -114,7 +114,7 @@ export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorCompone
 
           <Card variant={ECardVariant.WITHOUT_SHADOW} className="bg-layer-1 !p-4 transition-none">
             <div className="flex items-start gap-3">
-              <InfoFillIcon className="mt-0.5 size-5 flex-shrink-0 text-tertiary" />
+              <InfoFilled className="mt-0.5 size-5 flex-shrink-0 text-tertiary" />
               <div className="space-y-1">
                 <p className="text-13 font-medium text-secondary">Development Mode</p>
                 <p className="text-11 text-tertiary">
@@ -132,12 +132,7 @@ export function DevErrorComponent({ error, onGoHome, onReload }: DevErrorCompone
   return (
     <div className="flex min-h-screen items-start justify-center bg-surface-2 p-6 transition-none">
       <div className="mt-12 w-full max-w-4xl space-y-4 transition-none">
-        <Banner
-          variant="error"
-          icon={<InfoFillIcon className="size-5" />}
-          title="Unknown Error"
-          animationDuration={0}
-        />
+        <Banner variant="error" icon={<InfoFilled className="size-5" />} title="Unknown Error" animationDuration={0} />
 
         <Card variant={ECardVariant.WITH_SHADOW} className="!p-6">
           <div className="space-y-4">
diff --git a/apps/web/core/components/account/auth-forms/auth-banner.tsx b/apps/web/core/components/account/auth-forms/auth-banner.tsx
index 1cd0520b3d1..dd29a1f85a0 100644
--- a/apps/web/core/components/account/auth-forms/auth-banner.tsx
+++ b/apps/web/core/components/account/auth-forms/auth-banner.tsx
@@ -4,10 +4,9 @@
  * See the LICENSE file for details.
  */
 
-import { Info } from "lucide-react";
+import { CloseOutline, InfoOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
 // helpers
 import type React from "react";
 
@@ -28,7 +27,7 @@ export function AuthBanner(props: TAuthBanner) {
       className="relative flex items-center gap-2 rounded-md border border-accent-strong/50 bg-accent-primary/10 p-2"
     >
       <div className="grid size-4 flex-shrink-0 place-items-center">
-        <Info size={16} className="text-accent-primary" />
+        <InfoOutline width={16} height={16} className="text-accent-primary" />
       </div>
       <p className="w-full text-13 font-medium text-accent-primary">{message}</p>
       <button
@@ -37,7 +36,7 @@ export function AuthBanner(props: TAuthBanner) {
         onClick={() => handleBannerData?.(undefined)}
         aria-label={t("aria_labels.auth_forms.close_alert")}
       >
-        <CloseIcon className="size-4" />
+        <CloseOutline className="size-4" />
       </button>
     </div>
   );
diff --git a/apps/web/core/components/account/auth-forms/email.tsx b/apps/web/core/components/account/auth-forms/email.tsx
index 7bf76ca0ef2..0fb17c2d8b6 100644
--- a/apps/web/core/components/account/auth-forms/email.tsx
+++ b/apps/web/core/components/account/auth-forms/email.tsx
@@ -8,7 +8,7 @@ import type { FormEvent } from "react";
 import { useMemo, useRef, useState } from "react";
 import { observer } from "mobx-react";
 // icons
-import { CircleAlert, XCircle } from "lucide-react";
+import { CloseCircleOutline, WarningCircleOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -89,14 +89,14 @@ export const AuthEmailForm = observer(function AuthEmailForm(props: TAuthEmailFo
                 aria-label={t("aria_labels.auth_forms.clear_email")}
                 tabIndex={-1}
               >
-                <XCircle className="size-5 stroke-placeholder" />
+                <CloseCircleOutline className="size-5 text-placeholder" />
               </button>
             )}
           </InputGroup>
         </Field>
         {emailError?.email && !isFocused && (
           <p className="flex items-center gap-1 px-0.5 text-11 text-danger-primary">
-            <CircleAlert height={12} width={12} />
+            <WarningCircleOutline height={12} width={12} />
             {t(emailError.email)}
           </p>
         )}
diff --git a/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx b/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx
index 8b8e640c434..865e0342efa 100644
--- a/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx
+++ b/apps/web/core/components/account/auth-forms/forgot-password-popover.tsx
@@ -9,7 +9,7 @@ import { usePopper } from "react-popper";
 import { Popover } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 
 export function ForgotPasswordPopover() {
   // popper-js refs
@@ -57,7 +57,7 @@ export function ForgotPasswordPopover() {
               onClick={() => close()}
               aria-label={t("aria_labels.auth_forms.close_popover")}
             >
-              <CloseIcon className="size-3 text-secondary" />
+              <CloseOutline className="size-3 text-secondary" />
             </button>
           </div>
         )}
diff --git a/apps/web/core/components/account/auth-forms/forgot-password.tsx b/apps/web/core/components/account/auth-forms/forgot-password.tsx
index 8054944987f..71ad47169f0 100644
--- a/apps/web/core/components/account/auth-forms/forgot-password.tsx
+++ b/apps/web/core/components/account/auth-forms/forgot-password.tsx
@@ -9,7 +9,7 @@ import Link from "next/link";
 import { useSearchParams } from "next/navigation";
 import { Controller, useForm } from "react-hook-form";
 // icons
-import { CircleCheck } from "lucide-react";
+import { TickCircleOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -116,7 +116,7 @@ export const ForgotPasswordForm = observer(function ForgotPasswordForm() {
           />
           {resendTimerCode > 0 && (
             <p className="flex w-full items-start gap-1 px-1 text-11 font-medium text-success-primary">
-              <CircleCheck height={12} width={12} className="mt-0.5" />
+              <TickCircleOutline height={12} width={12} className="mt-0.5" />
               {t("auth.forgot_password.email_sent")}
             </p>
           )}
diff --git a/apps/web/core/components/account/auth-forms/password.tsx b/apps/web/core/components/account/auth-forms/password.tsx
index c98ffff3410..0c2c93ab80b 100644
--- a/apps/web/core/components/account/auth-forms/password.tsx
+++ b/apps/web/core/components/account/auth-forms/password.tsx
@@ -8,13 +8,12 @@ import { useEffect, useMemo, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
 // icons
-import { Eye, EyeOff, Info, XCircle } from "lucide-react";
+import { CloseCircleOutline, CloseOutline, HideOutline, InfoOutline, ShowOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { API_BASE_URL, E_PASSWORD_STRENGTH } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CloseIcon } from "@plane/propel/icons";
 import { PasswordStrengthIndicator, Spinner } from "@plane/ui";
 import { getPasswordStrength } from "@plane/utils";
 // components
@@ -130,7 +129,7 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
       {isBannerMessage && mode === EAuthModes.SIGN_UP && (
         <div className="relative flex items-center gap-2 rounded-md border border-danger-strong/50 bg-danger-subtle p-2">
           <div className="relative flex h-4 w-4 shrink-0 items-center justify-center">
-            <Info size={16} className="text-danger-primary" />
+            <InfoOutline width={16} height={16} className="text-danger-primary" />
           </div>
           <div className="w-full text-13 font-medium text-danger-primary">
             {t("auth.sign_up.errors.password.strength")}
@@ -140,7 +139,7 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
             className="relative ml-auto flex h-6 w-6 cursor-pointer items-center justify-center rounded-xs text-accent-primary/80 transition-all hover:bg-danger-subtle-hover"
             onClick={() => setBannerMessage(false)}
           >
-            <CloseIcon className="h-4 w-4 shrink-0 text-danger-primary" />
+            <CloseOutline className="h-4 w-4 shrink-0 text-danger-primary" />
           </button>
         </div>
       )}
@@ -192,7 +191,7 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
                 onClick={handleEmailClear}
                 aria-label={t("aria_labels.auth_forms.clear_email")}
               >
-                <XCircle className="size-5 stroke-placeholder" />
+                <CloseCircleOutline className="size-5 text-placeholder" />
               </button>
             )}
           </InputGroup>
@@ -225,9 +224,9 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
               )}
             >
               {showPassword?.password ? (
-                <EyeOff className="size-5 stroke-placeholder" />
+                <HideOutline className="size-5 text-placeholder" />
               ) : (
-                <Eye className="size-5 stroke-placeholder" />
+                <ShowOutline className="size-5 text-placeholder" />
               )}
             </button>
           </InputGroup>
@@ -263,9 +262,9 @@ export const AuthPasswordForm = observer(function AuthPasswordForm(props: Props)
                 onClick={() => handleShowPassword("retypePassword")}
               >
                 {showPassword?.retypePassword ? (
-                  <EyeOff className="size-5 stroke-placeholder" />
+                  <HideOutline className="size-5 text-placeholder" />
                 ) : (
-                  <Eye className="size-5 stroke-placeholder" />
+                  <ShowOutline className="size-5 text-placeholder" />
                 )}
               </button>
             </InputGroup>
diff --git a/apps/web/core/components/account/auth-forms/reset-password.tsx b/apps/web/core/components/account/auth-forms/reset-password.tsx
index 1e8f1c92082..fde9e2f721d 100644
--- a/apps/web/core/components/account/auth-forms/reset-password.tsx
+++ b/apps/web/core/components/account/auth-forms/reset-password.tsx
@@ -8,7 +8,7 @@ import { useEffect, useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useSearchParams } from "next/navigation";
 // icons
-import { Eye, EyeOff } from "lucide-react";
+import { HideOutline, ShowOutline } from "@makeplane/propel/icons";
 // ui
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { API_BASE_URL, E_PASSWORD_STRENGTH } from "@plane/constants";
@@ -153,9 +153,9 @@ export const ResetPasswordForm = observer(function ResetPasswordForm() {
               className="grid size-5 place-items-center"
             >
               {showPassword.password ? (
-                <EyeOff className="size-5 stroke-placeholder" />
+                <HideOutline className="size-5 text-placeholder" />
               ) : (
-                <Eye className="size-5 stroke-placeholder" />
+                <ShowOutline className="size-5 text-placeholder" />
               )}
             </button>
           </InputGroup>
@@ -184,9 +184,9 @@ export const ResetPasswordForm = observer(function ResetPasswordForm() {
               className="grid size-5 place-items-center"
             >
               {showPassword.retypePassword ? (
-                <EyeOff className="size-5 stroke-placeholder" />
+                <HideOutline className="size-5 text-placeholder" />
               ) : (
-                <Eye className="size-5 stroke-placeholder" />
+                <ShowOutline className="size-5 text-placeholder" />
               )}
             </button>
           </InputGroup>
diff --git a/apps/web/core/components/account/auth-forms/set-password.tsx b/apps/web/core/components/account/auth-forms/set-password.tsx
index 4863a027185..044d9b084d5 100644
--- a/apps/web/core/components/account/auth-forms/set-password.tsx
+++ b/apps/web/core/components/account/auth-forms/set-password.tsx
@@ -9,7 +9,7 @@ import { useEffect, useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useSearchParams } from "next/navigation";
 // icons
-import { Eye, EyeOff } from "lucide-react";
+import { HideOutline, ShowOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { E_PASSWORD_STRENGTH } from "@plane/constants";
@@ -156,9 +156,9 @@ export const SetPasswordForm = observer(function SetPasswordForm() {
               className="grid size-5 place-items-center"
             >
               {showPassword.password ? (
-                <EyeOff className="size-5 stroke-placeholder" />
+                <HideOutline className="size-5 text-placeholder" />
               ) : (
-                <Eye className="size-5 stroke-placeholder" />
+                <ShowOutline className="size-5 text-placeholder" />
               )}
             </button>
           </InputGroup>
@@ -187,9 +187,9 @@ export const SetPasswordForm = observer(function SetPasswordForm() {
               className="grid size-5 place-items-center"
             >
               {showPassword.retypePassword ? (
-                <EyeOff className="size-5 stroke-placeholder" />
+                <HideOutline className="size-5 text-placeholder" />
               ) : (
-                <Eye className="size-5 stroke-placeholder" />
+                <ShowOutline className="size-5 text-placeholder" />
               )}
             </button>
           </InputGroup>
diff --git a/apps/web/core/components/account/auth-forms/unique-code.tsx b/apps/web/core/components/account/auth-forms/unique-code.tsx
index 832b98facd1..d3a4569d5c1 100644
--- a/apps/web/core/components/account/auth-forms/unique-code.tsx
+++ b/apps/web/core/components/account/auth-forms/unique-code.tsx
@@ -5,7 +5,7 @@
  */
 
 import { useEffect, useState } from "react";
-import { CircleCheck, XCircle } from "lucide-react";
+import { CloseCircleOutline, TickCircleOutline } from "@makeplane/propel/icons";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { API_BASE_URL } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -118,7 +118,7 @@ export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {
               aria-label={t("aria_labels.auth_forms.clear_email")}
               onClick={handleEmailClear}
             >
-              <XCircle className="size-5 stroke-placeholder" />
+              <CloseCircleOutline className="size-5 text-placeholder" />
             </button>
           )}
         </InputGroup>
@@ -142,7 +142,7 @@ export function AuthUniqueCodeForm(props: TAuthUniqueCodeForm) {
         </InputGroup>
         <div className="flex w-full items-center justify-between px-1 pt-1 text-11">
           <p className="flex items-center gap-1 font-medium text-success-primary">
-            <CircleCheck height={12} width={12} />
+            <TickCircleOutline height={12} width={12} />
             {t("auth.common.unique_code.paste_code")}
           </p>
           <button
diff --git a/apps/web/core/components/account/deactivate-account-modal.tsx b/apps/web/core/components/account/deactivate-account-modal.tsx
index f4dba2a81c7..ed18aba5947 100644
--- a/apps/web/core/components/account/deactivate-account-modal.tsx
+++ b/apps/web/core/components/account/deactivate-account-modal.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
 import { useTranslation } from "@plane/i18n";
 // ui
 import { Button } from "@plane/propel/button";
-import { TrashIcon } from "@plane/propel/icons";
+import { DeleteOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
 // hooks
@@ -66,7 +66,7 @@ export function DeactivateAccountModal(props: Props) {
         <div className="">
           <div className="flex items-start gap-x-4">
             <div className="mt-3 grid place-items-center rounded-full bg-danger-subtle p-2 sm:mt-3 sm:p-2 md:mt-0 md:p-4 lg:mt-0 lg:p-4">
-              <TrashIcon
+              <DeleteOutline
                 className="h-4 w-4 text-danger-primary sm:h-4 sm:w-4 md:h-6 md:w-6 lg:h-6 lg:w-6"
                 aria-hidden="true"
               />
diff --git a/apps/web/core/components/active-cycles/workspace-active-cycles-upgrade.tsx b/apps/web/core/components/active-cycles/workspace-active-cycles-upgrade.tsx
index ff1ee254394..6977d894c00 100644
--- a/apps/web/core/components/active-cycles/workspace-active-cycles-upgrade.tsx
+++ b/apps/web/core/components/active-cycles/workspace-active-cycles-upgrade.tsx
@@ -5,12 +5,12 @@
  */
 
 import { observer } from "mobx-react";
-import { AlertOctagon, BarChart4, CircleDashed, Folder, Microscope } from "lucide-react";
+import { CircleDashed, Microscope } from "lucide-react";
+import { AlertOctagonOutline, BarOutline, FolderOutline, SearchOutline } from "@makeplane/propel/icons";
 // plane imports
 import { MARKETING_PRICING_PAGE_LINK } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { getButtonStyling } from "@plane/propel/button";
-import { SearchIcon } from "@plane/propel/icons";
 import { ContentWrapper } from "@plane/ui";
 import { cn } from "@plane/utils";
 // assets
@@ -31,7 +31,7 @@ export const WORKSPACE_ACTIVE_CYCLES_DETAILS = [
     title: "10,000-feet view of all active cycles.",
     description:
       "Zoom out to see running cycles across all your projects at once instead of going from Cycle to Cycle in each project.",
-    icon: Folder,
+    icon: FolderOutline,
   },
   {
     key: "get_snapshot_of_each_active_cycle",
@@ -44,20 +44,20 @@ export const WORKSPACE_ACTIVE_CYCLES_DETAILS = [
     key: "compare_burndowns",
     title: "Compare burndowns.",
     description: "Monitor how each of your teams are performing with a peek into each cycle’s burndown report.",
-    icon: BarChart4,
+    icon: BarOutline,
   },
   {
     key: "quickly_see_make_or_break_issues",
     title: "Quickly see make-or-break work items. ",
     description:
       "Preview high-priority work items for each cycle against due dates. See all of them per cycle in one click.",
-    icon: AlertOctagon,
+    icon: AlertOctagonOutline,
   },
   {
     key: "zoom_into_cycles_that_need_attention",
     title: "Zoom into cycles that need attention. ",
     description: "Investigate the state of any cycle that doesn’t conform to expectations in one click.",
-    icon: SearchIcon,
+    icon: SearchOutline,
   },
   {
     key: "stay_ahead_of_blockers",
diff --git a/apps/web/core/components/analytics/insight-table/data-table.tsx b/apps/web/core/components/analytics/insight-table/data-table.tsx
index a0f5213a693..679e98afd74 100644
--- a/apps/web/core/components/analytics/insight-table/data-table.tsx
+++ b/apps/web/core/components/analytics/insight-table/data-table.tsx
@@ -24,7 +24,7 @@ import {
 
 import { useTranslation } from "@plane/i18n";
 import { EmptyStateCompact } from "@plane/propel/empty-state";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 // plane package imports
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@plane/propel/table";
 import { cn } from "@plane/utils";
@@ -82,7 +82,7 @@ export function DataTable<TData, TValue>({ columns, data, searchPlaceholder, act
                 inputRef.current?.focus();
               }}
             >
-              <SearchIcon className="h-3.5 w-3.5" />
+              <SearchOutline className="h-3.5 w-3.5" />
             </button>
           )}
           <div
@@ -93,7 +93,7 @@ export function DataTable<TData, TValue>({ columns, data, searchPlaceholder, act
               }
             )}
           >
-            <SearchIcon className="h-3.5 w-3.5" />
+            <SearchOutline className="h-3.5 w-3.5" />
             <input
               ref={inputRef}
               className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -121,7 +121,7 @@ export function DataTable<TData, TValue>({ columns, data, searchPlaceholder, act
                   setIsSearchOpen(false);
                 }}
               >
-                <CloseIcon className="h-3 w-3" />
+                <CloseOutline className="h-3 w-3" />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/analytics/insight-table/root.tsx b/apps/web/core/components/analytics/insight-table/root.tsx
index 9607d6e9582..4a368be04b7 100644
--- a/apps/web/core/components/analytics/insight-table/root.tsx
+++ b/apps/web/core/components/analytics/insight-table/root.tsx
@@ -5,7 +5,7 @@
  */
 
 import type { ColumnDef, Row, Table } from "@tanstack/react-table";
-import { Download } from "lucide-react";
+import { DownloadOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import type { AnalyticsTableDataMap, TAnalyticsTabsBase } from "@plane/types";
@@ -39,7 +39,7 @@ export function InsightTable<T extends Exclude<TAnalyticsTabsBase, "overview">>(
         actions={(table: Table<AnalyticsTableDataMap[T]>) => (
           <Button
             variant="secondary"
-            prependIcon={<Download className="h-3.5 w-3.5" />}
+            prependIcon={<DownloadOutline className="h-3.5 w-3.5" />}
             onClick={() => onExport?.(table.getFilteredRowModel().rows)}
           >
             <div>{t("exporter.csv.short_description")}</div>
diff --git a/apps/web/core/components/analytics/overview/active-project-item.tsx b/apps/web/core/components/analytics/overview/active-project-item.tsx
index ef9f5da4347..14e97fd0faa 100644
--- a/apps/web/core/components/analytics/overview/active-project-item.tsx
+++ b/apps/web/core/components/analytics/overview/active-project-item.tsx
@@ -6,7 +6,7 @@
 
 // plane package imports
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { ProjectIcon } from "@plane/propel/icons";
+import { ProjectsOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { cn } from "@plane/utils";
 // plane web hooks
@@ -49,7 +49,7 @@ function ActiveProjectItem(props: Props) {
               <Logo logo={projectDetails?.logo_props} size={16} />
             ) : (
               <span className="grid h-4 w-4 flex-shrink-0 place-items-center">
-                <ProjectIcon className="h-4 w-4" />
+                <ProjectsOutline className="h-4 w-4" />
               </span>
             )}
           </span>
diff --git a/apps/web/core/components/analytics/select/analytics-params.tsx b/apps/web/core/components/analytics/select/analytics-params.tsx
index a577002b7c2..0f266fb7af2 100644
--- a/apps/web/core/components/analytics/select/analytics-params.tsx
+++ b/apps/web/core/components/analytics/select/analytics-params.tsx
@@ -8,10 +8,9 @@ import { useMemo } from "react";
 import { observer } from "mobx-react";
 import type { Control, UseFormSetValue } from "react-hook-form";
 import { Controller } from "react-hook-form";
-import { SlidersHorizontal } from "lucide-react";
+import { CalendarOutline, PreferencesOutline } from "@makeplane/propel/icons";
 // plane package imports
 import { ANALYTICS_X_AXIS_VALUES, ANALYTICS_Y_AXIS_VALUES } from "@plane/constants";
-import { CalendarLayoutIcon } from "@plane/propel/icons";
 import type { IAnalyticsParams } from "@plane/types";
 import { ChartYAxisMetric } from "@plane/types";
 import { cn } from "@plane/utils";
@@ -70,7 +69,7 @@ export const AnalyticsSelectParams = observer(function AnalyticsSelectParams(pro
               }}
               label={
                 <div className="flex items-center gap-2">
-                  <CalendarLayoutIcon className="h-3 w-3" />
+                  <CalendarOutline className="h-3 w-3" />
                   <span className={cn("text-secondary", value && "text-primary")}>
                     {xAxisOptions.find((v) => v.value === value)?.label || "Add Property"}
                   </span>
@@ -91,7 +90,7 @@ export const AnalyticsSelectParams = observer(function AnalyticsSelectParams(pro
               }}
               label={
                 <div className="flex items-center gap-2">
-                  <SlidersHorizontal className="h-3 w-3" />
+                  <PreferencesOutline className="h-3 w-3" />
                   <span className={cn("text-secondary", value && "text-primary")}>
                     {groupByOptions.find((v) => v.value === value)?.label || "Add Property"}
                   </span>
diff --git a/apps/web/core/components/analytics/select/duration.tsx b/apps/web/core/components/analytics/select/duration.tsx
index 695e5c12ebf..7748484fc43 100644
--- a/apps/web/core/components/analytics/select/duration.tsx
+++ b/apps/web/core/components/analytics/select/duration.tsx
@@ -7,7 +7,7 @@
 // plane package imports
 import type { ReactNode } from "react";
 import React from "react";
-import { Calendar } from "lucide-react";
+import { CalendarOutline } from "@makeplane/propel/icons";
 // plane package imports
 import { ANALYTICS_DURATION_FILTER_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -46,7 +46,7 @@ function DurationDropdown({ placeholder = "Duration", onChange, value }: Props)
       options={options}
       label={
         <div className="flex items-center gap-2 p-1">
-          <Calendar className="h-4 w-4" />
+          <CalendarOutline className="h-4 w-4" />
           {value ? ANALYTICS_DURATION_FILTER_OPTIONS.find((opt) => opt.value === value)?.name : placeholder}
         </div>
       }
diff --git a/apps/web/core/components/analytics/select/project.tsx b/apps/web/core/components/analytics/select/project.tsx
index 7bdbbddb366..cc0896c8683 100644
--- a/apps/web/core/components/analytics/select/project.tsx
+++ b/apps/web/core/components/analytics/select/project.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 // plane package imports
 import { getButtonStyling } from "@plane/propel/button";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { ChevronDownIcon, ProjectIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, ProjectsOutline } from "@makeplane/propel/icons";
 import { CustomSearchSelect } from "@plane/ui";
 import { cn } from "@plane/utils";
 // hooks
@@ -35,7 +35,7 @@ export const ProjectSelect = observer(function ProjectSelect(props: Props) {
           {projectDetails?.logo_props ? (
             <Logo logo={projectDetails?.logo_props} size={16} />
           ) : (
-            <ProjectIcon className="h-4 w-4" />
+            <ProjectsOutline className="h-4 w-4" />
           )}
           <span className="flex-grow truncate">{projectDetails?.name}</span>
         </div>
@@ -51,7 +51,7 @@ export const ProjectSelect = observer(function ProjectSelect(props: Props) {
       className="border-none p-0"
       customButton={
         <div className={cn(getButtonStyling("secondary", "lg"), "gap-2")}>
-          <ProjectIcon className="h-4 w-4" />
+          <ProjectsOutline className="h-4 w-4" />
           {value && value.length > 3
             ? `3+ projects`
             : value && value.length > 0
@@ -60,7 +60,7 @@ export const ProjectSelect = observer(function ProjectSelect(props: Props) {
                   .map((p) => getProjectById(p)?.name)
                   .join(", ")
               : "All projects"}
-          <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
+          <ChevronDownOutline className="h-3 w-3" aria-hidden="true" />
         </div>
       }
       customButtonClassName="border-none p-0 bg-transparent hover:bg-transparent w-auto h-auto"
diff --git a/apps/web/core/components/analytics/select/select-y-axis.tsx b/apps/web/core/components/analytics/select/select-y-axis.tsx
index 64c69fbff50..0d0470eebbd 100644
--- a/apps/web/core/components/analytics/select/select-y-axis.tsx
+++ b/apps/web/core/components/analytics/select/select-y-axis.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { EEstimateSystem } from "@plane/constants";
-import { ProjectIcon } from "@plane/propel/icons";
+import { ProjectsOutline } from "@makeplane/propel/icons";
 import type { ChartYAxisMetric } from "@plane/types";
 // plane package imports
 import { CustomSelect } from "@plane/ui";
@@ -48,7 +48,7 @@ export const SelectYAxis = observer(function SelectYAxis({ value, onChange, hidd
       value={value}
       label={
         <div className="flex items-center gap-2">
-          <ProjectIcon className="h-3 w-3" />
+          <ProjectsOutline className="h-3 w-3" />
           <span>{options.find((v) => v.value === value)?.label ?? "Add Metric"}</span>
         </div>
       }
diff --git a/apps/web/core/components/analytics/work-items/modal/header.tsx b/apps/web/core/components/analytics/work-items/modal/header.tsx
index c515deb98db..92704524e55 100644
--- a/apps/web/core/components/analytics/work-items/modal/header.tsx
+++ b/apps/web/core/components/analytics/work-items/modal/header.tsx
@@ -6,8 +6,7 @@
 
 import { observer } from "mobx-react";
 // plane package imports
-import { Expand, Shrink } from "lucide-react";
-import { CloseIcon } from "@plane/propel/icons";
+import { ArrowCollapseOutline, CloseOutline, FullScreenOutline } from "@makeplane/propel/icons";
 import type { ICycle, IModule } from "@plane/types";
 // icons
 
@@ -34,14 +33,14 @@ export const WorkItemsModalHeader = observer(function WorkItemsModalHeader(props
           className="hidden place-items-center p-1 text-secondary hover:text-primary md:grid"
           onClick={() => setFullScreen((prevData) => !prevData)}
         >
-          {fullScreen ? <Shrink size={14} strokeWidth={2} /> : <Expand size={14} strokeWidth={2} />}
+          {fullScreen ? <ArrowCollapseOutline width={14} height={14} /> : <FullScreenOutline width={14} height={14} />}
         </button>
         <button
           type="button"
           className="grid place-items-center p-1 text-secondary hover:text-primary"
           onClick={handleClose}
         >
-          <CloseIcon height={14} width={14} strokeWidth={2} />
+          <CloseOutline height={14} width={14} />
         </button>
       </div>
     </div>
diff --git a/apps/web/core/components/analytics/work-items/priority-chart.tsx b/apps/web/core/components/analytics/work-items/priority-chart.tsx
index 942285cab20..97adc633aed 100644
--- a/apps/web/core/components/analytics/work-items/priority-chart.tsx
+++ b/apps/web/core/components/analytics/work-items/priority-chart.tsx
@@ -11,7 +11,7 @@ import { useParams } from "next/navigation";
 import { useTheme } from "next-themes";
 import useSWR from "swr";
 // plane package imports
-import { Download } from "lucide-react";
+import { DownloadOutline } from "@makeplane/propel/icons";
 import type { ChartXAxisDateGrouping } from "@plane/constants";
 import { ANALYTICS_X_AXIS_VALUES, ANALYTICS_Y_AXIS_VALUES, CHART_COLOR_PALETTES, EChartModels } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -228,7 +228,7 @@ const PriorityChart = observer(function PriorityChart(props: Props) {
             actions={(table: Table<TChartDatum>) => (
               <Button
                 variant="secondary"
-                prependIcon={<Download className="h-3.5 w-3.5" />}
+                prependIcon={<DownloadOutline className="h-3.5 w-3.5" />}
                 onClick={() => exportCSV(table.getRowModel().rows, [...defaultColumns, ...columns], workspaceSlug)}
               >
                 <div>{t("exporter.csv.short_description")}</div>
diff --git a/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx b/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx
index 73d18192a1e..60dbef70dc5 100644
--- a/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx
+++ b/apps/web/core/components/analytics/work-items/workitems-insight-table.tsx
@@ -9,11 +9,10 @@ import type { ColumnDef, Row, RowData } from "@tanstack/react-table";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
-import { UserRound } from "lucide-react";
+import { ProjectsOutline, UserOutline } from "@makeplane/propel/icons";
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { useTranslation } from "@plane/i18n";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { ProjectIcon } from "@plane/propel/icons";
 // plane package imports
 import type { AnalyticsTableDataMap, WorkItemInsightColumns } from "@plane/types";
 // plane web components
@@ -91,7 +90,7 @@ const WorkItemsInsightTable = observer(function WorkItemsInsightTable() {
                   {project?.logo_props ? (
                     <Logo logo={project.logo_props} size={18} />
                   ) : (
-                    <ProjectIcon className="h-4 w-4" />
+                    <ProjectsOutline className="h-4 w-4" />
                   )}
                   {project?.name}
                 </div>
@@ -122,7 +121,7 @@ const WorkItemsInsightTable = observer(function WorkItemsInsightTable() {
                       {row.original.display_name ? (
                         row.original.display_name?.[0]
                       ) : (
-                        <UserRound className="text-secondary" size={12} />
+                        <UserOutline className="text-secondary" width={12} height={12} />
                       )}
                     </div>
                   )}
diff --git a/apps/web/core/components/api-token/modal/form.tsx b/apps/web/core/components/api-token/modal/form.tsx
index 32c9456f67a..7d799ff1f43 100644
--- a/apps/web/core/components/api-token/modal/form.tsx
+++ b/apps/web/core/components/api-token/modal/form.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { add } from "date-fns";
 import { Controller, useForm } from "react-hook-form";
-import { Calendar } from "lucide-react";
+import { CalendarOutline } from "@makeplane/propel/icons";
 // types
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -194,7 +194,7 @@ export function CreateApiTokenForm(props: Props) {
                             }
                           )}
                         >
-                          <Calendar className="h-3 w-3" />
+                          <CalendarOutline className="h-3 w-3" />
                           {value === "custom"
                             ? "Custom date"
                             : selectedOption
@@ -222,7 +222,7 @@ export function CreateApiTokenForm(props: Props) {
                     value={customDate}
                     onChange={(date) => setCustomDate(date)}
                     minDate={tomorrow}
-                    icon={<Calendar className="h-3 w-3" />}
+                    icon={<CalendarOutline className="h-3 w-3" />}
                     buttonVariant="border-with-text"
                     placeholder="Set date"
                     disabled={neverExpires}
diff --git a/apps/web/core/components/api-token/modal/generated-token-details.tsx b/apps/web/core/components/api-token/modal/generated-token-details.tsx
index 8b13f47dc72..d5784eb1bd9 100644
--- a/apps/web/core/components/api-token/modal/generated-token-details.tsx
+++ b/apps/web/core/components/api-token/modal/generated-token-details.tsx
@@ -6,7 +6,7 @@
 
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CopyIcon } from "@plane/propel/icons";
+import { CopyOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IApiToken } from "@plane/types";
@@ -49,7 +49,7 @@ export function GeneratedTokenDetails(props: Props) {
       >
         <span className="truncate pr-2">{tokenDetails.token}</span>
         <Tooltip label="Copy secret key" disabled={isMobile}>
-          <CopyIcon className="h-4 w-4 flex-shrink-0 text-placeholder" />
+          <CopyOutline className="h-4 w-4 flex-shrink-0 text-placeholder" />
         </Tooltip>
       </button>
       <div className="mt-6 flex items-center justify-between">
diff --git a/apps/web/core/components/api-token/token-list-item.tsx b/apps/web/core/components/api-token/token-list-item.tsx
index ade19e21e14..9320614d411 100644
--- a/apps/web/core/components/api-token/token-list-item.tsx
+++ b/apps/web/core/components/api-token/token-list-item.tsx
@@ -5,7 +5,7 @@
  */
 
 import { useState } from "react";
-import { XCircle } from "lucide-react";
+import { CloseCircleOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IApiToken } from "@plane/types";
@@ -35,7 +35,7 @@ export function ApiTokenListItem(props: Props) {
             onClick={() => setDeleteModalOpen(true)}
             className="absolute right-4 hidden place-items-center group-hover:grid"
           >
-            <XCircle className="h-4 w-4 text-danger-primary" />
+            <CloseCircleOutline className="h-4 w-4 text-danger-primary" />
           </button>
         </Tooltip>
         <div className="flex w-4/5 items-center">
diff --git a/apps/web/core/components/automation/auto-archive-automation.tsx b/apps/web/core/components/automation/auto-archive-automation.tsx
index e631ec2858b..cb0ee841bf7 100644
--- a/apps/web/core/components/automation/auto-archive-automation.tsx
+++ b/apps/web/core/components/automation/auto-archive-automation.tsx
@@ -7,7 +7,7 @@
 import { useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ArchiveRestore } from "lucide-react";
+import { RestoreOutline } from "@makeplane/propel/icons";
 // plane imports
 import { PROJECT_AUTOMATION_MONTHS, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -71,7 +71,7 @@ export const AutoArchiveAutomation = observer(function AutoArchiveAutomation(pro
       <div className="flex flex-col gap-4 border-b border-subtle py-2">
         <div className="flex items-center gap-3">
           <div className="grid size-10 shrink-0 place-items-center rounded-sm bg-layer-2">
-            <ArchiveRestore className="size-4 shrink-0 text-primary" />
+            <RestoreOutline className="size-4 shrink-0 text-primary" />
           </div>
           <SettingsControlItem
             title={t("project_settings.automations.auto-archive.title")}
diff --git a/apps/web/core/components/automation/auto-close-automation.tsx b/apps/web/core/components/automation/auto-close-automation.tsx
index d74ada18a67..bf8c5301b3d 100644
--- a/apps/web/core/components/automation/auto-close-automation.tsx
+++ b/apps/web/core/components/automation/auto-close-automation.tsx
@@ -7,11 +7,11 @@
 import { useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ArchiveX } from "lucide-react";
+import { AutoCloseOutline, StateOutline } from "@makeplane/propel/icons";
 // plane imports
 import { PROJECT_AUTOMATION_MONTHS, EUserPermissions, EUserPermissionsLevel, EIconSize } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { StateGroupIcon, StatePropertyIcon } from "@plane/propel/icons";
+import { StateGroupIcon } from "@plane/propel/icons";
 import type { IProject } from "@plane/types";
 import { Switch } from "@makeplane/propel/components/switch";
 import { CustomSelect, CustomSearchSelect, Loader } from "@plane/ui";
@@ -89,7 +89,7 @@ export const AutoCloseAutomation = observer(function AutoCloseAutomation(props:
       <div className="flex flex-col gap-4 py-2">
         <div className="flex items-center gap-3">
           <div className="grid size-10 shrink-0 place-items-center rounded-sm bg-layer-2">
-            <ArchiveX className="size-4 shrink-0 text-danger-primary" />
+            <AutoCloseOutline className="size-4 shrink-0 text-danger-primary" />
           </div>
           <SettingsControlItem
             title={t("project_settings.automations.auto-close.title")}
@@ -170,7 +170,7 @@ export const AutoCloseAutomation = observer(function AutoCloseAutomation(props:
                               size={EIconSize.LG}
                             />
                           ) : (
-                            <StatePropertyIcon className="h-3.5 w-3.5 text-secondary" />
+                            <StateOutline className="h-3.5 w-3.5 text-secondary" />
                           )}
                           {selectedOption?.name
                             ? selectedOption.name
diff --git a/apps/web/core/components/base-layouts/constants.ts b/apps/web/core/components/base-layouts/constants.ts
index 4965963732e..0ee8c5962d5 100644
--- a/apps/web/core/components/base-layouts/constants.ts
+++ b/apps/web/core/components/base-layouts/constants.ts
@@ -4,23 +4,23 @@
  * See the LICENSE file for details.
  */
 
-import { BoardLayoutIcon, ListLayoutIcon, TimelineLayoutIcon } from "@plane/propel/icons";
+import { BoardOutline, ListOutline, TimelineOutline } from "@makeplane/propel/icons";
 import type { IBaseLayoutConfig } from "@plane/types";
 
 export const BASE_LAYOUTS: IBaseLayoutConfig[] = [
   {
     key: "list",
-    icon: ListLayoutIcon,
+    icon: ListOutline,
     label: "List Layout",
   },
   {
     key: "kanban",
-    icon: BoardLayoutIcon,
+    icon: BoardOutline,
     label: "Board Layout",
   },
   {
     key: "gantt",
-    icon: TimelineLayoutIcon,
+    icon: TimelineOutline,
     label: "Gantt Layout",
   },
 ];
diff --git a/apps/web/core/components/breadcrumbs/project.tsx b/apps/web/core/components/breadcrumbs/project.tsx
index b997ad5fac8..3bd941c5c38 100644
--- a/apps/web/core/components/breadcrumbs/project.tsx
+++ b/apps/web/core/components/breadcrumbs/project.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { ProjectIcon } from "@plane/propel/icons";
+import { ProjectsOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { ICustomSearchSelectOption } from "@plane/types";
 import { BreadcrumbNavigationSearchDropdown, Breadcrumbs } from "@plane/ui";
@@ -46,7 +46,7 @@ export const ProjectBreadcrumb = observer(function ProjectBreadcrumb(props: TPro
           <SwitcherLabel
             name={project?.name}
             logo_props={project?.logo_props}
-            LabelIcon={ProjectIcon}
+            LabelIcon={ProjectsOutline}
             type="material"
           />
         ),
diff --git a/apps/web/core/components/comments/card/display.tsx b/apps/web/core/components/comments/card/display.tsx
index 85bc7f66119..ecb527ee293 100644
--- a/apps/web/core/components/comments/card/display.tsx
+++ b/apps/web/core/components/comments/card/display.tsx
@@ -13,7 +13,7 @@ import { Avatar } from "@makeplane/propel/components/avatar";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { EditorRefApi } from "@plane/editor";
 import { useHashScroll } from "@plane/hooks";
-import { GlobeIcon, LockIcon } from "@plane/propel/icons";
+import { GlobeOutline, LockOutline } from "@makeplane/propel/icons";
 import { EIssueCommentAccessSpecifier } from "@plane/types";
 import type { TCommentsOperations, TIssueComment } from "@plane/types";
 import { calculateTimeAgo, cn, getFileURL, renderFormattedDate, renderFormattedTime } from "@plane/utils";
@@ -111,9 +111,9 @@ export const CommentCardDisplay = observer(function CommentCardDisplay(props: TC
       {showAccessSpecifier && (
         <div className="absolute top-2.5 right-2.5 z-[1] text-tertiary">
           {comment.access === EIssueCommentAccessSpecifier.INTERNAL ? (
-            <LockIcon className="size-3" />
+            <LockOutline className="size-3" />
           ) : (
-            <GlobeIcon className="size-3" />
+            <GlobeOutline className="size-3" />
           )}
         </div>
       )}
diff --git a/apps/web/core/components/comments/card/edit-form.tsx b/apps/web/core/components/comments/card/edit-form.tsx
index 9be8b135521..80f410d3051 100644
--- a/apps/web/core/components/comments/card/edit-form.tsx
+++ b/apps/web/core/components/comments/card/edit-form.tsx
@@ -8,7 +8,7 @@ import { useEffect, useRef } from "react";
 import { observer } from "mobx-react";
 import { useForm } from "react-hook-form";
 import type { EditorRefApi } from "@plane/editor";
-import { CheckIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TCommentsOperations, TIssueComment } from "@plane/types";
 import { cn, isCommentEmpty } from "@plane/utils";
@@ -121,7 +121,7 @@ export const CommentCardEditForm = observer(function CommentCardEditForm(props:
               isDisabled ? "" : "hover:bg-success-subtle-1"
             )}
           >
-            <CheckIcon className="size-4 text-success-primary" />
+            <TickOutline className="size-4 text-success-primary" />
           </button>
         )}
         <button
@@ -136,7 +136,7 @@ export const CommentCardEditForm = observer(function CommentCardEditForm(props:
             editorRef.current?.setEditorValue(comment.comment_html ?? "<p></p>");
           }}
         >
-          <CloseIcon className="size-4 text-danger-primary" />
+          <CloseOutline className="size-4 text-danger-primary" />
         </button>
       </div>
     </form>
diff --git a/apps/web/core/components/comments/comment-block.tsx b/apps/web/core/components/comments/comment-block.tsx
index c08454e96ea..ef1f051a89d 100644
--- a/apps/web/core/components/comments/comment-block.tsx
+++ b/apps/web/core/components/comments/comment-block.tsx
@@ -8,7 +8,7 @@ import type { ReactNode } from "react";
 import { useRef } from "react";
 import { observer } from "mobx-react";
 // plane imports
-import { CommentReplyIcon } from "@plane/propel/icons";
+import { ReplyOutline } from "@makeplane/propel/icons";
 import type { TIssueComment } from "@plane/types";
 import { cn } from "@plane/utils";
 // hooks
@@ -39,7 +39,7 @@ export const CommentBlock = observer(function CommentBlock(props: TCommentBlock)
           "transition-border relative z-[3] flex h-7 w-7 flex-shrink-0 items-center justify-center rounded-lg border border-subtle bg-layer-2 uppercase shadow-raised-100 duration-1000"
         )}
       >
-        <CommentReplyIcon width={14} height={14} className="text-secondary" aria-hidden="true" />
+        <ReplyOutline width={14} height={14} className="text-secondary" aria-hidden="true" />
       </div>
       <div className="flex flex-grow flex-col gap-3 truncate">
         <div className="mb-2 rounded-lg border border-subtle bg-layer-2 p-3 text-body-sm-regular shadow-raised-100">
diff --git a/apps/web/core/components/comments/quick-actions.tsx b/apps/web/core/components/comments/quick-actions.tsx
index eff40eab0b1..154ca32a56b 100644
--- a/apps/web/core/components/comments/quick-actions.tsx
+++ b/apps/web/core/components/comments/quick-actions.tsx
@@ -6,12 +6,18 @@
 
 import { useMemo } from "react";
 import { observer } from "mobx-react";
-import { MoreHorizontal } from "lucide-react";
+import {
+  DeleteOutline,
+  EditOutline,
+  GlobeOutline,
+  LinkOutline,
+  LockOutline,
+  MoreHorizontalOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { EIssueCommentAccessSpecifier } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { IconButton } from "@plane/propel/icon-button";
-import { LinkIcon, GlobeIcon, LockIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
 import type { TIssueComment, TCommentsOperations } from "@plane/types";
 import type { TContextMenuItem } from "@plane/ui";
 import { CustomMenu } from "@plane/ui";
@@ -45,14 +51,14 @@ export const CommentQuickActions = observer(function CommentQuickActions(props:
           key: "edit",
           action: setEditMode,
           title: t("common.actions.edit"),
-          icon: EditIcon,
+          icon: EditOutline,
           shouldRender: canEdit,
         },
         {
           key: "copy_link",
           action: () => activityOperations.copyCommentLink(comment.id),
           title: t("common.actions.copy_link"),
-          icon: LinkIcon,
+          icon: LinkOutline,
           shouldRender: showCopyLinkOption,
         },
         {
@@ -68,14 +74,14 @@ export const CommentQuickActions = observer(function CommentQuickActions(props:
             comment.access === EIssueCommentAccessSpecifier.INTERNAL
               ? t("issue.comments.switch.public")
               : t("issue.comments.switch.private"),
-          icon: comment.access === EIssueCommentAccessSpecifier.INTERNAL ? GlobeIcon : LockIcon,
+          icon: comment.access === EIssueCommentAccessSpecifier.INTERNAL ? GlobeOutline : LockOutline,
           shouldRender: showAccessSpecifier,
         },
         {
           key: "delete",
           action: () => activityOperations.removeComment(comment.id),
           title: t("common.actions.delete"),
-          icon: TrashIcon,
+          icon: DeleteOutline,
           shouldRender: canDelete,
         },
       ].filter((item) => item.shouldRender !== false);
@@ -86,7 +92,7 @@ export const CommentQuickActions = observer(function CommentQuickActions(props:
   if (MENU_ITEMS.length === 0) return null;
 
   return (
-    <CustomMenu customButton={<IconButton icon={MoreHorizontal} variant="ghost" size="sm" />} closeOnSelect>
+    <CustomMenu customButton={<IconButton icon={MoreHorizontalOutline} variant="ghost" size="sm" />} closeOnSelect>
       {MENU_ITEMS.map((item) => (
         <CustomMenu.MenuItem
           key={item.key}
diff --git a/apps/web/core/components/common/activity/activity-block.tsx b/apps/web/core/components/common/activity/activity-block.tsx
index f5e847b7805..c7486c0b57c 100644
--- a/apps/web/core/components/common/activity/activity-block.tsx
+++ b/apps/web/core/components/common/activity/activity-block.tsx
@@ -5,7 +5,7 @@
  */
 
 import type { FC, ReactNode } from "react";
-import { Network } from "lucide-react";
+import { HierarchyOutline } from "@makeplane/propel/icons";
 // types
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TWorkspaceBaseActivity } from "@plane/types";
@@ -38,7 +38,7 @@ export function ActivityBlockComponent(props: TActivityBlockComponent) {
       }`}
     >
       <div className="z-[4] mt-0.5 flex h-7 w-7 shrink-0 items-center justify-center overflow-hidden rounded-lg border border-subtle text-secondary shadow-raised-100">
-        {Icon ? <Icon className="h-3.5 w-3.5 shrink-0" /> : <Network className="h-3.5 w-3.5 shrink-0" />}
+        {Icon ? <Icon className="h-3.5 w-3.5 shrink-0" /> : <HierarchyOutline className="h-3.5 w-3.5 shrink-0" />}
       </div>
       <div className="w-full text-secondary">
         <div className="line-clamp-2">
diff --git a/apps/web/core/components/common/activity/helper.tsx b/apps/web/core/components/common/activity/helper.tsx
index b118186b6f7..064f9d027f0 100644
--- a/apps/web/core/components/common/activity/helper.tsx
+++ b/apps/web/core/components/common/activity/helper.tsx
@@ -6,39 +6,37 @@
 
 import type { FC, ReactNode } from "react";
 import {
-  RotateCcw,
-  Network,
-  Inbox,
-  AlignLeft,
-  Paperclip,
-  Type,
-  FileText,
-  Hash,
-  Clock,
-  Bell,
-  GitBranch,
-  Timer,
-  ListTodo,
-  Layers,
-} from "lucide-react";
+  AlignLeftOutline,
+  ArchiveOutline,
+  AttachOutline,
+  ClockOutline,
+  CyclesOutline,
+  DocumentationOutline,
+  DueDateOutline,
+  EstimateOutline,
+  GitBranchOutline,
+  GlobeOutline,
+  GridOutline,
+  HashOutline,
+  HierarchyOutline,
+  InboxOutline,
+  IntakeOutline,
+  LabelsOutline,
+  LinkOutline,
+  MembersOutline,
+  ModuleOutline,
+  PriorityOutline,
+  RefreshOutline,
+  StartDateOutline,
+  StateOutline,
+  SubscribeOutline,
+  TextOutline,
+  TimeTrackingOutline,
+  ToDoOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 // components
 
-import {
-  LinkIcon,
-  ArchiveIcon,
-  CycleIcon,
-  GlobeIcon,
-  DueDatePropertyIcon,
-  EstimatePropertyIcon,
-  GridLayoutIcon,
-  IntakeIcon,
-  LabelPropertyIcon,
-  MembersPropertyIcon,
-  ModuleIcon,
-  PriorityPropertyIcon,
-  StartDatePropertyIcon,
-  StatePropertyIcon,
-} from "@plane/propel/icons";
 import { store } from "@/lib/store-context";
 import type { TProjectActivity } from "@plane/types";
 
@@ -46,37 +44,37 @@ type ActivityIconMap = {
   [key: string]: FC<{ className?: string }>;
 };
 export const iconsMap: ActivityIconMap = {
-  priority: PriorityPropertyIcon,
-  archived_at: ArchiveIcon,
-  restored: RotateCcw,
-  link: LinkIcon,
-  start_date: StartDatePropertyIcon,
-  target_date: DueDatePropertyIcon,
-  label: LabelPropertyIcon,
-  inbox: Inbox,
-  description: AlignLeft,
-  assignee: MembersPropertyIcon,
-  attachment: Paperclip,
-  name: Type,
-  state: StatePropertyIcon,
-  estimate: EstimatePropertyIcon,
-  cycle: CycleIcon,
-  module: ModuleIcon,
-  page: FileText,
-  network: GlobeIcon,
-  identifier: Hash,
-  timezone: Clock,
-  is_project_updates_enabled: Bell,
-  is_epic_enabled: GridLayoutIcon,
-  is_workflow_enabled: GitBranch,
-  is_time_tracking_enabled: Timer,
-  is_issue_type_enabled: ListTodo,
-  default: Network,
-  module_view: ModuleIcon,
-  cycle_view: CycleIcon,
-  issue_views_view: Layers,
-  page_view: FileText,
-  intake_view: IntakeIcon,
+  priority: PriorityOutline,
+  archived_at: ArchiveOutline,
+  restored: RefreshOutline,
+  link: LinkOutline,
+  start_date: StartDateOutline,
+  target_date: DueDateOutline,
+  label: LabelsOutline,
+  inbox: InboxOutline,
+  description: AlignLeftOutline,
+  assignee: MembersOutline,
+  attachment: AttachOutline,
+  name: TextOutline,
+  state: StateOutline,
+  estimate: EstimateOutline,
+  cycle: CyclesOutline,
+  module: ModuleOutline,
+  page: DocumentationOutline,
+  network: GlobeOutline,
+  identifier: HashOutline,
+  timezone: ClockOutline,
+  is_project_updates_enabled: SubscribeOutline,
+  is_epic_enabled: GridOutline,
+  is_workflow_enabled: GitBranchOutline,
+  is_time_tracking_enabled: TimeTrackingOutline,
+  is_issue_type_enabled: ToDoOutline,
+  default: HierarchyOutline,
+  module_view: ModuleOutline,
+  cycle_view: CyclesOutline,
+  issue_views_view: WorkItemsOutline,
+  page_view: DocumentationOutline,
+  intake_view: IntakeOutline,
 };
 
 export const messages = (activity: TProjectActivity): { message: string | ReactNode; customUserName?: string } => {
diff --git a/apps/web/core/components/common/applied-filters/date.tsx b/apps/web/core/components/common/applied-filters/date.tsx
index 6a5051fd9be..a38f0488b2b 100644
--- a/apps/web/core/components/common/applied-filters/date.tsx
+++ b/apps/web/core/components/common/applied-filters/date.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // icons
 import { DATE_BEFORE_FILTER_OPTIONS } from "@plane/constants";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane constants
 import { renderFormattedDate, capitalizeFirstLetter } from "@plane/utils";
 // helpers
@@ -50,7 +50,7 @@ export const AppliedDateFilters = observer(function AppliedDateFilters(props: Pr
               className="grid place-items-center text-tertiary hover:text-secondary"
               onClick={() => handleRemove(date)}
             >
-              <CloseIcon height={10} width={10} strokeWidth={2} />
+              <CloseOutline height={10} width={10} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/common/applied-filters/members.tsx b/apps/web/core/components/common/applied-filters/members.tsx
index 1982fa82520..97e0a8aa44f 100644
--- a/apps/web/core/components/common/applied-filters/members.tsx
+++ b/apps/web/core/components/common/applied-filters/members.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane ui
 import { Avatar } from "@makeplane/propel/components/avatar";
 // helpers
@@ -48,7 +48,7 @@ export const AppliedMembersFilters = observer(function AppliedMembersFilters(pro
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(memberId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/common/latest-feature-block.tsx b/apps/web/core/components/common/latest-feature-block.tsx
index 7ea1289b2db..dc1f82138ea 100644
--- a/apps/web/core/components/common/latest-feature-block.tsx
+++ b/apps/web/core/components/common/latest-feature-block.tsx
@@ -7,7 +7,7 @@
 import Link from "next/link";
 import { useTheme } from "next-themes";
 // icons
-import { Lightbulb } from "lucide-react";
+import { ThoughtsOutline } from "@makeplane/propel/icons";
 // images
 import latestFeatures from "@/app/assets/onboarding/onboarding-pages.webp?url";
 
@@ -17,7 +17,7 @@ export function LatestFeatureBlock() {
   return (
     <>
       <div className="mx-auto mt-16 flex rounded-[3.5px] border border-subtle bg-surface-1 py-2 sm:w-96">
-        <Lightbulb className="mx-3 mr-2 h-7 w-7" />
+        <ThoughtsOutline className="mx-3 mr-2 h-7 w-7" />
         <p className="text-left text-13 text-primary">
           Pages gets a facelift! Write anything and use Galileo to help you start.{" "}
           <Link href="https://plane.so/changelog" target="_blank" rel="noopener noreferrer">
diff --git a/apps/web/core/components/common/layout-error-boundary.tsx b/apps/web/core/components/common/layout-error-boundary.tsx
index 74ef8f3fbb8..ead42f58794 100644
--- a/apps/web/core/components/common/layout-error-boundary.tsx
+++ b/apps/web/core/components/common/layout-error-boundary.tsx
@@ -6,7 +6,7 @@
 
 import { Component, Fragment } from "react";
 import type { ErrorInfo, ReactNode } from "react";
-import { AlertTriangle } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 
@@ -24,7 +24,7 @@ function LayoutErrorFallback({ onRetry }: { onRetry: () => void }) {
 
   return (
     <div className="flex h-full w-full flex-col items-center justify-center gap-3 text-center">
-      <AlertTriangle className="size-8 text-tertiary" />
+      <WarningTriangleOutline className="size-8 text-tertiary" />
       <p className="text-14 text-secondary">{t("something_went_wrong")}</p>
       <Button variant="secondary" size="sm" onClick={onRetry}>
         {t("common.retry")}
diff --git a/apps/web/core/components/common/page-access-icon.tsx b/apps/web/core/components/common/page-access-icon.tsx
index a4ece44dc0a..1e90b36d4f4 100644
--- a/apps/web/core/components/common/page-access-icon.tsx
+++ b/apps/web/core/components/common/page-access-icon.tsx
@@ -4,20 +4,19 @@
  * See the LICENSE file for details.
  */
 
-import { ArchiveIcon, Earth } from "lucide-react";
+import { ArchiveOutline, GlobeOutline, LockOutline } from "@makeplane/propel/icons";
 import { EPageAccess } from "@plane/constants";
-import { LockIcon } from "@plane/propel/icons";
 import type { TPage } from "@plane/types";
 
 export function PageAccessIcon(page: TPage) {
   return (
     <div>
       {page.archived_at ? (
-        <ArchiveIcon className="h-2.5 w-2.5 text-tertiary" />
+        <ArchiveOutline className="h-2.5 w-2.5 text-tertiary" />
       ) : page.access === EPageAccess.PUBLIC ? (
-        <Earth className="h-2.5 w-2.5 text-tertiary" />
+        <GlobeOutline className="h-2.5 w-2.5 text-tertiary" />
       ) : (
-        <LockIcon className="h-2.5 w-2.5 text-tertiary" />
+        <LockOutline className="h-2.5 w-2.5 text-tertiary" />
       )}
     </div>
   );
diff --git a/apps/web/core/components/common/quick-actions-factory.tsx b/apps/web/core/components/common/quick-actions-factory.tsx
index ee7f8fb5f76..0c234e8a48f 100644
--- a/apps/web/core/components/common/quick-actions-factory.tsx
+++ b/apps/web/core/components/common/quick-actions-factory.tsx
@@ -4,9 +4,15 @@
  * See the LICENSE file for details.
  */
 
-import { Pencil, ExternalLink, Link, Trash2, ArchiveRestoreIcon } from "lucide-react";
+import {
+  ArchiveOutline,
+  DeleteOutline,
+  EditOutline,
+  LinkOutline,
+  NewTabOutline,
+  RestoreOutline,
+} from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
-import { ArchiveIcon } from "@plane/propel/icons";
 import type { TContextMenuItem } from "@plane/ui";
 
 /**
@@ -20,7 +26,7 @@ export const useQuickActionsFactory = () => {
     createEditMenuItem: (handler: () => void, shouldRender: boolean = true): TContextMenuItem => ({
       key: "edit",
       title: t("edit"),
-      icon: Pencil,
+      icon: EditOutline,
       action: handler,
       shouldRender,
     }),
@@ -28,14 +34,14 @@ export const useQuickActionsFactory = () => {
     createOpenInNewTabMenuItem: (handler: () => void): TContextMenuItem => ({
       key: "open-new-tab",
       title: t("open_in_new_tab"),
-      icon: ExternalLink,
+      icon: NewTabOutline,
       action: handler,
     }),
 
     createCopyLinkMenuItem: (handler: () => void): TContextMenuItem => ({
       key: "copy-link",
       title: t("copy_link"),
-      icon: Link,
+      icon: LinkOutline,
       action: handler,
     }),
 
@@ -45,7 +51,7 @@ export const useQuickActionsFactory = () => {
     ): TContextMenuItem => ({
       key: "archive",
       title: t("archive"),
-      icon: ArchiveIcon,
+      icon: ArchiveOutline,
       action: handler,
       className: "items-start",
       iconClassName: "mt-1",
@@ -57,7 +63,7 @@ export const useQuickActionsFactory = () => {
     createRestoreMenuItem: (handler: () => void, shouldRender: boolean = true): TContextMenuItem => ({
       key: "restore",
       title: t("restore"),
-      icon: ArchiveRestoreIcon,
+      icon: RestoreOutline,
       action: handler,
       shouldRender,
     }),
@@ -65,7 +71,7 @@ export const useQuickActionsFactory = () => {
     createDeleteMenuItem: (handler: () => void, shouldRender: boolean = true): TContextMenuItem => ({
       key: "delete",
       title: t("delete"),
-      icon: Trash2,
+      icon: DeleteOutline,
       action: handler,
       shouldRender,
     }),
@@ -74,14 +80,14 @@ export const useQuickActionsFactory = () => {
     createOpenInNewTab: (handler: () => void): TContextMenuItem => ({
       key: "open-in-new-tab",
       title: "Open in new tab",
-      icon: ExternalLink,
+      icon: NewTabOutline,
       action: handler,
     }),
 
     createCopyLayoutLinkMenuItem: (handler: () => void): TContextMenuItem => ({
       key: "copy-link",
       title: "Copy link",
-      icon: Link,
+      icon: LinkOutline,
       action: handler,
     }),
   };
diff --git a/apps/web/core/components/core/activity.tsx b/apps/web/core/components/core/activity.tsx
index 2b9b054718c..60be41d062d 100644
--- a/apps/web/core/components/core/activity.tsx
+++ b/apps/web/core/components/core/activity.tsx
@@ -9,30 +9,25 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // store hooks
 // icons
+import { TriangleIcon, SignalMediumIcon } from "lucide-react";
 import {
-  TagIcon,
-  CopyPlus,
-  Calendar,
-  Link2Icon,
-  Users2Icon,
-  ArchiveIcon,
-  PaperclipIcon,
-  TriangleIcon,
-  LayoutGridIcon,
-  SignalMediumIcon,
-  MessageSquareIcon,
-  UsersIcon,
-} from "lucide-react";
-import {
-  BlockedIcon,
-  BlockerIcon,
-  CycleIcon,
-  EpicIcon,
-  IntakeIcon,
-  ModuleIcon,
-  RelatedIcon,
-  WorkItemsIcon,
-} from "@plane/propel/icons";
+  ArchiveOutline,
+  AttachOutline,
+  CalendarOutline,
+  ChatOutline,
+  CyclesOutline,
+  DuplicateOfOutline,
+  EpicOutline,
+  GridOutline,
+  IntakeOutline,
+  LabelsOutline,
+  LinkOutline,
+  MembersOutline,
+  ModuleOutline,
+  RelatesToOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
+import { BlockedIcon, BlockerIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IIssueActivity } from "@plane/types";
 import { renderFormattedDate, generateWorkItemLink, capitalizeFirstLetter } from "@plane/utils";
@@ -184,7 +179,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <Users2Icon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <MembersOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   archived_at: {
     message: (activity) => {
@@ -201,7 +196,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <ArchiveIcon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <ArchiveOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   attachment: {
     message: (activity, showIssue) => {
@@ -230,7 +225,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <PaperclipIcon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <AttachOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   description: {
     message: (activity, showIssue) => (
@@ -244,7 +239,7 @@ const activityDetails: {
         )}
       </>
     ),
-    icon: <MessageSquareIcon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <ChatOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   estimate_point: {
     message: (activity, showIssue) => {
@@ -296,7 +291,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <WorkItemsIcon width={12} height={12} className="text-secondary" aria-hidden="true" />,
+    icon: <WorkItemsOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   epic: {
     message: (activity) => {
@@ -319,7 +314,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <EpicIcon width={12} height={12} className="text-secondary" aria-hidden="true" />,
+    icon: <EpicOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   labels: {
     message: (activity, showIssue, workspaceSlug) => {
@@ -356,7 +351,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <TagIcon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <LabelsOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   link: {
     message: (activity, showIssue) => {
@@ -421,7 +416,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <Link2Icon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <LinkOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   cycles: {
     message: (activity, showIssue, workspaceSlug) => {
@@ -471,7 +466,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <CycleIcon height={12} width={12} className="text-secondary" aria-hidden="true" />,
+    icon: <CyclesOutline height={12} width={12} className="text-secondary" aria-hidden="true" />,
   },
   modules: {
     message: (activity, showIssue, workspaceSlug) => {
@@ -518,7 +513,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <ModuleIcon className="h-3 w-3 !text-secondary" aria-hidden="true" />,
+    icon: <ModuleOutline className="h-3 w-3 !text-secondary" aria-hidden="true" />,
   },
   name: {
     message: (activity, showIssue) => (
@@ -532,7 +527,7 @@ const activityDetails: {
         )}
       </>
     ),
-    icon: <MessageSquareIcon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <ChatOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   parent: {
     message: (activity, showIssue) => {
@@ -561,7 +556,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <UsersIcon className="h-3 w-3 !text-secondary" aria-hidden="true" />,
+    icon: <MembersOutline className="h-3 w-3 !text-secondary" aria-hidden="true" />,
   },
   priority: {
     message: (activity, showIssue) => (
@@ -597,7 +592,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <RelatedIcon height="12" width="12" className="text-secondary" />,
+    icon: <RelatesToOutline height="12" width="12" className="text-secondary" />,
   },
   blocking: {
     message: (activity, showIssue) => {
@@ -654,7 +649,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <CopyPlus size={12} className="text-secondary" />,
+    icon: <DuplicateOfOutline width={12} height={12} className="text-secondary" />,
   },
   state: {
     message: (activity, showIssue) => (
@@ -668,7 +663,7 @@ const activityDetails: {
         )}
       </>
     ),
-    icon: <LayoutGridIcon size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <GridOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   start_date: {
     message: (activity, showIssue) => {
@@ -700,7 +695,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <Calendar size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <CalendarOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   target_date: {
     message: (activity, showIssue) => {
@@ -731,7 +726,7 @@ const activityDetails: {
           </>
         );
     },
-    icon: <Calendar size={12} className="text-secondary" aria-hidden="true" />,
+    icon: <CalendarOutline width={12} height={12} className="text-secondary" aria-hidden="true" />,
   },
   inbox: {
     message: (activity, showIssue) => (
@@ -746,7 +741,7 @@ const activityDetails: {
         {activity.verb === "2" && ` from intake by marking a duplicate work item.`}
       </>
     ),
-    icon: <IntakeIcon className="size-3 text-secondary" aria-hidden="true" />,
+    icon: <IntakeOutline className="size-3 text-secondary" aria-hidden="true" />,
   },
 };
 
diff --git a/apps/web/core/components/core/description-versions/dropdown.tsx b/apps/web/core/components/core/description-versions/dropdown.tsx
index 7749066444f..4f684b02305 100644
--- a/apps/web/core/components/core/description-versions/dropdown.tsx
+++ b/apps/web/core/components/core/description-versions/dropdown.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { History } from "lucide-react";
+import { HistoryOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import type { TDescriptionVersion } from "@plane/types";
@@ -42,7 +42,7 @@ export const DescriptionVersionsDropdown = observer(function DescriptionVersions
       label={
         <div className="flex items-center gap-1 text-tertiary">
           <span className="grid size-4 flex-shrink-0 place-items-center">
-            <History className="size-3.5" />
+            <HistoryOutline className="size-3.5" />
           </span>
           <p className="text-11">
             {t("description_versions.last_edited_by")}{" "}
diff --git a/apps/web/core/components/core/description-versions/modal.tsx b/apps/web/core/components/core/description-versions/modal.tsx
index 0fccccf113d..6ded29e8200 100644
--- a/apps/web/core/components/core/description-versions/modal.tsx
+++ b/apps/web/core/components/core/description-versions/modal.tsx
@@ -11,7 +11,7 @@ import { Avatar } from "@makeplane/propel/components/avatar";
 import type { EditorRefApi } from "@plane/editor";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CopyIcon, ChevronLeftIcon, ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronLeftOutline, ChevronRightOutline, CopyOutline } from "@makeplane/propel/icons";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TDescriptionVersion } from "@plane/types";
@@ -107,7 +107,7 @@ export const DescriptionVersionsModal = observer(function DescriptionVersionsMod
               })}
               disabled={isPrevDisabled}
             >
-              <ChevronLeftIcon className="size-4" />
+              <ChevronLeftOutline className="size-4" />
             </button>
             <button
               type="button"
@@ -118,7 +118,7 @@ export const DescriptionVersionsModal = observer(function DescriptionVersionsMod
               })}
               disabled={isNextDisabled}
             >
-              <ChevronRightIcon className="size-4" />
+              <ChevronRightOutline className="size-4" />
             </button>
           </div>
         </div>
@@ -159,7 +159,7 @@ export const DescriptionVersionsModal = observer(function DescriptionVersionsMod
         {/* Footer */}
         <div className="flex items-center justify-between gap-2 border-t-[0.5px] border-subtle pt-4">
           <Tooltip label={t("common.actions.copy_markdown")}>
-            <IconButton type="button" variant="ghost" size="base" onClick={handleCopyMarkdown} icon={CopyIcon} />
+            <IconButton type="button" variant="ghost" size="base" onClick={handleCopyMarkdown} icon={CopyOutline} />
           </Tooltip>
           <div className="flex items-center gap-2">
             <Button variant="secondary" size="lg" onClick={handleClose} tabIndex={1}>
diff --git a/apps/web/core/components/core/filters/date-filter-modal.tsx b/apps/web/core/components/core/filters/date-filter-modal.tsx
index 0f1ac2c53c6..1fcbecbd79b 100644
--- a/apps/web/core/components/core/filters/date-filter-modal.tsx
+++ b/apps/web/core/components/core/filters/date-filter-modal.tsx
@@ -7,7 +7,7 @@
 import { Controller, useForm } from "react-hook-form";
 import { Button } from "@plane/propel/button";
 import { Calendar } from "@plane/propel/calendar";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
 import { renderFormattedPayloadDate, renderFormattedDate, getDate } from "@plane/utils";
 import { DateFilterSelect } from "./date-filter-select";
@@ -61,7 +61,7 @@ export function DateFilterModal({ title, handleClose, isOpen, onSelect }: Props)
               <DateFilterSelect title={title} value={value} onChange={onChange} />
             )}
           />
-          <CloseIcon className="h-4 w-4 cursor-pointer" onClick={handleClose} />
+          <CloseOutline className="h-4 w-4 cursor-pointer" onClick={handleClose} />
         </div>
         <div className="flex w-full justify-between gap-4">
           <Controller
diff --git a/apps/web/core/components/core/filters/date-filter-select.tsx b/apps/web/core/components/core/filters/date-filter-select.tsx
index fd106a9fbe8..13c18350476 100644
--- a/apps/web/core/components/core/filters/date-filter-select.tsx
+++ b/apps/web/core/components/core/filters/date-filter-select.tsx
@@ -5,7 +5,7 @@
  */
 
 import React from "react";
-import { CalendarDays } from "lucide-react";
+import { CalendarOutline } from "@makeplane/propel/icons";
 // ui
 import { CalendarAfterIcon, CalendarBeforeIcon } from "@plane/propel/icons";
 import { CustomSelect } from "@plane/ui";
@@ -36,7 +36,7 @@ const dueDateRange: DueDate[] = [
   {
     name: "range",
     value: "range",
-    icon: <CalendarDays className="h-4 w-4" />,
+    icon: <CalendarOutline className="h-4 w-4" />,
   },
 ];
 
diff --git a/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx b/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx
index 1d7b4099a06..0c89899a29a 100644
--- a/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx
+++ b/apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx
@@ -14,7 +14,7 @@ import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { SearchIcon } from "@plane/propel/icons";
+import { SearchOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { ISearchIssueResponse, IUser } from "@plane/types";
 import { EIssuesStoreType } from "@plane/types";
@@ -171,7 +171,7 @@ export const BulkDeleteIssuesModal = observer(function BulkDeleteIssuesModal(pro
           }}
         >
           <div className="relative m-1">
-            <SearchIcon
+            <SearchOutline
               className="text-opacity-40 pointer-events-none absolute top-3.5 left-4 h-5 w-5 text-primary"
               aria-hidden="true"
             />
diff --git a/apps/web/core/components/core/modals/existing-issues-list-modal.tsx b/apps/web/core/components/core/modals/existing-issues-list-modal.tsx
index b67632d3c62..f0967c87e04 100644
--- a/apps/web/core/components/core/modals/existing-issues-list-modal.tsx
+++ b/apps/web/core/components/core/modals/existing-issues-list-modal.tsx
@@ -5,13 +5,12 @@
  */
 
 import { useEffect, useState, useRef } from "react";
-import { Rocket } from "lucide-react";
+import { CloseOutline, RocketOutline, SearchOutline } from "@makeplane/propel/icons";
 import { Combobox } from "@headlessui/react";
 // i18n
 import { useTranslation } from "@plane/i18n";
 // types
 import { Button } from "@plane/propel/button";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { ISearchIssueResponse, TProjectIssuesSearchParams } from "@plane/types";
@@ -148,7 +147,7 @@ export function ExistingIssuesListModal(props: Props) {
         }}
       >
         <div className="relative m-1">
-          <SearchIcon
+          <SearchOutline
             className="text-opacity-40 pointer-events-none absolute top-3.5 left-4 h-5 w-5 text-primary"
             aria-hidden="true"
           />
@@ -182,7 +181,7 @@ export function ExistingIssuesListModal(props: Props) {
                     className="group p-1"
                     onClick={() => setSelectedIssues((prevData) => prevData.filter((i) => i.id !== issue.id))}
                   >
-                    <CloseIcon className="h-3 w-3 text-secondary group-hover:text-primary" />
+                    <CloseOutline className="h-3 w-3 text-secondary group-hover:text-primary" />
                   </button>
                 </div>
               ))}
@@ -301,7 +300,7 @@ export function ExistingIssuesListModal(props: Props) {
                           rel="noopener noreferrer"
                           onClick={(e) => e.stopPropagation()}
                         >
-                          <Rocket className="h-4 w-4" />
+                          <RocketOutline className="h-4 w-4" />
                         </a>
                       </Combobox.Option>
                     );
diff --git a/apps/web/core/components/core/modals/gpt-assistant-popover.tsx b/apps/web/core/components/core/modals/gpt-assistant-popover.tsx
index cf087779d29..58423c5f93f 100644
--- a/apps/web/core/components/core/modals/gpt-assistant-popover.tsx
+++ b/apps/web/core/components/core/modals/gpt-assistant-popover.tsx
@@ -9,7 +9,7 @@ import React, { useEffect, useState, useRef, Fragment } from "react";
 import type { Placement } from "@popperjs/core";
 import { Controller, useForm } from "react-hook-form"; // services
 import { usePopper } from "react-popper";
-import { AlertCircle } from "lucide-react";
+import { WarningCircleOutline } from "@makeplane/propel/icons";
 import { Popover, Transition } from "@headlessui/react";
 // plane imports
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -284,7 +284,7 @@ export function GptAssistantPopover(props: Props) {
             ) : (
               <>
                 <div className="flex items-start justify-center gap-2 text-13 text-accent-primary">
-                  <AlertCircle className="h-4 w-4" />
+                  <WarningCircleOutline className="h-4 w-4" />
                   <p>By using this feature, you consent to sharing the message with a 3rd party service. </p>
                 </div>
               </>
diff --git a/apps/web/core/components/core/modals/user-image-upload-modal.tsx b/apps/web/core/components/core/modals/user-image-upload-modal.tsx
index ff688c7285e..5bca711edc0 100644
--- a/apps/web/core/components/core/modals/user-image-upload-modal.tsx
+++ b/apps/web/core/components/core/modals/user-image-upload-modal.tsx
@@ -10,7 +10,7 @@ import { useDropzone } from "react-dropzone";
 // plane imports
 import { ACCEPTED_AVATAR_IMAGE_MIME_TYPES_FOR_REACT_DROPZONE, MAX_FILE_SIZE } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { UserCirclePropertyIcon } from "@plane/propel/icons";
+import { UserOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EFileAssetType } from "@plane/types";
 import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
@@ -123,7 +123,7 @@ export const UserImageUploadModal = observer(function UserImageUploadModal(props
                 </>
               ) : (
                 <div>
-                  <UserCirclePropertyIcon className="mx-auto h-16 w-16 text-secondary" />
+                  <UserOutline className="mx-auto h-16 w-16 text-secondary" />
                   <span className="mt-2 block text-13 font-medium text-secondary">
                     {isDragActive ? "Drop image here to upload" : "Drag & drop image here"}
                   </span>
diff --git a/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx b/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx
index c22ce52aad9..2eead1677e7 100644
--- a/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx
+++ b/apps/web/core/components/core/modals/workspace-image-upload-modal.tsx
@@ -11,7 +11,7 @@ import { useDropzone } from "react-dropzone";
 // plane imports
 import { ACCEPTED_AVATAR_IMAGE_MIME_TYPES_FOR_REACT_DROPZONE, MAX_FILE_SIZE } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { UserCirclePropertyIcon } from "@plane/propel/icons";
+import { UserOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EFileAssetType } from "@plane/types";
 import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
@@ -136,7 +136,7 @@ export const WorkspaceImageUploadModal = observer(function WorkspaceImageUploadM
                 </>
               ) : (
                 <div>
-                  <UserCirclePropertyIcon className="mx-auto h-16 w-16 text-secondary" />
+                  <UserOutline className="mx-auto h-16 w-16 text-secondary" />
                   <span className="mt-2 block text-13 font-medium text-secondary">
                     {isDragActive ? "Drop image here to upload" : "Drag & drop image here"}
                   </span>
diff --git a/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx b/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx
index 39f104d3583..e8e7f943e60 100644
--- a/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx
+++ b/apps/web/core/components/core/sidebar/sidebar-menu-hamburger-toggle.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { PanelRight } from "lucide-react";
+import { RightSidePaneOutline } from "@makeplane/propel/icons";
 import { useAppTheme } from "@/hooks/store/use-app-theme";
 
 export const SidebarHamburgerToggle = observer(function SidebarHamburgerToggle() {
@@ -24,7 +24,7 @@ export const SidebarHamburgerToggle = observer(function SidebarHamburgerToggle()
       className="group grid size-7 flex-shrink-0 place-items-center rounded-sm bg-surface-2 transition-all hover:bg-layer-1"
       onClick={handleClick}
     >
-      <PanelRight className="size-3.5 text-secondary transition-all group-hover:text-primary" />
+      <RightSidePaneOutline className="size-3.5 text-secondary transition-all group-hover:text-primary" />
     </button>
   );
 });
diff --git a/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx b/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx
index 8af71f6278e..493f4dc5826 100644
--- a/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx
+++ b/apps/web/core/components/cycles/active-cycle/cycle-stats.tsx
@@ -8,7 +8,7 @@ import { Fragment, useCallback, useRef, useState } from "react";
 import { isEmpty } from "lodash-es";
 import { observer } from "mobx-react";
 import { useTheme } from "next-themes";
-import { CalendarCheck } from "lucide-react";
+import { CompletedAtOutline } from "@makeplane/propel/icons";
 // headless ui
 import { Tab } from "@headlessui/react";
 // plane imports
@@ -226,7 +226,7 @@ export const ActiveCycleStats = observer(function ActiveCycleStats(props: Active
                             {issue.target_date && (
                               <Tooltip label={`Target Date: ${renderFormattedDate(issue.target_date) ?? ""}`}>
                                 <div className="flex h-full cursor-pointer items-center gap-1.5 truncate rounded-sm bg-layer-1 px-2 py-0.5 text-11 group-hover:bg-surface-1">
-                                  <CalendarCheck className="h-3 w-3 flex-shrink-0" />
+                                  <CompletedAtOutline className="h-3 w-3 flex-shrink-0" />
                                   <span className="truncate text-11">
                                     {renderFormattedDateWithoutYear(issue.target_date)}
                                   </span>
diff --git a/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx b/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx
index 0dbdfc6837f..52eec26b28e 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/issue-progress.tsx
@@ -11,7 +11,7 @@ import { useSearchParams } from "next/navigation";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { ChevronUpIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, ChevronUpOutline } from "@makeplane/propel/icons";
 import type { ICycle, TCyclePlotType, TProgressSnapshot } from "@plane/types";
 import { EIssuesStoreType } from "@plane/types";
 import { getDate } from "@plane/utils";
@@ -115,9 +115,9 @@ export const CycleAnalyticsProgress = observer(function CycleAnalyticsProgress(p
                 </Disclosure.Button>
                 <Disclosure.Button className="ml-auto">
                   {open ? (
-                    <ChevronUpIcon className="h-3.5 w-3.5" aria-hidden="true" />
+                    <ChevronUpOutline className="h-3.5 w-3.5" aria-hidden="true" />
                   ) : (
-                    <ChevronDownIcon className="h-3.5 w-3.5" aria-hidden="true" />
+                    <ChevronDownOutline className="h-3.5 w-3.5" aria-hidden="true" />
                   )}
                 </Disclosure.Button>
               </div>
diff --git a/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx b/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx
index f1645397a52..e627c1b99be 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/sidebar-details.tsx
@@ -7,12 +7,11 @@
 import React from "react";
 import { isEmpty } from "lodash-es";
 import { observer } from "mobx-react";
-import { SquareUser } from "lucide-react";
+import { MembersOutline, UserAltOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 // plane types
 import { EEstimateSystem } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Avatar } from "@makeplane/propel/components/avatar";
-import { MembersPropertyIcon, WorkItemsIcon } from "@plane/propel/icons";
 import type { ICycle } from "@plane/types";
 // plane ui
 import { TextArea } from "@plane/ui";
@@ -80,7 +79,7 @@ export const CycleSidebarDetails = observer(function CycleSidebarDetails(props:
       <div className="flex flex-col gap-5 pt-2.5 pb-6">
         <div className="flex items-center justify-start gap-1">
           <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-            <SquareUser className="h-4 w-4" />
+            <UserAltOutline className="h-4 w-4" />
             <span className="text-14">{t("lead")}</span>
           </div>
           <div className="flex w-3/5 items-center rounded-xs">
@@ -98,7 +97,7 @@ export const CycleSidebarDetails = observer(function CycleSidebarDetails(props:
 
         <div className="flex items-center justify-start gap-1">
           <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-            <MembersPropertyIcon className="h-4 w-4" />
+            <MembersOutline className="h-4 w-4" />
             <span className="text-14">{t("members")}</span>
           </div>
           <div className="flex w-3/5 items-center rounded-xs">
@@ -128,7 +127,7 @@ export const CycleSidebarDetails = observer(function CycleSidebarDetails(props:
 
         <div className="flex items-center justify-start gap-1">
           <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-            <WorkItemsIcon className="h-4 w-4" />
+            <WorkItemsOutline className="h-4 w-4" />
             <span className="text-14">{t("work_items")}</span>
           </div>
           <div className="flex w-3/5 items-center">
@@ -142,7 +141,7 @@ export const CycleSidebarDetails = observer(function CycleSidebarDetails(props:
         {isEstimatePointValid && !isCompleted && (
           <div className="flex items-center justify-start gap-1">
             <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-              <WorkItemsIcon className="h-4 w-4" />
+              <WorkItemsOutline className="h-4 w-4" />
               <span className="text-14">{t("points")}</span>
             </div>
             <div className="flex w-3/5 items-center">
diff --git a/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx b/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx
index 7c48a7d3d7a..634cd11721d 100644
--- a/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx
+++ b/apps/web/core/components/cycles/analytics-sidebar/sidebar-header.tsx
@@ -10,7 +10,7 @@ import { Controller, useForm } from "react-hook-form";
 // Plane Imports
 import { CYCLE_STATUS, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { ICycle } from "@plane/types";
 import { getDate, renderFormattedPayloadDate } from "@plane/utils";
@@ -126,7 +126,7 @@ export const CycleSidebarHeader = observer(function CycleSidebarHeader(props: Pr
             className="flex size-6 flex-shrink-0 items-center justify-center rounded-full bg-layer-3 hover:bg-layer-3-hover"
             onClick={() => handleClose()}
           >
-            <ChevronRightIcon className="size-4 stroke-2 text-secondary" />
+            <ChevronRightOutline className="size-4 text-secondary" />
           </button>
         </div>
       </div>
diff --git a/apps/web/core/components/cycles/applied-filters/date.tsx b/apps/web/core/components/cycles/applied-filters/date.tsx
index 798d1a60ebb..4ffc76adccb 100644
--- a/apps/web/core/components/cycles/applied-filters/date.tsx
+++ b/apps/web/core/components/cycles/applied-filters/date.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // helpers
 import { DATE_AFTER_FILTER_OPTIONS } from "@plane/constants";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { renderFormattedDate, capitalizeFirstLetter } from "@plane/utils";
 // constants
 
@@ -50,7 +50,7 @@ export const AppliedDateFilters = observer(function AppliedDateFilters(props: Pr
               className="grid place-items-center text-tertiary hover:text-secondary"
               onClick={() => handleRemove(date)}
             >
-              <CloseIcon height={10} width={10} strokeWidth={2} />
+              <CloseOutline height={10} width={10} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/cycles/applied-filters/root.tsx b/apps/web/core/components/cycles/applied-filters/root.tsx
index 5d340c8dc52..4ec777c6ef2 100644
--- a/apps/web/core/components/cycles/applied-filters/root.tsx
+++ b/apps/web/core/components/cycles/applied-filters/root.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { PillButton } from "@makeplane/propel/components/pill";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TCycleFilters } from "@plane/types";
 import { replaceUnderscoreIfSnakeCase } from "@plane/utils";
 // hooks
@@ -76,7 +76,7 @@ export const CycleAppliedFiltersList = observer(function CycleAppliedFiltersList
                   className="grid place-items-center text-tertiary hover:text-secondary"
                   onClick={() => handleRemoveFilter(filterKey, null)}
                 >
-                  <CloseIcon height={12} width={12} strokeWidth={2} />
+                  <CloseOutline height={12} width={12} />
                 </button>
               )}
             </div>
@@ -89,7 +89,7 @@ export const CycleAppliedFiltersList = observer(function CycleAppliedFiltersList
           size="md"
           variant="outline"
           label={t("common.clear_all")}
-          endIcon={<CloseIcon height={12} width={12} strokeWidth={2} />}
+          endIcon={<CloseOutline height={12} width={12} />}
           onClick={handleClearAllFilters}
         />
       )}
diff --git a/apps/web/core/components/cycles/applied-filters/status.tsx b/apps/web/core/components/cycles/applied-filters/status.tsx
index 3a077748db7..6668e7ad734 100644
--- a/apps/web/core/components/cycles/applied-filters/status.tsx
+++ b/apps/web/core/components/cycles/applied-filters/status.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 // plane imports
 import { CYCLE_STATUS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 type Props = {
@@ -41,7 +41,7 @@ export const AppliedStatusFilters = observer(function AppliedStatusFilters(props
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(status)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/cycles/archived-cycles/header.tsx b/apps/web/core/components/cycles/archived-cycles/header.tsx
index 64980a7f6d8..1bb057d767d 100644
--- a/apps/web/core/components/cycles/archived-cycles/header.tsx
+++ b/apps/web/core/components/cycles/archived-cycles/header.tsx
@@ -8,9 +8,8 @@ import { useCallback, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { ListFilter } from "lucide-react";
+import { CloseOutline, FilterOutline, SearchOutline } from "@makeplane/propel/icons";
 import { useOutsideClickDetector } from "@plane/hooks";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
 // plane helpers
 // types
 import type { TCycleFilters } from "@plane/types";
@@ -86,7 +85,7 @@ export const ArchivedCyclesHeader = observer(function ArchivedCyclesHeader() {
               inputRef.current?.focus();
             }}
           >
-            <SearchIcon className="h-3.5 w-3.5" />
+            <SearchOutline className="h-3.5 w-3.5" />
           </button>
         )}
         <div
@@ -97,7 +96,7 @@ export const ArchivedCyclesHeader = observer(function ArchivedCyclesHeader() {
             }
           )}
         >
-          <SearchIcon className="h-3.5 w-3.5" />
+          <SearchOutline className="h-3.5 w-3.5" />
           <input
             ref={inputRef}
             className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -115,12 +114,12 @@ export const ArchivedCyclesHeader = observer(function ArchivedCyclesHeader() {
                 setIsSearchOpen(false);
               }}
             >
-              <CloseIcon className="h-3 w-3" />
+              <CloseOutline className="h-3 w-3" />
             </button>
           )}
         </div>
         <FiltersDropdown
-          icon={<ListFilter className="h-3 w-3" />}
+          icon={<FilterOutline className="h-3 w-3" />}
           title="Filters"
           placement="bottom-end"
           isFiltersApplied={isFiltersApplied}
diff --git a/apps/web/core/components/cycles/cycles-view-header.tsx b/apps/web/core/components/cycles/cycles-view-header.tsx
index 8c3cd0a0c9b..a242c1a8e58 100644
--- a/apps/web/core/components/cycles/cycles-view-header.tsx
+++ b/apps/web/core/components/cycles/cycles-view-header.tsx
@@ -6,12 +6,11 @@
 
 import { useCallback, useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
-import { ListFilter } from "lucide-react";
+import { CloseOutline, FilterOutline, SearchOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useOutsideClickDetector } from "@plane/hooks";
 import { IconButton } from "@plane/propel/icon-button";
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
 import type { TCycleFilters } from "@plane/types";
 import { cn, calculateTotalFilters } from "@plane/utils";
 // components
@@ -85,7 +84,7 @@ export const CyclesViewHeader = observer(function CyclesViewHeader(props: Props)
             setIsSearchOpen(true);
             inputRef.current?.focus();
           }}
-          icon={SearchIcon}
+          icon={SearchOutline}
         />
       ) : (
         <div
@@ -96,7 +95,7 @@ export const CyclesViewHeader = observer(function CyclesViewHeader(props: Props)
             }
           )}
         >
-          <SearchIcon className="h-3.5 w-3.5" />
+          <SearchOutline className="h-3.5 w-3.5" />
           <input
             ref={inputRef}
             className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -114,14 +113,14 @@ export const CyclesViewHeader = observer(function CyclesViewHeader(props: Props)
                 setIsSearchOpen(false);
               }}
             >
-              <CloseIcon className="h-3 w-3" />
+              <CloseOutline className="h-3 w-3" />
             </button>
           )}
         </div>
       )}
 
       <FiltersDropdown
-        icon={<ListFilter className="h-3 w-3" />}
+        icon={<FilterOutline className="h-3 w-3" />}
         title={t("common.filters")}
         placement="bottom-end"
         isFiltersApplied={isFiltersApplied}
diff --git a/apps/web/core/components/cycles/dropdowns/filters/root.tsx b/apps/web/core/components/cycles/dropdowns/filters/root.tsx
index 3f1aa8cdc67..5ed41edc705 100644
--- a/apps/web/core/components/cycles/dropdowns/filters/root.tsx
+++ b/apps/web/core/components/cycles/dropdowns/filters/root.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TCycleFilters, TCycleGroups } from "@plane/types";
 // hooks
@@ -33,7 +33,7 @@ export const CycleFiltersSelection = observer(function CycleFiltersSelection(pro
     <div className="flex h-full w-full flex-col overflow-hidden">
       <div className="bg-surface-1 p-2.5 pb-0">
         <div className="flex items-center gap-1.5 rounded-sm border-[0.5px] border-subtle bg-surface-2 px-1.5 py-1 text-11">
-          <SearchIcon className="text-placeholder" width={12} height={12} strokeWidth={2} />
+          <SearchOutline className="text-placeholder" width={12} height={12} />
           <input
             type="text"
             className="w-full bg-surface-2 outline-none placeholder:text-placeholder"
@@ -44,7 +44,7 @@ export const CycleFiltersSelection = observer(function CycleFiltersSelection(pro
           />
           {filtersSearchQuery !== "" && (
             <button type="button" className="grid place-items-center" onClick={() => setFiltersSearchQuery("")}>
-              <CloseIcon className="text-tertiary" height={12} width={12} strokeWidth={2} />
+              <CloseOutline className="text-tertiary" height={12} width={12} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/cycles/list/cycle-list-group-header.tsx b/apps/web/core/components/cycles/list/cycle-list-group-header.tsx
index 9b3578639af..e9189d051ff 100644
--- a/apps/web/core/components/cycles/list/cycle-list-group-header.tsx
+++ b/apps/web/core/components/cycles/list/cycle-list-group-header.tsx
@@ -6,7 +6,8 @@
 
 import React from "react";
 // types
-import { CycleGroupIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { CycleGroupIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import type { TCycleGroups } from "@plane/types";
 // icons
 import { Row } from "@plane/ui";
@@ -35,7 +36,7 @@ export function CycleListGroupHeader(props: Props) {
           {showCount && <div className="pl-2 text-13 font-medium text-tertiary">{`${count ?? "0"}`}</div>}
         </div>
       </div>
-      <ChevronDownIcon
+      <ChevronDownOutline
         className={cn("size-4 shrink-0 text-tertiary transition-transform", {
           "rotate-180": isExpanded,
         })}
diff --git a/apps/web/core/components/cycles/list/cycle-list-item-action.tsx b/apps/web/core/components/cycles/list/cycle-list-item-action.tsx
index 332eabb838c..985bdc6b66e 100644
--- a/apps/web/core/components/cycles/list/cycle-list-item-action.tsx
+++ b/apps/web/core/components/cycles/list/cycle-list-item-action.tsx
@@ -9,13 +9,18 @@ import React, { useEffect, useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams, usePathname, useSearchParams } from "next/navigation";
 import { useForm } from "react-hook-form";
-import { Eye, CalendarDays } from "lucide-react";
+import {
+  CalendarOutline,
+  MembersOutline,
+  ShowOutline,
+  TransferWorkItemOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel, IS_FAVORITE_MENU_OPEN } from "@plane/constants";
 import { useLocalStorage } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
 import { Avatar } from "@makeplane/propel/components/avatar";
-import { TransferIcon, WorkItemsIcon, MembersPropertyIcon } from "@plane/propel/icons";
 import { setPromiseToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { ICycle, TCycleGroups } from "@plane/types";
@@ -184,12 +189,12 @@ export const CycleListItemAction = observer(function CycleListItemAction(props:
         onClick={openCycleOverview}
         className={`z-[1] flex flex-shrink-0 gap-1 text-11 text-accent-secondary ${isMobile || (isActive && !searchParams.has("peekCycle")) ? "flex" : "hidden group-hover:flex"}`}
       >
-        <Eye className="my-auto h-4 w-4 text-accent-secondary" />
+        <ShowOutline className="my-auto h-4 w-4 text-accent-secondary" />
         <span>{t("project_cycles.more_details")}</span>
       </button>
       {showIssueCount && (
         <div className="flex items-center gap-1">
-          <WorkItemsIcon className="h-4 w-4 text-tertiary" />
+          <WorkItemsOutline className="h-4 w-4 text-tertiary" />
           <span className="text-11 text-tertiary">{cycleDetails.total_issues}</span>
         </div>
       )}
@@ -201,7 +206,7 @@ export const CycleListItemAction = observer(function CycleListItemAction(props:
             setTransferIssuesModal(true);
           }}
         >
-          <TransferIcon className="w-4 fill-accent-primary" />
+          <TransferWorkItemOutline className="w-4 fill-accent-primary" />
           <span>{t("project_cycles.transfer_work_items", { count: transferableIssuesCount })}</span>
         </div>
       )}
@@ -217,7 +222,7 @@ export const CycleListItemAction = observer(function CycleListItemAction(props:
               disabled={!isProjectTimeZoneDifferent()}
             >
               <div className="flex items-center gap-1 text-11 font-medium text-tertiary">
-                <CalendarDays className="my-auto h-3 w-3 flex-shrink-0" />
+                <CalendarOutline className="my-auto h-3 w-3 flex-shrink-0" />
                 <MergedDateDisplay startDate={cycleDetails.start_date} endDate={cycleDetails.end_date} />
               </div>
             </Tooltip>
@@ -282,7 +287,7 @@ export const CycleListItemAction = observer(function CycleListItemAction(props:
                 })}
               </AvatarGroupOverflow>
             ) : (
-              <MembersPropertyIcon className="h-4 w-4 text-tertiary" />
+              <MembersOutline className="h-4 w-4 text-tertiary" />
             )}
           </div>
         </Tooltip>
diff --git a/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx b/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx
index 3d836dac0b4..7720eee8a04 100644
--- a/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx
+++ b/apps/web/core/components/cycles/list/cycle-list-project-group-header.tsx
@@ -7,7 +7,7 @@
 import React from "react";
 import { observer } from "mobx-react";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline } from "@makeplane/propel/icons";
 // icons
 import { Row } from "@plane/ui";
 // helpers
@@ -31,11 +31,10 @@ export const CycleListProjectGroupHeader = observer(function CycleListProjectGro
   if (!project) return null;
   return (
     <Row className="flex flex-shrink-0 items-center gap-2 py-2.5">
-      <ChevronRightIcon
+      <ChevronRightOutline
         className={cn("h-4 w-4 text-tertiary duration-300", {
           "rotate-90": isExpanded,
         })}
-        strokeWidth={2}
       />
       <div className="flex size-4 flex-shrink-0 items-center justify-center overflow-hidden">
         <Logo logo={project.logo_props} size={16} />
diff --git a/apps/web/core/components/cycles/list/cycles-list-item.tsx b/apps/web/core/components/cycles/list/cycles-list-item.tsx
index 1b28d95e1d7..0b42e3002ee 100644
--- a/apps/web/core/components/cycles/list/cycles-list-item.tsx
+++ b/apps/web/core/components/cycles/list/cycles-list-item.tsx
@@ -9,7 +9,7 @@ import { useRef } from "react";
 import { observer } from "mobx-react";
 import { usePathname, useSearchParams } from "next/navigation";
 import { CircularProgress } from "@makeplane/propel/components/circular-progress";
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TCycleGroups } from "@plane/types";
 // components
@@ -97,7 +97,7 @@ export const CyclesListItem = observer(function CyclesListItem(props: TCyclesLis
           </div>
           <div className="pointer-events-none absolute inset-0 flex items-center justify-center">
             {progress === 100 ? (
-              <CheckIcon className="h-3 w-3 stroke-2" />
+              <TickOutline className="h-3 w-3" />
             ) : (
               <span className="text-9 text-primary">{`${progress}%`}</span>
             )}
diff --git a/apps/web/core/components/cycles/quick-actions.tsx b/apps/web/core/components/cycles/quick-actions.tsx
index 7b4579accf4..8a9978be52b 100644
--- a/apps/web/core/components/cycles/quick-actions.tsx
+++ b/apps/web/core/components/cycles/quick-actions.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { MoreHorizontal } from "lucide-react";
+import { MoreHorizontalOutline } from "@makeplane/propel/icons";
 // ui
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -140,7 +140,7 @@ export const CycleQuickActions = observer(function CycleQuickActions(props: Prop
       )}
       <ContextMenu parentRef={parentRef} items={CONTEXT_MENU_ITEMS} />
       <CustomMenu
-        customButton={<IconButton variant="tertiary" size="lg" icon={MoreHorizontal} />}
+        customButton={<IconButton variant="tertiary" size="lg" icon={MoreHorizontalOutline} />}
         placement="bottom-end"
         closeOnSelect
         maxHeight="lg"
diff --git a/apps/web/core/components/cycles/transfer-issues-modal.tsx b/apps/web/core/components/cycles/transfer-issues-modal.tsx
index 3f1bda0d667..5bc87eb53db 100644
--- a/apps/web/core/components/cycles/transfer-issues-modal.tsx
+++ b/apps/web/core/components/cycles/transfer-issues-modal.tsx
@@ -7,8 +7,13 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { AlertCircle } from "lucide-react";
-import { SearchIcon, CycleIcon, TransferIcon, CloseIcon } from "@plane/propel/icons";
+import {
+  CloseOutline,
+  CyclesOutline,
+  SearchOutline,
+  TransferWorkItemOutline,
+  WarningCircleOutline,
+} from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EIssuesStoreType } from "@plane/types";
 import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
@@ -81,15 +86,15 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
       <div className="flex flex-col gap-4 py-5">
         <div className="flex items-center justify-between px-5">
           <div className="flex items-center gap-1">
-            <TransferIcon className="w-5 fill-primary" />
+            <TransferWorkItemOutline className="w-5 fill-primary" />
             <h4 className="text-18 font-medium text-primary">Transfer work items</h4>
           </div>
           <button onClick={handleClose}>
-            <CloseIcon className="h-4 w-4" />
+            <CloseOutline className="h-4 w-4" />
           </button>
         </div>
         <div className="flex items-center gap-2 border-b border-subtle px-5 pb-3">
-          <SearchIcon className="h-4 w-4 text-secondary" />
+          <SearchOutline className="h-4 w-4 text-secondary" />
           <input
             className="text-13 outline-none"
             placeholder="Search for a cycle..."
@@ -116,7 +121,7 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
                       handleClose();
                     }}
                   >
-                    <CycleIcon className="h-5 w-5" />
+                    <CyclesOutline className="h-5 w-5" />
                     <div className="flex w-full justify-between truncate">
                       <span className="truncate">{cycleDetails?.name}</span>
                       {cycleDetails.status && (
@@ -130,7 +135,7 @@ export const TransferIssuesModal = observer(function TransferIssuesModal(props:
               })
             ) : (
               <div className="flex w-full items-center justify-center gap-4 p-5 text-13">
-                <AlertCircle className="h-3.5 w-3.5 text-secondary" />
+                <WarningCircleOutline className="h-3.5 w-3.5 text-secondary" />
                 <span className="text-center text-secondary">
                   You don’t have any current cycle. Please create one to transfer the work items.
                 </span>
diff --git a/apps/web/core/components/cycles/transfer-issues.tsx b/apps/web/core/components/cycles/transfer-issues.tsx
index adbab83aa41..e4315b43e6e 100644
--- a/apps/web/core/components/cycles/transfer-issues.tsx
+++ b/apps/web/core/components/cycles/transfer-issues.tsx
@@ -5,10 +5,9 @@
  */
 
 import React from "react";
-import { AlertCircle } from "lucide-react";
+import { TransferWorkItemOutline, WarningCircleOutline } from "@makeplane/propel/icons";
 // ui
 import { Button } from "@plane/propel/button";
-import { TransferIcon } from "@plane/propel/icons";
 
 type Props = {
   handleClick: () => void;
@@ -21,13 +20,19 @@ export function TransferIssues(props: Props) {
   return (
     <div className="-mt-2 mb-4 flex items-center justify-between px-4 pt-6">
       <div className="flex items-center gap-2 text-13 text-secondary">
-        <AlertCircle className="h-3.5 w-3.5 text-secondary" />
+        <WarningCircleOutline className="h-3.5 w-3.5 text-secondary" />
         <span>Completed cycles are not editable.</span>
       </div>
 
       {canTransferIssues && (
         <div>
-          <Button variant="primary" size="lg" prependIcon={<TransferIcon />} onClick={handleClick} disabled={disabled}>
+          <Button
+            variant="primary"
+            size="lg"
+            prependIcon={<TransferWorkItemOutline />}
+            onClick={handleClick}
+            disabled={disabled}
+          >
             Transfer work items
           </Button>
         </div>
diff --git a/apps/web/core/components/dropdowns/cycle/cycle-options.tsx b/apps/web/core/components/dropdowns/cycle/cycle-options.tsx
index de03603defc..a34998ffd56 100644
--- a/apps/web/core/components/dropdowns/cycle/cycle-options.tsx
+++ b/apps/web/core/components/dropdowns/cycle/cycle-options.tsx
@@ -14,7 +14,8 @@ import { Combobox } from "@headlessui/react";
 // i18n
 import { useTranslation } from "@plane/i18n";
 // icon
-import { CheckIcon, CycleGroupIcon, CycleIcon, SearchIcon } from "@plane/propel/icons";
+import { CycleGroupIcon } from "@plane/propel/icons";
+import { CyclesOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import type { TCycleGroups } from "@plane/types";
 // ui
 // store hooks
@@ -113,7 +114,7 @@ export const CycleOptions = observer(function CycleOptions(props: CycleOptionsPr
       query: t("cycle.no_cycle"),
       content: (
         <div className="flex items-center gap-2">
-          <CycleIcon className="h-3 w-3 flex-shrink-0" />
+          <CyclesOutline className="h-3 w-3 flex-shrink-0" />
           <span className="flex-grow truncate">{t("cycle.no_cycle")}</span>
         </div>
       ),
@@ -132,7 +133,7 @@ export const CycleOptions = observer(function CycleOptions(props: CycleOptionsPr
         {...attributes.popper}
       >
         <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-          <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+          <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
           <Combobox.Input
             as="input"
             ref={inputRef}
@@ -161,7 +162,7 @@ export const CycleOptions = observer(function CycleOptions(props: CycleOptionsPr
                   {({ selected }) => (
                     <>
                       <span className="flex-grow truncate">{option.content}</span>
-                      {selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+                      {selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
                     </>
                   )}
                 </Combobox.Option>
diff --git a/apps/web/core/components/dropdowns/cycle/index.tsx b/apps/web/core/components/dropdowns/cycle/index.tsx
index 48a5f6e75a0..9d0b90ee18b 100644
--- a/apps/web/core/components/dropdowns/cycle/index.tsx
+++ b/apps/web/core/components/dropdowns/cycle/index.tsx
@@ -9,7 +9,7 @@ import { useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 // ui
-import { CycleIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, CyclesOutline } from "@makeplane/propel/icons";
 import { ComboDropDown } from "@plane/ui";
 // helpers
 import { cn } from "@plane/utils";
@@ -119,12 +119,12 @@ export const CycleDropdown = observer(function CycleDropdown(props: Props) {
         variant={buttonVariant}
         renderToolTipByDefault={renderByDefault}
       >
-        {!hideIcon && <CycleIcon className="h-3 w-3 flex-shrink-0" />}
+        {!hideIcon && <CyclesOutline className="h-3 w-3 flex-shrink-0" />}
         {BUTTON_VARIANTS_WITH_TEXT.includes(buttonVariant) && (!!selectedName || !!placeholder) && (
           <span className="max-w-40 truncate">{selectedName ?? placeholder}</span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </DropdownButton>
     </button>
diff --git a/apps/web/core/components/dropdowns/date-range.tsx b/apps/web/core/components/dropdowns/date-range.tsx
index 7160063f110..87c842b27e0 100644
--- a/apps/web/core/components/dropdowns/date-range.tsx
+++ b/apps/web/core/components/dropdowns/date-range.tsx
@@ -9,14 +9,13 @@ import type { Placement } from "@popperjs/core";
 import { observer } from "mobx-react";
 import { createPortal } from "react-dom";
 import { usePopper } from "react-popper";
-import { ArrowRight, CalendarDays } from "lucide-react";
+import { ArrowNarrowRightOutline, CalendarOutline, CloseOutline, DueDateOutline } from "@makeplane/propel/icons";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 // ui
 import type { DateRange, Matcher } from "@plane/propel/calendar";
 import { Calendar } from "@plane/propel/calendar";
-import { CloseIcon, DueDatePropertyIcon } from "@plane/propel/icons";
 import { ComboDropDown } from "@plane/ui";
 import { cn, renderFormattedDate } from "@plane/utils";
 // helpers
@@ -188,7 +187,7 @@ export const DateRangeDropdown = observer(function DateRangeDropdown(props: Prop
         {mergeDates ? (
           // Merged date display
           <div className="flex w-full items-center gap-1.5">
-            {!hideIcon.from && <CalendarDays className="h-3 w-3 flex-shrink-0" />}
+            {!hideIcon.from && <CalendarOutline className="h-3 w-3 flex-shrink-0" />}
             {dateRange.from || dateRange.to ? (
               <MergedDateDisplay
                 startDate={dateRange.from}
@@ -200,14 +199,14 @@ export const DateRangeDropdown = observer(function DateRangeDropdown(props: Prop
                 <>
                   <span className="text-placeholder">{placeholder.from}</span>
                   {placeholder.from && placeholder.to && (
-                    <ArrowRight className="h-3 w-3 flex-shrink-0 text-placeholder" />
+                    <ArrowNarrowRightOutline className="h-3 w-3 flex-shrink-0 text-placeholder" />
                   )}
                   <span className="text-placeholder">{placeholder.to}</span>
                 </>
               )
             )}
             {isClearable && !disabled && hasDisplayedDates && (
-              <CloseIcon
+              <CloseOutline
                 className={cn("h-2.5 w-2.5 flex-shrink-0 cursor-pointer", clearIconClassName)}
                 onClick={(e) => {
                   e.stopPropagation();
@@ -226,21 +225,21 @@ export const DateRangeDropdown = observer(function DateRangeDropdown(props: Prop
                 buttonFromDateClassName
               )}
             >
-              {!hideIcon.from && <CalendarDays className="h-3 w-3 flex-shrink-0" />}
+              {!hideIcon.from && <CalendarOutline className="h-3 w-3 flex-shrink-0" />}
               {dateRange.from ? renderFormattedDate(dateRange.from) : renderPlaceholder ? placeholder.from : ""}
             </span>
-            <ArrowRight className="h-3 w-3 flex-shrink-0" />
+            <ArrowNarrowRightOutline className="h-3 w-3 flex-shrink-0" />
             <span
               className={cn(
                 "flex h-full flex-grow items-center justify-center gap-1 rounded-xs",
                 buttonToDateClassName
               )}
             >
-              {!hideIcon.to && <DueDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+              {!hideIcon.to && <DueDateOutline className="h-3 w-3 flex-shrink-0" />}
               {dateRange.to ? renderFormattedDate(dateRange.to) : renderPlaceholder ? placeholder.to : ""}
             </span>
             {isClearable && !disabled && hasDisplayedDates && (
-              <CloseIcon
+              <CloseOutline
                 className={cn("ml-1 h-2.5 w-2.5 flex-shrink-0 cursor-pointer", clearIconClassName)}
                 onClick={(e) => {
                   e.stopPropagation();
diff --git a/apps/web/core/components/dropdowns/date.tsx b/apps/web/core/components/dropdowns/date.tsx
index 3857e94f4c4..2deffeba084 100644
--- a/apps/web/core/components/dropdowns/date.tsx
+++ b/apps/web/core/components/dropdowns/date.tsx
@@ -8,12 +8,11 @@ import React, { useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { createPortal } from "react-dom";
 import { usePopper } from "react-popper";
-import { CalendarDays } from "lucide-react";
+import { CalendarOutline, CloseOutline } from "@makeplane/propel/icons";
 import { Combobox } from "@headlessui/react";
 // ui
 import type { Matcher } from "@plane/propel/calendar";
 import { Calendar } from "@plane/propel/calendar";
-import { CloseIcon } from "@plane/propel/icons";
 import { ComboDropDown } from "@plane/ui";
 import { cn, renderFormattedDate, getDate } from "@plane/utils";
 // helpers
@@ -56,7 +55,7 @@ export const DateDropdown = observer(function DateDropdown(props: Props) {
     closeOnSelect = true,
     disabled = false,
     hideIcon = false,
-    icon = <CalendarDays className="h-3 w-3 flex-shrink-0" />,
+    icon = <CalendarOutline className="h-3 w-3 flex-shrink-0" />,
     isClearable = true,
     minDate,
     maxDate,
@@ -151,7 +150,7 @@ export const DateDropdown = observer(function DateDropdown(props: Props) {
           </span>
         )}
         {isClearable && !disabled && isDateSelected && (
-          <CloseIcon
+          <CloseOutline
             className={cn("h-2.5 w-2.5 flex-shrink-0", clearIconClassName)}
             onClick={(e) => {
               e.stopPropagation();
diff --git a/apps/web/core/components/dropdowns/estimate.tsx b/apps/web/core/components/dropdowns/estimate.tsx
index 6de8be09ef9..be37908e139 100644
--- a/apps/web/core/components/dropdowns/estimate.tsx
+++ b/apps/web/core/components/dropdowns/estimate.tsx
@@ -12,7 +12,7 @@ import { usePopper } from "react-popper";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, SearchIcon, EstimatePropertyIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, EstimateOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import { EEstimateSystem } from "@plane/types";
 import { ComboDropDown } from "@plane/ui";
 import { convertMinutesToHoursMinutesString, cn } from "@plane/utils";
@@ -110,7 +110,7 @@ export const EstimateDropdown = observer(function EstimateDropdown(props: Props)
           query: `${currentEstimatePoint?.value}`,
           content: (
             <div className="flex items-center gap-2">
-              <EstimatePropertyIcon className="h-3 w-3 flex-shrink-0" />
+              <EstimateOutline className="h-3 w-3 flex-shrink-0" />
               <span className="flex-grow truncate">
                 {currentActiveEstimate?.type === EEstimateSystem.TIME
                   ? convertMinutesToHoursMinutesString(Number(currentEstimatePoint.value))
@@ -127,7 +127,7 @@ export const EstimateDropdown = observer(function EstimateDropdown(props: Props)
     query: t("project_settings.estimates.no_estimate"),
     content: (
       <div className="flex items-center gap-2">
-        <EstimatePropertyIcon className="h-3 w-3 flex-shrink-0" />
+        <EstimateOutline className="h-3 w-3 flex-shrink-0" />
         <span className="flex-grow truncate">{t("project_settings.estimates.no_estimate")}</span>
       </div>
     ),
@@ -193,7 +193,7 @@ export const EstimateDropdown = observer(function EstimateDropdown(props: Props)
         variant={buttonVariant}
         renderToolTipByDefault={renderByDefault}
       >
-        {!hideIcon && <EstimatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+        {!hideIcon && <EstimateOutline className="h-3 w-3 flex-shrink-0" />}
         {(selectedEstimate || placeholder) && BUTTON_VARIANTS_WITH_TEXT.includes(buttonVariant) && (
           <span className="truncate">
             {selectedEstimate ? (
@@ -208,7 +208,7 @@ export const EstimateDropdown = observer(function EstimateDropdown(props: Props)
           </span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </DropdownButton>
     </button>
@@ -236,7 +236,7 @@ export const EstimateDropdown = observer(function EstimateDropdown(props: Props)
             {...attributes.popper}
           >
             <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-              <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+              <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
               <Combobox.Input
                 as="input"
                 ref={inputRef}
@@ -255,7 +255,7 @@ export const EstimateDropdown = observer(function EstimateDropdown(props: Props)
                 >
                   {/* NOTE: This condition renders when estimates are not enabled for the project */}
                   <div className="flex flex-grow items-center gap-2">
-                    <EstimatePropertyIcon className="h-3 w-3 flex-shrink-0" />
+                    <EstimateOutline className="h-3 w-3 flex-shrink-0" />
                     <span className="flex-grow truncate">{t("project_settings.estimates.no_estimate")}</span>
                   </div>
                 </div>
@@ -277,7 +277,7 @@ export const EstimateDropdown = observer(function EstimateDropdown(props: Props)
                               )}
                             >
                               <span className="flex-grow truncate">{option.content}</span>
-                              {selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+                              {selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
                             </div>
                           )}
                         </Combobox.Option>
diff --git a/apps/web/core/components/dropdowns/intake-state/base.tsx b/apps/web/core/components/dropdowns/intake-state/base.tsx
index 83b6bfa97dd..8f11176d024 100644
--- a/apps/web/core/components/dropdowns/intake-state/base.tsx
+++ b/apps/web/core/components/dropdowns/intake-state/base.tsx
@@ -11,7 +11,8 @@ import { usePopper } from "react-popper";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon, IntakeStateGroupIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { IntakeStateGroupIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, SearchOutline } from "@makeplane/propel/icons";
 import type { IIntakeState } from "@plane/types";
 import { ComboDropDown, Spinner } from "@plane/ui";
 import { cn } from "@plane/utils";
@@ -186,7 +187,10 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
               <span className="flex-grow truncate text-left">{selectedState?.name ?? t("state")}</span>
             )}
             {dropdownArrow && (
-              <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+              <ChevronDownOutline
+                className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)}
+                aria-hidden="true"
+              />
             )}
           </>
         )}
@@ -216,7 +220,7 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
             {...attributes.popper}
           >
             <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-              <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+              <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
               <Combobox.Input
                 as="input"
                 ref={inputRef}
diff --git a/apps/web/core/components/dropdowns/layout.tsx b/apps/web/core/components/dropdowns/layout.tsx
index f48b0e95705..8695f2adc00 100644
--- a/apps/web/core/components/dropdowns/layout.tsx
+++ b/apps/web/core/components/dropdowns/layout.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 // plane imports
 import { ISSUE_LAYOUT_MAP } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 import { EIssueLayoutTypes } from "@plane/types";
 import { getButtonStyling } from "@plane/propel/button";
 import { Dropdown } from "@plane/ui";
@@ -61,7 +61,7 @@ export const LayoutDropDown = observer(function LayoutDropDown(props: TLayoutDro
           <IssueLayoutIcon layout={dropdownValue.key} strokeWidth={2} className={`size-3 text-secondary`} />
           <span className="text-11 font-medium">{t(dropdownValue.i18n_label)}</span>
         </div>
-        {props.selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+        {props.selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
       </div>
     );
   }, []);
diff --git a/apps/web/core/components/dropdowns/member/avatar.tsx b/apps/web/core/components/dropdowns/member/avatar.tsx
index aa88d21d66e..4b018697552 100644
--- a/apps/web/core/components/dropdowns/member/avatar.tsx
+++ b/apps/web/core/components/dropdowns/member/avatar.tsx
@@ -5,10 +5,10 @@
  */
 
 import { observer } from "mobx-react";
-import type { LucideIcon } from "lucide-react";
+import type { ComponentType, SVGProps } from "react";
 import { Avatar } from "@makeplane/propel/components/avatar";
 import type { AvatarGroupSize } from "@makeplane/propel/components/avatar-group";
-import { MembersPropertyIcon } from "@plane/propel/icons";
+import { MembersOutline } from "@makeplane/propel/icons";
 import { cn, getFileURL } from "@plane/utils";
 // plane utils
 // helpers
@@ -19,7 +19,7 @@ import { useMember } from "@/hooks/store/use-member";
 type AvatarProps = {
   showTooltip: boolean;
   userIds: string | string[] | null;
-  icon?: LucideIcon;
+  icon?: ComponentType<SVGProps<SVGSVGElement>>;
   size?: AvatarGroupSize;
 };
 
@@ -64,6 +64,6 @@ export const ButtonAvatars = observer(function ButtonAvatars(props: AvatarProps)
   return Icon ? (
     <Icon className="h-3 w-3 flex-shrink-0" />
   ) : (
-    <MembersPropertyIcon className={cn("mx-[4px] h-3 w-3 flex-shrink-0")} />
+    <MembersOutline className={cn("mx-[4px] h-3 w-3 flex-shrink-0")} />
   );
 });
diff --git a/apps/web/core/components/dropdowns/member/base.tsx b/apps/web/core/components/dropdowns/member/base.tsx
index 2b88b045931..7a8e9d7ca8f 100644
--- a/apps/web/core/components/dropdowns/member/base.tsx
+++ b/apps/web/core/components/dropdowns/member/base.tsx
@@ -6,9 +6,9 @@
 
 import { useRef, useState } from "react";
 import { observer } from "mobx-react";
-import type { LucideIcon } from "lucide-react";
+import type { ComponentType, SVGProps } from "react";
 import { useTranslation } from "@plane/i18n";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { IUserLite } from "@plane/types";
 import { ComboDropDown } from "@plane/ui";
@@ -25,7 +25,7 @@ import type { MemberDropdownProps } from "./types";
 
 type TMemberDropdownBaseProps = {
   getUserDetails: (userId: string) => IUserLite | undefined;
-  icon?: LucideIcon;
+  icon?: ComponentType<SVGProps<SVGSVGElement>>;
   memberIds?: string[];
   onClose?: () => void;
   onDropdownOpen?: () => void;
@@ -153,7 +153,7 @@ export const MemberDropdownBase = observer(function MemberDropdownBase(props: TM
           </span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </DropdownButton>
     </button>
diff --git a/apps/web/core/components/dropdowns/member/dropdown.tsx b/apps/web/core/components/dropdowns/member/dropdown.tsx
index 2ab8e5c3508..78c6dd6e6c5 100644
--- a/apps/web/core/components/dropdowns/member/dropdown.tsx
+++ b/apps/web/core/components/dropdowns/member/dropdown.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import type { LucideIcon } from "lucide-react";
+import type { ComponentType, SVGProps } from "react";
 // hooks
 import { useMember } from "@/hooks/store/use-member";
 // local imports
@@ -14,7 +14,7 @@ import { MemberDropdownBase } from "./base";
 import type { MemberDropdownProps } from "./types";
 
 type TMemberDropdownProps = {
-  icon?: LucideIcon;
+  icon?: ComponentType<SVGProps<SVGSVGElement>>;
   memberIds?: string[];
   onClose?: () => void;
   optionsClassName?: string;
diff --git a/apps/web/core/components/dropdowns/member/member-options.tsx b/apps/web/core/components/dropdowns/member/member-options.tsx
index 5e122309d1a..987aac87840 100644
--- a/apps/web/core/components/dropdowns/member/member-options.tsx
+++ b/apps/web/core/components/dropdowns/member/member-options.tsx
@@ -14,7 +14,7 @@ import { Combobox } from "@headlessui/react";
 // plane imports
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, SearchIcon, SuspendedUserIcon } from "@plane/propel/icons";
+import { DeactivatedUserOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import { EPillSize, EPillVariant, Pill } from "@plane/propel/pill";
 import type { IUserLite } from "@plane/types";
 import { cn, getFileURL, sortByCurrentUserThenSelected } from "@plane/utils";
@@ -100,7 +100,7 @@ export const MemberOptions = observer(function MemberOptions(props: Props) {
           <div className="flex items-center gap-2">
             <div className="w-4">
               {isUserSuspended(userId, workspaceSlug?.toString()) ? (
-                <SuspendedUserIcon className="h-3.5 w-3.5 text-placeholder" />
+                <DeactivatedUserOutline className="h-3.5 w-3.5 text-placeholder" />
               ) : (
                 <Avatar
                   alt={userDetails?.display_name}
@@ -144,7 +144,7 @@ export const MemberOptions = observer(function MemberOptions(props: Props) {
         {...attributes.popper}
       >
         <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-          <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+          <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
           <Combobox.Input
             as="input"
             ref={inputRef}
@@ -181,7 +181,7 @@ export const MemberOptions = observer(function MemberOptions(props: Props) {
                       {({ selected }) => (
                         <>
                           <span className="flex-grow truncate">{option.content}</span>
-                          {selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+                          {selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
                           {isUserSuspended(option.value, workspaceSlug?.toString()) && (
                             <Pill variant={EPillVariant.DEFAULT} size={EPillSize.XS} className="border-none">
                               Suspended
diff --git a/apps/web/core/components/dropdowns/module/button-content.tsx b/apps/web/core/components/dropdowns/module/button-content.tsx
index 3183e44939a..15e7ab998f0 100644
--- a/apps/web/core/components/dropdowns/module/button-content.tsx
+++ b/apps/web/core/components/dropdowns/module/button-content.tsx
@@ -5,7 +5,7 @@
  */
 
 // plane imports
-import { CloseIcon, ModuleIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, CloseOutline, ModuleOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { cn } from "@plane/utils";
 // hooks
@@ -49,7 +49,7 @@ export function ModuleButtonContent(props: ModuleButtonContentProps) {
       <>
         {showCount ? (
           <div className="relative flex max-w-full items-center gap-1">
-            {!hideIcon && <ModuleIcon className="h-3 w-3 flex-shrink-0" />}
+            {!hideIcon && <ModuleOutline className="h-3 w-3 flex-shrink-0" />}
             {(value.length > 0 || !!placeholder) && (
               <div className="max-w-40 truncate">
                 {value.length > 0
@@ -72,7 +72,7 @@ export function ModuleButtonContent(props: ModuleButtonContentProps) {
                     className
                   )}
                 >
-                  {!hideIcon && <ModuleIcon className="h-2.5 w-2.5 flex-shrink-0" />}
+                  {!hideIcon && <ModuleOutline className="h-2.5 w-2.5 flex-shrink-0" />}
                   {!hideText && (
                     <Tooltip
                       label={`Title: ${moduleDetails?.name ?? ""}`}
@@ -92,7 +92,7 @@ export function ModuleButtonContent(props: ModuleButtonContentProps) {
                           onChange(newModuleIds);
                         }}
                       >
-                        <CloseIcon className="h-2.5 w-2.5 text-tertiary hover:text-danger-primary" />
+                        <CloseOutline className="h-2.5 w-2.5 text-tertiary hover:text-danger-primary" />
                       </button>
                     </Tooltip>
                   )}
@@ -102,24 +102,24 @@ export function ModuleButtonContent(props: ModuleButtonContentProps) {
           </div>
         ) : (
           <>
-            {!hideIcon && <ModuleIcon className="h-3 w-3 flex-shrink-0" />}
+            {!hideIcon && <ModuleOutline className="h-3 w-3 flex-shrink-0" />}
             <span className="flex-grow truncate text-left">{placeholder}</span>
           </>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </>
     );
   else
     return (
       <>
-        {!hideIcon && <ModuleIcon className="h-3 w-3 flex-shrink-0" />}
+        {!hideIcon && <ModuleOutline className="h-3 w-3 flex-shrink-0" />}
         {!hideText && (
           <span className="flex-grow truncate text-left">{value ? getModuleById(value)?.name : placeholder}</span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </>
     );
diff --git a/apps/web/core/components/dropdowns/module/module-options.tsx b/apps/web/core/components/dropdowns/module/module-options.tsx
index 02446888370..29025430bf5 100644
--- a/apps/web/core/components/dropdowns/module/module-options.tsx
+++ b/apps/web/core/components/dropdowns/module/module-options.tsx
@@ -11,7 +11,7 @@ import { usePopper } from "react-popper";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, SearchIcon, ModuleIcon } from "@plane/propel/icons";
+import { ModuleOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import type { IModule } from "@plane/types";
 import { cn, sortBySelectedFirst } from "@plane/utils";
 // hooks
@@ -89,7 +89,7 @@ export const ModuleOptions = observer(function ModuleOptions(props: Props) {
       query: `${moduleDetails?.name}`,
       content: (
         <div className="flex items-center gap-2">
-          <ModuleIcon className="h-3 w-3 flex-shrink-0" />
+          <ModuleOutline className="h-3 w-3 flex-shrink-0" />
           <span className="flex-grow truncate">{moduleDetails?.name}</span>
         </div>
       ),
@@ -101,7 +101,7 @@ export const ModuleOptions = observer(function ModuleOptions(props: Props) {
       query: t("module.no_module"),
       content: (
         <div className="flex items-center gap-2">
-          <ModuleIcon className="h-3 w-3 flex-shrink-0" />
+          <ModuleOutline className="h-3 w-3 flex-shrink-0" />
           <span className="flex-grow truncate">{t("module.no_module")}</span>
         </div>
       ),
@@ -121,7 +121,7 @@ export const ModuleOptions = observer(function ModuleOptions(props: Props) {
         {...attributes.popper}
       >
         <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-          <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+          <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
           <Combobox.Input
             as="input"
             ref={inputRef}
@@ -155,7 +155,7 @@ export const ModuleOptions = observer(function ModuleOptions(props: Props) {
                   {({ selected }) => (
                     <>
                       <span className="flex-grow truncate">{option.content}</span>
-                      {selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+                      {selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
                     </>
                   )}
                 </Combobox.Option>
diff --git a/apps/web/core/components/dropdowns/priority.tsx b/apps/web/core/components/dropdowns/priority.tsx
index 96b6a6b847e..28c252a8376 100644
--- a/apps/web/core/components/dropdowns/priority.tsx
+++ b/apps/web/core/components/dropdowns/priority.tsx
@@ -12,7 +12,8 @@ import { Combobox } from "@headlessui/react";
 import { ISSUE_PRIORITIES } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // types
-import { CheckIcon, PriorityIcon, ChevronDownIcon, SearchIcon } from "@plane/propel/icons";
+import { PriorityIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TIssuePriorities } from "@plane/types";
 // ui
@@ -132,7 +133,7 @@ function BorderButton(props: ButtonProps) {
           </span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </div>
     </Tooltip>
@@ -216,7 +217,7 @@ function BackgroundButton(props: ButtonProps) {
           </span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </div>
     </Tooltip>
@@ -296,7 +297,7 @@ function TransparentButton(props: ButtonProps) {
           </span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </div>
     </Tooltip>
@@ -452,7 +453,7 @@ export function PriorityDropdown(props: Props) {
             {...attributes.popper}
           >
             <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-              <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+              <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
               <Combobox.Input
                 as="input"
                 ref={inputRef}
@@ -482,7 +483,7 @@ export function PriorityDropdown(props: Props) {
                     {({ selected }) => (
                       <>
                         <span className="flex-grow truncate">{option.content}</span>
-                        {selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+                        {selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
                       </>
                     )}
                   </Combobox.Option>
diff --git a/apps/web/core/components/dropdowns/project/base.tsx b/apps/web/core/components/dropdowns/project/base.tsx
index 6d10080b988..064b19236ab 100644
--- a/apps/web/core/components/dropdowns/project/base.tsx
+++ b/apps/web/core/components/dropdowns/project/base.tsx
@@ -12,7 +12,7 @@ import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { CheckIcon, SearchIcon, ProjectIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, ProjectsOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import { ComboDropDown } from "@plane/ui";
 import { cn, sortBySelectedFirst } from "@plane/utils";
 // components
@@ -164,7 +164,7 @@ export const ProjectDropdownBase = observer(function ProjectDropdownBase(props:
               return projectDetails?.logo_props ? renderIcon(projectDetails.logo_props) : null;
             })
           ) : (
-            <ProjectIcon className="size-3 text-tertiary" />
+            <ProjectsOutline className="size-3 text-tertiary" />
           )}
         </div>
       );
@@ -213,7 +213,7 @@ export const ProjectDropdownBase = observer(function ProjectDropdownBase(props:
           <span className="max-w-40 truncate">{getDisplayName(value, placeholder)}</span>
         )}
         {dropdownArrow && (
-          <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+          <ChevronDownOutline className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
         )}
       </DropdownButton>
     </button>
@@ -242,7 +242,7 @@ export const ProjectDropdownBase = observer(function ProjectDropdownBase(props:
             {...attributes.popper}
           >
             <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-              <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+              <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
               <Combobox.Input
                 as="input"
                 ref={inputRef}
@@ -273,7 +273,7 @@ export const ProjectDropdownBase = observer(function ProjectDropdownBase(props:
                         {({ selected }) => (
                           <>
                             <span className="flex-grow truncate">{option.content}</span>
-                            {selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+                            {selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
                           </>
                         )}
                       </Combobox.Option>
diff --git a/apps/web/core/components/dropdowns/state/base.tsx b/apps/web/core/components/dropdowns/state/base.tsx
index 3b04d5331c8..19570dcd9fa 100644
--- a/apps/web/core/components/dropdowns/state/base.tsx
+++ b/apps/web/core/components/dropdowns/state/base.tsx
@@ -11,7 +11,8 @@ import { usePopper } from "react-popper";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon, StateGroupIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { StateGroupIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, SearchOutline } from "@makeplane/propel/icons";
 import type { IState } from "@plane/types";
 import { ComboDropDown, Spinner } from "@plane/ui";
 import { cn } from "@plane/utils";
@@ -188,7 +189,10 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
               <span className="flex-grow truncate text-left">{selectedState?.name ?? t("state")}</span>
             )}
             {dropdownArrow && (
-              <ChevronDownIcon className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)} aria-hidden="true" />
+              <ChevronDownOutline
+                className={cn("h-2.5 w-2.5 flex-shrink-0", dropdownArrowClassName)}
+                aria-hidden="true"
+              />
             )}
           </>
         )}
@@ -218,7 +222,7 @@ export const WorkItemStateDropdownBase = observer(function WorkItemStateDropdown
             {...attributes.popper}
           >
             <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-              <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+              <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
               <Combobox.Input
                 as="input"
                 ref={inputRef}
diff --git a/apps/web/core/components/editor/lite-text/lite-toolbar.tsx b/apps/web/core/components/editor/lite-text/lite-toolbar.tsx
index 3245196f775..dbea0be631c 100644
--- a/apps/web/core/components/editor/lite-text/lite-toolbar.tsx
+++ b/apps/web/core/components/editor/lite-text/lite-toolbar.tsx
@@ -5,7 +5,7 @@
  */
 
 import React from "react";
-import { ArrowUp, Paperclip } from "lucide-react";
+import { AttachOutline, TopArrowOutline } from "@makeplane/propel/icons";
 // constants
 import type { ToolbarMenuItem } from "@plane/editor";
 import { IMAGE_ITEM } from "@plane/editor";
@@ -25,7 +25,7 @@ export function LiteToolbar({ onSubmit, isSubmitting, isEmpty, executeCommand }:
         type="button"
         className="p-1 text-tertiary transition-colors hover:text-secondary"
       >
-        <Paperclip className="size-3" />
+        <AttachOutline className="size-3" />
       </button>
       <button
         type="button"
@@ -33,7 +33,7 @@ export function LiteToolbar({ onSubmit, isSubmitting, isEmpty, executeCommand }:
         disabled={isEmpty || isSubmitting}
         className="rounded-sm bg-accent-primary p-1 text-primary transition-colors hover:bg-accent-primary/80 disabled:bg-layer-1 disabled:text-secondary"
       >
-        <ArrowUp className="size-3" />
+        <TopArrowOutline className="size-3" />
       </button>
     </div>
   );
diff --git a/apps/web/core/components/editor/lite-text/toolbar.tsx b/apps/web/core/components/editor/lite-text/toolbar.tsx
index bdbd409ef41..e67e2fc55ba 100644
--- a/apps/web/core/components/editor/lite-text/toolbar.tsx
+++ b/apps/web/core/components/editor/lite-text/toolbar.tsx
@@ -14,7 +14,7 @@ import type { EditorRefApi } from "@plane/editor";
 import { useTranslation } from "@plane/i18n";
 // ui
 import { Button } from "@plane/propel/button";
-import { GlobeIcon, LockIcon } from "@plane/propel/icons";
+import { GlobeOutline, LockOutline } from "@makeplane/propel/icons";
 import type { ISvgIcons } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 // constants
@@ -44,12 +44,12 @@ type TCommentAccessType = {
 
 const COMMENT_ACCESS_SPECIFIERS: TCommentAccessType[] = [
   {
-    icon: LockIcon,
+    icon: LockOutline,
     key: EIssueCommentAccessSpecifier.INTERNAL,
     label: "Private",
   },
   {
-    icon: GlobeIcon,
+    icon: GlobeOutline,
     key: EIssueCommentAccessSpecifier.EXTERNAL,
     label: "Public",
   },
diff --git a/apps/web/core/components/editor/sticky-editor/toolbar.tsx b/apps/web/core/components/editor/sticky-editor/toolbar.tsx
index 1478d1824be..3acdf538b3a 100644
--- a/apps/web/core/components/editor/sticky-editor/toolbar.tsx
+++ b/apps/web/core/components/editor/sticky-editor/toolbar.tsx
@@ -5,12 +5,11 @@
  */
 
 import React, { useEffect, useState, useCallback } from "react";
-import { Palette } from "lucide-react";
+import { DeleteOutline, PaletteOutline } from "@makeplane/propel/icons";
 // editor
 import type { EditorRefApi } from "@plane/editor";
 // ui
 import { useOutsideClickDetector } from "@plane/hooks";
-import { TrashIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TSticky } from "@plane/types";
 // constants
@@ -70,7 +69,7 @@ export function StickyEditorToolbar(props: Props) {
         {showColorPalette && <ColorPalette handleUpdate={handleColorChange} />}
         <Tooltip label="Background color">
           <button type="button" onClick={() => setShowColorPalette(!showColorPalette)} className="flex text-primary/50">
-            <Palette className="my-auto size-4" />
+            <PaletteOutline className="my-auto size-4" />
           </button>
         </Tooltip>
 
@@ -106,7 +105,7 @@ export function StickyEditorToolbar(props: Props) {
       {/* delete action */}
       <Tooltip label="Delete">
         <button type="button" onClick={handleDelete} className="my-auto text-primary/50">
-          <TrashIcon className="size-4" />
+          <DeleteOutline className="size-4" />
         </button>
       </Tooltip>
     </div>
diff --git a/apps/web/core/components/estimates/create/modal.tsx b/apps/web/core/components/estimates/create/modal.tsx
index 518f6665095..2ef7ce6f2c5 100644
--- a/apps/web/core/components/estimates/create/modal.tsx
+++ b/apps/web/core/components/estimates/create/modal.tsx
@@ -10,7 +10,7 @@ import { observer } from "mobx-react";
 import { EEstimateSystem, ESTIMATE_SYSTEMS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { ChevronLeftIcon } from "@plane/propel/icons";
+import { ChevronLeftOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { IEstimateFormData, TEstimateSystemKeys, TEstimatePointsObject, TEstimateTypeError } from "@plane/types";
 import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
@@ -155,7 +155,7 @@ export const CreateEstimateModal = observer(function CreateEstimateModal(props:
                 }}
                 className="flex h-5 w-5 flex-shrink-0 cursor-pointer items-center justify-center"
               >
-                <ChevronLeftIcon className="h-4 w-4" />
+                <ChevronLeftOutline className="h-4 w-4" />
               </div>
             )}
             <div className="text-18 font-medium text-primary">{t("project_settings.estimates.new")}</div>
diff --git a/apps/web/core/components/estimates/create/stage-one.tsx b/apps/web/core/components/estimates/create/stage-one.tsx
index c3f4dd6b5ef..e3a5a8085d0 100644
--- a/apps/web/core/components/estimates/create/stage-one.tsx
+++ b/apps/web/core/components/estimates/create/stage-one.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { Info } from "lucide-react";
+import { InfoOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EEstimateSystem, ESTIMATE_SYSTEMS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -46,7 +46,7 @@ export function EstimateCreateStageOne(props: TEstimateCreateStageOne) {
                   <div className="relative flex cursor-no-drop items-center gap-2 text-tertiary">
                     {t(ESTIMATE_SYSTEMS[currentSystem]?.i18n_name)}
                     <Tooltip label={t("common.coming_soon")}>
-                      <Info size={12} />
+                      <InfoOutline width={12} height={12} />
                     </Tooltip>
                   </div>
                 ) : !isEnabled ? (
diff --git a/apps/web/core/components/estimates/estimate-list-item-buttons.tsx b/apps/web/core/components/estimates/estimate-list-item-buttons.tsx
index e459e458ef2..815c44b17d6 100644
--- a/apps/web/core/components/estimates/estimate-list-item-buttons.tsx
+++ b/apps/web/core/components/estimates/estimate-list-item-buttons.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { TrashIcon } from "@plane/propel/icons";
+import { DeleteOutline } from "@makeplane/propel/icons";
 
 type TEstimateListItem = {
   estimateId: string;
@@ -26,7 +26,7 @@ export const EstimateListItemButtons = observer(function EstimateListItemButtons
         className="relative flex h-6 w-6 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden rounded-sm transition-colors hover:bg-layer-1"
         onClick={() => onDeleteClick && onDeleteClick(estimateId)}
       >
-        <TrashIcon width={12} height={12} />
+        <DeleteOutline width={12} height={12} />
       </button>
     </div>
   );
diff --git a/apps/web/core/components/estimates/points/create-root.tsx b/apps/web/core/components/estimates/points/create-root.tsx
index ad3c57e9fd7..ab3e984339e 100644
--- a/apps/web/core/components/estimates/points/create-root.tsx
+++ b/apps/web/core/components/estimates/points/create-root.tsx
@@ -10,7 +10,7 @@ import { observer } from "mobx-react";
 // plane imports
 import { estimateCount } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import type { TEstimatePointsObject, TEstimateSystemKeys, TEstimateTypeError } from "@plane/types";
 import { Sortable } from "@plane/ui";
 // local imports
@@ -171,7 +171,7 @@ export const EstimatePointCreateRoot = observer(function EstimatePointCreateRoot
           />
         ))}
       {estimatePoints && estimatePoints.length + (estimatePointCreate?.length || 0) <= estimateCount.max - 1 && (
-        <Button variant="link" prependIcon={<PlusIcon />} onClick={handleCreate}>
+        <Button variant="link" prependIcon={<AddOutline />} onClick={handleCreate}>
           Add {estimateType}
         </Button>
       )}
diff --git a/apps/web/core/components/estimates/points/create.tsx b/apps/web/core/components/estimates/points/create.tsx
index 7b4fc2cecb8..cc81a86a1ab 100644
--- a/apps/web/core/components/estimates/points/create.tsx
+++ b/apps/web/core/components/estimates/points/create.tsx
@@ -7,10 +7,9 @@
 import type { FormEvent } from "react";
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { Info } from "lucide-react";
+import { CloseOutline, InfoOutline, TickOutline } from "@makeplane/propel/icons";
 import { EEstimateSystem, MAX_ESTIMATE_POINT_INPUT_LENGTH } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, CloseIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TEstimatePointsObject, TEstimateSystemKeys, TEstimateTypeErrorObject } from "@plane/types";
@@ -182,7 +181,7 @@ export const EstimatePointCreate = observer(function EstimatePointCreate(props:
         {estimatePointError?.message && (
           <Tooltip label={estimatePointError?.message} layout="stacked" side="bottom">
             <div className="relative mr-3 flex h-3.5 w-3.5 flex-shrink-0 items-center justify-center overflow-hidden text-danger-primary">
-              <Info size={14} />
+              <InfoOutline width={14} height={14} />
             </div>
           </Tooltip>
         )}
@@ -194,7 +193,7 @@ export const EstimatePointCreate = observer(function EstimatePointCreate(props:
           className="relative flex h-6 w-6 flex-shrink-0 cursor-pointer items-center justify-center rounded-xs text-success-primary transition-colors hover:bg-layer-1"
           disabled={loader}
         >
-          {loader ? <Spinner className="h-4 w-4" /> : <CheckIcon width={14} height={14} />}
+          {loader ? <Spinner className="h-4 w-4" /> : <TickOutline width={14} height={14} />}
         </button>
       )}
       <button
@@ -203,7 +202,7 @@ export const EstimatePointCreate = observer(function EstimatePointCreate(props:
         onClick={handleClose}
         disabled={loader}
       >
-        <CloseIcon height={14} width={14} className="text-secondary" />
+        <CloseOutline height={14} width={14} className="text-secondary" />
       </button>
     </form>
   );
diff --git a/apps/web/core/components/estimates/points/preview.tsx b/apps/web/core/components/estimates/points/preview.tsx
index f7eb22aef1b..02d48554c30 100644
--- a/apps/web/core/components/estimates/points/preview.tsx
+++ b/apps/web/core/components/estimates/points/preview.tsx
@@ -6,11 +6,10 @@
 
 import { useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
-import { GripVertical } from "lucide-react";
+import { DeleteOutline, DragDropOutline, EditOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EEstimateSystem, estimateCount } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { EditIcon, TrashIcon } from "@plane/propel/icons";
 import type { TEstimatePointsObject, TEstimateSystemKeys, TEstimateTypeErrorObject } from "@plane/types";
 import { convertMinutesToHoursMinutesString } from "@plane/utils";
 // local imports
@@ -69,7 +68,7 @@ export const EstimatePointItemPreview = observer(function EstimatePointItemPrevi
       {!estimatePointEditToggle && !estimatePointDeleteToggle && (
         <div className="relative my-1 flex items-center gap-2 rounded-sm border border-subtle px-1 text-14">
           <div className="relative flex h-6 w-6 flex-shrink-0 cursor-pointer items-center justify-center rounded-xs transition-colors hover:bg-layer-1">
-            <GripVertical size={14} className="text-secondary" />
+            <DragDropOutline width={14} height={14} className="text-secondary" />
           </div>
           <div ref={EstimatePointValueRef} className="w-full py-2 text-13">
             {estimatePoint?.value ? (
@@ -83,7 +82,7 @@ export const EstimatePointItemPreview = observer(function EstimatePointItemPrevi
             className="relative flex h-6 w-6 flex-shrink-0 cursor-pointer items-center justify-center rounded-xs transition-colors hover:bg-layer-1"
             onClick={() => setEstimatePointEditToggle(true)}
           >
-            <EditIcon width={14} height={14} className="text-secondary" />
+            <EditOutline width={14} height={14} className="text-secondary" />
           </div>
           {estimatePoints.length > estimateCount.min && (
             // oxlint-disable-next-line jsx_a11y/click-events-have-key-events oxlint-disable-next-line jsx_a11y/no-static-element-interactions
@@ -95,7 +94,7 @@ export const EstimatePointItemPreview = observer(function EstimatePointItemPrevi
                   : handleEstimatePointValueRemove && handleEstimatePointValueRemove()
               }
             >
-              <TrashIcon width={14} height={14} className="text-secondary" />
+              <DeleteOutline width={14} height={14} className="text-secondary" />
             </div>
           )}
         </div>
diff --git a/apps/web/core/components/estimates/points/update.tsx b/apps/web/core/components/estimates/points/update.tsx
index 3a451e60690..593c0232166 100644
--- a/apps/web/core/components/estimates/points/update.tsx
+++ b/apps/web/core/components/estimates/points/update.tsx
@@ -7,10 +7,9 @@
 import type { FormEvent } from "react";
 import { useEffect, useState } from "react";
 import { observer } from "mobx-react";
-import { Info } from "lucide-react";
+import { CloseOutline, InfoOutline, TickOutline } from "@makeplane/propel/icons";
 import { EEstimateSystem, MAX_ESTIMATE_POINT_INPUT_LENGTH } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, CloseIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TEstimatePointsObject, TEstimateSystemKeys, TEstimateTypeErrorObject } from "@plane/types";
@@ -196,7 +195,7 @@ export const EstimatePointUpdate = observer(function EstimatePointUpdate(props:
               side="bottom"
             >
               <div className="relative mr-3 flex h-3.5 w-3.5 flex-shrink-0 items-center justify-center overflow-hidden text-danger-primary">
-                <Info size={14} />
+                <InfoOutline width={14} height={14} />
               </div>
             </Tooltip>
           </>
@@ -209,7 +208,7 @@ export const EstimatePointUpdate = observer(function EstimatePointUpdate(props:
           className="relative flex h-6 w-6 flex-shrink-0 cursor-pointer items-center justify-center rounded-xs text-success-primary transition-colors hover:bg-layer-1"
           disabled={loader}
         >
-          {loader ? <Spinner className="h-4 w-4" /> : <CheckIcon width={14} height={14} />}
+          {loader ? <Spinner className="h-4 w-4" /> : <TickOutline width={14} height={14} />}
         </button>
       )}
       <button
@@ -218,7 +217,7 @@ export const EstimatePointUpdate = observer(function EstimatePointUpdate(props:
         onClick={handleClose}
         disabled={loader}
       >
-        <CloseIcon height={14} width={14} className="text-secondary" />
+        <CloseOutline height={14} width={14} className="text-secondary" />
       </button>
     </form>
   );
diff --git a/apps/web/core/components/exporter/column.tsx b/apps/web/core/components/exporter/column.tsx
index 5fe387ecd16..7866170af4c 100644
--- a/apps/web/core/components/exporter/column.tsx
+++ b/apps/web/core/components/exporter/column.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { Download } from "lucide-react";
+import { DownloadOutline } from "@makeplane/propel/icons";
 import type { IExportData } from "@plane/types";
 import { getDate, getFileURL, renderFormattedDate } from "@plane/utils";
 
@@ -101,7 +101,7 @@ export const useExportColumns = () => {
             {rowData.status == "completed" ? (
               <a target="_blank" href={rowData?.url} rel="noopener noreferrer">
                 <button className="flex w-full items-center gap-1 font-medium text-accent-primary">
-                  <Download className="h-4 w-4" />
+                  <DownloadOutline className="h-4 w-4" />
                   <div>Download</div>
                 </button>
               </a>
diff --git a/apps/web/core/components/exporter/prev-exports.tsx b/apps/web/core/components/exporter/prev-exports.tsx
index f3ebedb41f0..088881a0741 100644
--- a/apps/web/core/components/exporter/prev-exports.tsx
+++ b/apps/web/core/components/exporter/prev-exports.tsx
@@ -7,7 +7,7 @@
 import { useCallback, useEffect, useState } from "react";
 import { observer } from "mobx-react";
 import useSWR, { mutate } from "swr";
-import { MoveLeft, MoveRight, RefreshCw } from "lucide-react";
+import { ArrowNarrowLeftOutline, ArrowNarrowRightOutline, RefreshOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
@@ -79,7 +79,7 @@ export const PrevExports = observer(function PrevExports(props: Props) {
         <div className="flex items-center gap-2">
           <h3 className="text-h6-medium text-primary">{t("workspace_settings.settings.exports.previous_exports")}</h3>
           <Button variant="tertiary" className="shrink-0" onClick={handleRefresh}>
-            <RefreshCw className={`h-3 w-3 ${refreshing ? "animate-spin" : ""}`} />
+            <RefreshOutline className={`h-3 w-3 ${refreshing ? "animate-spin" : ""}`} />
             {refreshing ? t("refreshing") : t("refresh_status")}
           </Button>
         </div>
@@ -90,7 +90,7 @@ export const PrevExports = observer(function PrevExports(props: Props) {
               size="sm"
               disabled={!exporterServices?.prev_page_results}
               onClick={() => exporterServices?.prev_page_results && setCursor(exporterServices?.prev_cursor)}
-              prependIcon={<MoveLeft />}
+              prependIcon={<ArrowNarrowLeftOutline />}
             >
               {t("prev")}
             </Button>
@@ -99,7 +99,7 @@ export const PrevExports = observer(function PrevExports(props: Props) {
               size="sm"
               disabled={!exporterServices?.next_page_results}
               onClick={() => exporterServices?.next_page_results && setCursor(exporterServices?.next_cursor)}
-              appendIcon={<MoveRight />}
+              appendIcon={<ArrowNarrowRightOutline />}
             >
               {t("next")}
             </Button>
diff --git a/apps/web/core/components/gantt-chart/blocks/block-row.tsx b/apps/web/core/components/gantt-chart/blocks/block-row.tsx
index c7f3fa092d0..83bfd584c4b 100644
--- a/apps/web/core/components/gantt-chart/blocks/block-row.tsx
+++ b/apps/web/core/components/gantt-chart/blocks/block-row.tsx
@@ -6,7 +6,7 @@
 
 import { useEffect, useState } from "react";
 import { observer } from "mobx-react";
-import { ArrowRight } from "lucide-react";
+import { ArrowNarrowRightOutline } from "@makeplane/propel/icons";
 // helpers
 import type { IBlockUpdateData, IGanttBlock } from "@plane/types";
 import { cn } from "@plane/utils";
@@ -107,7 +107,7 @@ export const BlockRow = observer(function BlockRow(props: Props) {
                 }}
                 onClick={() => handleScrollToBlock(block)}
               >
-                <ArrowRight
+                <ArrowNarrowRightOutline
                   className={cn("h-3.5 w-3.5", {
                     "rotate-180": isBlockHiddenOnLeft,
                   })}
diff --git a/apps/web/core/components/gantt-chart/chart/header.tsx b/apps/web/core/components/gantt-chart/chart/header.tsx
index faa2c266009..9fcd7cf322a 100644
--- a/apps/web/core/components/gantt-chart/chart/header.tsx
+++ b/apps/web/core/components/gantt-chart/chart/header.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { Expand, Shrink } from "lucide-react";
+import { ArrowCollapseOutline, FullScreenOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 // plane
 import type { TGanttViews } from "@plane/types";
@@ -79,7 +79,7 @@ export const GanttChartHeader = observer(function GanttChartHeader(props: Props)
         className="flex items-center justify-center rounded-md border border-subtle bg-layer-transparent p-1 transition-all hover:bg-layer-transparent-hover"
         onClick={toggleFullScreenMode}
       >
-        {fullScreenMode ? <Shrink className="h-4 w-4" /> : <Expand className="h-4 w-4" />}
+        {fullScreenMode ? <ArrowCollapseOutline className="h-4 w-4" /> : <FullScreenOutline className="h-4 w-4" />}
       </button>
     </Row>
   );
diff --git a/apps/web/core/components/gantt-chart/helpers/add-block.tsx b/apps/web/core/components/gantt-chart/helpers/add-block.tsx
index db865cd116b..2b87bae4d19 100644
--- a/apps/web/core/components/gantt-chart/helpers/add-block.tsx
+++ b/apps/web/core/components/gantt-chart/helpers/add-block.tsx
@@ -7,7 +7,7 @@
 import { useEffect, useRef, useState } from "react";
 import { addDays } from "date-fns";
 import { observer } from "mobx-react";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 // ui
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IBlockUpdateData, IGanttBlock } from "@plane/types";
@@ -97,7 +97,7 @@ export const ChartAddBlock = observer(function ChartAddBlock(props: Props) {
             }}
             onClick={handleButtonClick}
           >
-            <PlusIcon className="h-3.5 w-3.5" />
+            <AddOutline className="h-3.5 w-3.5" />
           </button>
         </Tooltip>
       )}
diff --git a/apps/web/core/components/home/widgets/empty-states/no-projects.tsx b/apps/web/core/components/home/widgets/empty-states/no-projects.tsx
index 753fd66c5fd..24b3a0ae01c 100644
--- a/apps/web/core/components/home/widgets/empty-states/no-projects.tsx
+++ b/apps/web/core/components/home/widgets/empty-states/no-projects.tsx
@@ -9,12 +9,11 @@ import React from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
 import { useParams } from "next/navigation";
-import { Hotel } from "lucide-react";
+import { CloseOutline, MembersOutline, ProjectsOutline, TickOutline } from "@makeplane/propel/icons";
 // plane ui
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useLocalStorage } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
-import { MembersPropertyIcon, CheckIcon, ProjectIcon, CloseIcon } from "@plane/propel/icons";
 import { cn, getFileURL } from "@plane/utils";
 // hooks
 import { useCommandPalette } from "@/hooks/store/use-command-palette";
@@ -52,7 +51,7 @@ export const NoProjectsEmptyState = observer(function NoProjectsEmptyState() {
       id: "create-project",
       title: "home.empty.create_project.title",
       description: "home.empty.create_project.description",
-      icon: <ProjectIcon className="size-4" />,
+      icon: <ProjectsOutline className="size-4" />,
       flag: "projects",
       cta: {
         text: "home.empty.create_project.cta",
@@ -69,7 +68,7 @@ export const NoProjectsEmptyState = observer(function NoProjectsEmptyState() {
       id: "invite-team",
       title: "home.empty.invite_team.title",
       description: "home.empty.invite_team.description",
-      icon: <MembersPropertyIcon className="size-4" />,
+      icon: <MembersOutline className="size-4" />,
       flag: "visited_members",
       cta: {
         text: "home.empty.invite_team.cta",
@@ -81,7 +80,7 @@ export const NoProjectsEmptyState = observer(function NoProjectsEmptyState() {
       id: "configure-workspace",
       title: "home.empty.configure_workspace.title",
       description: "home.empty.configure_workspace.description",
-      icon: <Hotel className="size-4" />,
+      icon: <ProjectsOutline className="size-4" />,
       flag: "visited_workspace",
       cta: {
         text: "home.empty.configure_workspace.cta",
@@ -145,7 +144,7 @@ export const NoProjectsEmptyState = observer(function NoProjectsEmptyState() {
             setValue({ ...storedValue, hide: true });
           }}
         >
-          <CloseIcon className="size-4" />
+          <CloseOutline className="size-4" />
           {t("home.empty.not_right_now")}
         </button>
       </div>
@@ -165,7 +164,7 @@ export const NoProjectsEmptyState = observer(function NoProjectsEmptyState() {
               <p className="mb-2 text-11 text-tertiary">{t(item.description)}</p>
               {isStateComplete ? (
                 <div className="flex w-fit items-center gap-2 rounded-full bg-[#17a34a] p-1">
-                  <CheckIcon className="size-3 text-accent-primary text-on-color" />
+                  <TickOutline className="size-3 text-accent-primary text-on-color" />
                 </div>
               ) : (
                 !item.cta.disabled &&
diff --git a/apps/web/core/components/home/widgets/links/action.tsx b/apps/web/core/components/home/widgets/links/action.tsx
index f827495485f..1a9201e4ce1 100644
--- a/apps/web/core/components/home/widgets/links/action.tsx
+++ b/apps/web/core/components/home/widgets/links/action.tsx
@@ -5,7 +5,7 @@
  */
 
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 
 type TProps = {
   onClick: () => void;
@@ -20,7 +20,7 @@ export function AddLink(props: TProps) {
       onClick={onClick}
     >
       <div className="my-auto h-8 w-8 rounded-sm bg-layer-1/40 p-2">
-        <PlusIcon className="h-4 w-4 stroke-2 text-tertiary" />
+        <AddOutline className="h-4 w-4 text-tertiary" />
       </div>
       <div className="my-auto text-13 font-medium">{t("home.quick_links.add")}</div>
     </button>
diff --git a/apps/web/core/components/home/widgets/links/link-detail.tsx b/apps/web/core/components/home/widgets/links/link-detail.tsx
index e2a7bc72743..23918166421 100644
--- a/apps/web/core/components/home/widgets/links/link-detail.tsx
+++ b/apps/web/core/components/home/widgets/links/link-detail.tsx
@@ -8,7 +8,7 @@ import { useCallback, useMemo } from "react";
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, NewTabIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
+import { DeleteOutline, EditOutline, LinkOutline, NewTabOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TContextMenuItem } from "@plane/ui";
 import { LinkItemBlock } from "@plane/ui";
@@ -71,25 +71,25 @@ export const ProjectLinkDetail = observer(function ProjectLinkDetail(props: TPro
         key: "edit",
         action: () => handleEdit(true),
         title: t("edit"),
-        icon: EditIcon,
+        icon: EditOutline,
       },
       {
         key: "open-new-tab",
         action: handleOpenInNewTab,
         title: t("open_in_new_tab"),
-        icon: NewTabIcon,
+        icon: NewTabOutline,
       },
       {
         key: "copy-link",
         action: handleCopyText,
         title: t("copy_link"),
-        icon: LinkIcon,
+        icon: LinkOutline,
       },
       {
         key: "delete",
         action: handleDelete,
         title: t("delete"),
-        icon: TrashIcon,
+        icon: DeleteOutline,
       },
     ],
     [handleEdit, handleOpenInNewTab, handleCopyText, handleDelete, t]
diff --git a/apps/web/core/components/home/widgets/links/root.tsx b/apps/web/core/components/home/widgets/links/root.tsx
index 3eb9b92941f..39d76fad40b 100644
--- a/apps/web/core/components/home/widgets/links/root.tsx
+++ b/apps/web/core/components/home/widgets/links/root.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import useSWR from "swr";
 
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import type { THomeWidgetProps } from "@plane/types";
 import { useHome } from "@/hooks/store/use-home";
 import { LinkCreateUpdateModal } from "./create-update-link-modal";
@@ -53,7 +53,7 @@ export const DashboardQuickLinks = observer(function DashboardQuickLinks(props:
             onClick={handleCreateLinkModal}
             className="my-auto flex gap-1 text-13 font-medium text-accent-primary"
           >
-            <PlusIcon className="my-auto size-4" /> <span>{t("home.quick_links.add")}</span>
+            <AddOutline className="my-auto size-4" /> <span>{t("home.quick_links.add")}</span>
           </button>
         </div>
         <div className="flex w-full flex-wrap">
diff --git a/apps/web/core/components/home/widgets/recents/filters.tsx b/apps/web/core/components/home/widgets/recents/filters.tsx
index 8a710601a92..3dac629b960 100644
--- a/apps/web/core/components/home/widgets/recents/filters.tsx
+++ b/apps/web/core/components/home/widgets/recents/filters.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import type { TRecentActivityFilterKeys } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 import { cn } from "@plane/utils";
@@ -45,7 +45,7 @@ export const FiltersDropdown = observer(function FiltersDropdown(props: TFilters
       customButton={
         <button className="flex gap-1 rounded-sm border border-subtle px-2 py-1 capitalize hover:bg-layer-transparent-hover">
           <span className="my-auto text-13 font-medium">{t(title || "")}</span>
-          <ChevronDownIcon className={cn("my-auto size-3 text-tertiary duration-300 hover:text-secondary")} />
+          <ChevronDownOutline className={cn("my-auto size-3 text-tertiary duration-300 hover:text-secondary")} />
         </button>
       }
       customButtonClassName="flex justify-center"
diff --git a/apps/web/core/components/home/widgets/recents/index.tsx b/apps/web/core/components/home/widgets/recents/index.tsx
index 5c59c4189a2..0fa62abecab 100644
--- a/apps/web/core/components/home/widgets/recents/index.tsx
+++ b/apps/web/core/components/home/widgets/recents/index.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import useSWR from "swr";
 import { useTranslation } from "@plane/i18n";
 // plane types
-import { PageIcon, ProjectIcon, WorkItemsIcon } from "@plane/propel/icons";
+import { PagesOutline, ProjectsOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 import type { TActivityEntityData, THomeWidgetProps, TRecentActivityFilterKeys } from "@plane/types";
 // plane ui
 // components
@@ -27,9 +27,9 @@ const WIDGET_KEY = EWidgetKeys.RECENT_ACTIVITY;
 const workspaceService = new WorkspaceService();
 const filters: { name: TRecentActivityFilterKeys; icon?: React.ReactNode; i18n_key: string }[] = [
   { name: "all item", i18n_key: "home.recents.filters.all" },
-  { name: "issue", icon: <WorkItemsIcon className="h-4 w-4" />, i18n_key: "home.recents.filters.issues" },
-  { name: "page", icon: <PageIcon height={16} width={16} />, i18n_key: "home.recents.filters.pages" },
-  { name: "project", icon: <ProjectIcon height={16} width={16} />, i18n_key: "home.recents.filters.projects" },
+  { name: "issue", icon: <WorkItemsOutline className="h-4 w-4" />, i18n_key: "home.recents.filters.issues" },
+  { name: "page", icon: <PagesOutline height={16} width={16} />, i18n_key: "home.recents.filters.pages" },
+  { name: "project", icon: <ProjectsOutline height={16} width={16} />, i18n_key: "home.recents.filters.projects" },
 ];
 
 type TRecentWidgetProps = THomeWidgetProps & {
diff --git a/apps/web/core/components/home/widgets/recents/issue.tsx b/apps/web/core/components/home/widgets/recents/issue.tsx
index fe7076d3afc..83aa3642ce5 100644
--- a/apps/web/core/components/home/widgets/recents/issue.tsx
+++ b/apps/web/core/components/home/widgets/recents/issue.tsx
@@ -6,7 +6,8 @@
 
 import { observer } from "mobx-react";
 // plane types
-import { PriorityIcon, StateGroupIcon, WorkItemsIcon } from "@plane/propel/icons";
+import { PriorityIcon, StateGroupIcon } from "@plane/propel/icons";
+import { WorkItemsOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TActivityEntityData, TIssueEntityData } from "@plane/types";
 import { EIssueServiceType } from "@plane/types";
@@ -82,7 +83,7 @@ export const RecentIssue = observer(function RecentIssue(props: BlockProps) {
           ) : (
             <div className="flex items-center justify-center gap-2">
               <div className="grid size-8 flex-shrink-0 place-items-center rounded-sm bg-layer-2">
-                <WorkItemsIcon className="size-4 text-tertiary" />
+                <WorkItemsOutline className="size-4 text-tertiary" />
               </div>
               <div className="text-13 font-medium whitespace-nowrap text-placeholder">
                 {issueDetails?.project_identifier}-{issueDetails?.sequence_id}
diff --git a/apps/web/core/components/home/widgets/recents/page.tsx b/apps/web/core/components/home/widgets/recents/page.tsx
index 8669ff95459..f3e0563c138 100644
--- a/apps/web/core/components/home/widgets/recents/page.tsx
+++ b/apps/web/core/components/home/widgets/recents/page.tsx
@@ -7,7 +7,7 @@
 import { useRouter } from "next/navigation";
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { PageIcon } from "@plane/propel/icons";
+import { PagesOutline } from "@makeplane/propel/icons";
 // plane import
 import type { TActivityEntityData, TPageEntityData } from "@plane/types";
 import { calculateTimeAgo, getFileURL, getPageName } from "@plane/utils";
@@ -48,7 +48,7 @@ export function RecentPage(props: BlockProps) {
             {pageDetails?.logo_props?.in_use ? (
               <Logo logo={pageDetails?.logo_props} size={16} type="lucide" />
             ) : (
-              <PageIcon className="size-4 text-tertiary" />
+              <PagesOutline className="size-4 text-tertiary" />
             )}
           </div>
           {pageDetails?.project_identifier && (
diff --git a/apps/web/core/components/icons/locked-component.tsx b/apps/web/core/components/icons/locked-component.tsx
index 512f26a30e2..14f555c6a65 100644
--- a/apps/web/core/components/icons/locked-component.tsx
+++ b/apps/web/core/components/icons/locked-component.tsx
@@ -4,14 +4,14 @@
  * See the LICENSE file for details.
  */
 
-import { LockIcon } from "@plane/propel/icons";
+import { LockOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 
 export function LockedComponent(props: { toolTipContent?: string }) {
   const { toolTipContent } = props;
   const lockedComponent = (
     <div className="flex h-7 flex-shrink-0 items-center gap-2 rounded-full bg-layer-1 px-3 py-0.5 text-11 font-medium text-tertiary">
-      <LockIcon className="h-3 w-3" />
+      <LockOutline className="h-3 w-3" />
       <span>Locked</span>
     </div>
   );
diff --git a/apps/web/core/components/inbox/content/inbox-issue-header.tsx b/apps/web/core/components/inbox/content/inbox-issue-header.tsx
index 5243521731e..5531638ae9b 100644
--- a/apps/web/core/components/inbox/content/inbox-issue-header.tsx
+++ b/apps/web/core/components/inbox/content/inbox-issue-header.tsx
@@ -6,22 +6,25 @@
 
 import { useCallback, useEffect, useState } from "react";
 import { observer } from "mobx-react";
-import { Clock, FileStack, MoreHorizontal, MoveRight } from "lucide-react";
+import {
+  ArrowNarrowRightOutline,
+  ChevronDownOutline,
+  ChevronUpOutline,
+  ClockOutline,
+  CloseCircleFilled,
+  CopyOutline,
+  DeleteOutline,
+  DuplicateOfOutline,
+  LinkOutline,
+  MoreHorizontalOutline,
+  NewTabOutline,
+  TickCircleFilled,
+} from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { IconButton, getIconButtonStyling } from "@plane/propel/icon-button";
-import {
-  LinkIcon,
-  CopyIcon,
-  NewTabIcon,
-  TrashIcon,
-  ChevronDownIcon,
-  ChevronUpIcon,
-  CheckCircleFilledIcon,
-  CloseCircleFilledIcon,
-} from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TNameDescriptionLoader } from "@plane/types";
 import { EInboxIssueStatus } from "@plane/types";
@@ -290,7 +293,7 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
         <div className="flex items-center gap-4">
           {isNotificationEmbed && (
             <button onClick={embedRemoveCurrentNotification}>
-              <MoveRight className="h-4 w-4 text-tertiary hover:text-secondary" />
+              <ArrowNarrowRightOutline className="h-4 w-4 text-tertiary hover:text-secondary" />
             </button>
           )}
           {issue?.project_id && issue.sequence_id && (
@@ -310,14 +313,14 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
               <IconButton
                 variant="secondary"
                 size="lg"
-                icon={ChevronUpIcon}
+                icon={ChevronUpOutline}
                 aria-label="Previous work item"
                 onClick={() => handleInboxIssueNavigation("prev")}
               />
               <IconButton
                 variant="secondary"
                 size="lg"
-                icon={ChevronDownIcon}
+                icon={ChevronDownOutline}
                 aria-label="Next work item"
                 onClick={() => handleInboxIssueNavigation("next")}
               />
@@ -337,7 +340,7 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
                   )
                 }
               >
-                <CheckCircleFilledIcon className="size-4 shrink-0 text-success-secondary" />
+                <TickCircleFilled className="size-4 shrink-0 text-success-secondary" />
                 {t("inbox_issue.actions.accept")}
               </Button>
             )}
@@ -354,7 +357,7 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
                   )
                 }
               >
-                <CloseCircleFilledIcon className="size-4 shrink-0 text-danger-secondary" />
+                <CloseCircleFilled className="size-4 shrink-0 text-danger-secondary" />
                 {t("inbox_issue.actions.decline")}
               </Button>
             )}
@@ -364,13 +367,13 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
                 <Button
                   variant="secondary"
                   size="lg"
-                  prependIcon={<LinkIcon className="h-2.5 w-2.5" />}
+                  prependIcon={<LinkOutline className="h-2.5 w-2.5" />}
                   onClick={() => handleCopyIssueLink(workItemLink)}
                 >
                   {t("inbox_issue.actions.copy")}
                 </Button>
                 <ControlLink href={workItemLink} onClick={() => router.push(workItemLink)} target="_self">
-                  <Button variant="secondary" size="lg" prependIcon={<NewTabIcon className="h-2.5 w-2.5" />}>
+                  <Button variant="secondary" size="lg" prependIcon={<NewTabOutline className="h-2.5 w-2.5" />}>
                     {t("inbox_issue.actions.open")}
                   </Button>
                 </ControlLink>
@@ -379,7 +382,7 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
               <>
                 {isAllowed && (
                   <CustomMenu
-                    customButton={<MoreHorizontal className="size-4" />}
+                    customButton={<MoreHorizontalOutline className="size-4" />}
                     customButtonClassName={getIconButtonStyling("secondary", "lg")}
                     placement="bottom-start"
                   >
@@ -394,7 +397,7 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
                         }
                       >
                         <div className="flex items-center gap-2">
-                          <Clock size={14} strokeWidth={2} />
+                          <ClockOutline width={14} height={14} />
                           {inboxIssue?.snoozed_till && numberOfDaysLeft && numberOfDaysLeft > 0
                             ? t("inbox_issue.actions.unsnooze")
                             : t("inbox_issue.actions.snooze")}
@@ -412,21 +415,21 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
                         }
                       >
                         <div className="flex items-center gap-2">
-                          <FileStack size={14} strokeWidth={2} />
+                          <DuplicateOfOutline width={14} height={14} />
                           {t("inbox_issue.actions.mark_as_duplicate")}
                         </div>
                       </CustomMenu.MenuItem>
                     )}
                     <CustomMenu.MenuItem onClick={() => handleCopyIssueLink(workItemLink)}>
                       <div className="flex items-center gap-2">
-                        <CopyIcon width={14} height={14} strokeWidth={2} />
+                        <CopyOutline width={14} height={14} />
                         {t("inbox_issue.actions.copy")}
                       </div>
                     </CustomMenu.MenuItem>
                     {canDelete && (
                       <CustomMenu.MenuItem onClick={() => setDeleteIssueModal(true)}>
                         <div className="flex items-center gap-2">
-                          <TrashIcon width={14} height={14} strokeWidth={2} />
+                          <DeleteOutline width={14} height={14} />
                           {t("inbox_issue.actions.delete")}
                         </div>
                       </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx b/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx
index bde81665d54..b1e191d22b4 100644
--- a/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx
+++ b/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx
@@ -5,17 +5,21 @@
  */
 
 import { observer } from "mobx-react";
-import { Clock, FileStack, MoreHorizontal, PanelLeft, MoveRight } from "lucide-react";
-import { IconButton, getIconButtonStyling } from "@plane/propel/icon-button";
 import {
-  LinkIcon,
-  NewTabIcon,
-  TrashIcon,
-  ChevronDownIcon,
-  ChevronUpIcon,
-  CheckCircleFilledIcon,
-  CloseCircleFilledIcon,
-} from "@plane/propel/icons";
+  ArrowNarrowRightOutline,
+  ChevronDownOutline,
+  ChevronUpOutline,
+  ClockOutline,
+  CloseCircleFilled,
+  DeleteOutline,
+  DuplicateOfOutline,
+  LeftSidePaneOutline,
+  LinkOutline,
+  MoreHorizontalOutline,
+  NewTabOutline,
+  TickCircleFilled,
+} from "@makeplane/propel/icons";
+import { IconButton, getIconButtonStyling } from "@plane/propel/icon-button";
 import type { TNameDescriptionLoader } from "@plane/types";
 
 import { Header, CustomMenu, EHeaderVariant } from "@plane/ui";
@@ -103,10 +107,10 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
     <Header variant={EHeaderVariant.SECONDARY} className="justify-start">
       {isNotificationEmbed && (
         <button onClick={embedRemoveCurrentNotification}>
-          <MoveRight className="mr-2 h-4 w-4 text-tertiary hover:text-secondary" />
+          <ArrowNarrowRightOutline className="mr-2 h-4 w-4 text-tertiary hover:text-secondary" />
         </button>
       )}
-      <PanelLeft
+      <LeftSidePaneOutline
         onClick={() => setIsMobileSidebar(!isMobileSidebar)}
         className={cn("my-auto mr-2 h-4 w-4 flex-shrink-0", isMobileSidebar ? "text-accent-primary" : "text-secondary")}
       />
@@ -115,14 +119,14 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
           <IconButton
             variant="secondary"
             size="lg"
-            icon={ChevronUpIcon}
+            icon={ChevronUpOutline}
             aria-label="Previous work item"
             onClick={() => handleInboxIssueNavigation("prev")}
           />
           <IconButton
             variant="secondary"
             size="lg"
-            icon={ChevronDownIcon}
+            icon={ChevronDownOutline}
             aria-label="Next work item"
             onClick={() => handleInboxIssueNavigation("next")}
           />
@@ -135,14 +139,14 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
         </div>
         <div className="ml-auto">
           <CustomMenu
-            customButton={<MoreHorizontal className="size-4" />}
+            customButton={<MoreHorizontalOutline className="size-4" />}
             customButtonClassName={getIconButtonStyling("secondary", "lg")}
             placement="bottom-start"
           >
             {isAcceptedOrDeclined && (
               <CustomMenu.MenuItem onClick={handleCopyIssueLink}>
                 <div className="flex items-center gap-2">
-                  <LinkIcon width={14} height={14} strokeWidth={2} />
+                  <LinkOutline width={14} height={14} />
                   Copy work item link
                 </div>
               </CustomMenu.MenuItem>
@@ -150,7 +154,7 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
             {isAcceptedOrDeclined && (
               <CustomMenu.MenuItem onClick={() => router.push(workItemLink)}>
                 <div className="flex items-center gap-2">
-                  <NewTabIcon width={14} height={14} strokeWidth={2} />
+                  <NewTabOutline width={14} height={14} />
                   Open work item
                 </div>
               </CustomMenu.MenuItem>
@@ -166,7 +170,7 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
                 }
               >
                 <div className="flex items-center gap-2">
-                  <Clock size={14} strokeWidth={2} />
+                  <ClockOutline width={14} height={14} />
                   {inboxIssue?.snoozed_till && numberOfDaysLeft && numberOfDaysLeft > 0 ? "Un-snooze" : "Snooze"}
                 </div>
               </CustomMenu.MenuItem>
@@ -182,7 +186,7 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
                 }
               >
                 <div className="flex items-center gap-2">
-                  <FileStack size={14} strokeWidth={2} />
+                  <DuplicateOfOutline width={14} height={14} />
                   Mark as duplicate
                 </div>
               </CustomMenu.MenuItem>
@@ -198,7 +202,7 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
                 }
               >
                 <div className="flex items-center gap-2 text-success-secondary">
-                  <CheckCircleFilledIcon width={14} height={14} />
+                  <TickCircleFilled width={14} height={14} />
                   Accept
                 </div>
               </CustomMenu.MenuItem>
@@ -214,7 +218,7 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
                 }
               >
                 <div className="flex items-center gap-2 text-danger-secondary">
-                  <CloseCircleFilledIcon width={14} height={14} />
+                  <CloseCircleFilled width={14} height={14} />
                   Decline
                 </div>
               </CustomMenu.MenuItem>
@@ -222,7 +226,7 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
             {canDelete && !isAcceptedOrDeclined && (
               <CustomMenu.MenuItem onClick={() => setDeleteIssueModal(true)}>
                 <div className="flex items-center gap-2 text-danger-primary">
-                  <TrashIcon height={14} width={14} strokeWidth={2} />
+                  <DeleteOutline height={14} width={14} />
                   Delete
                 </div>
               </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/inbox/content/issue-properties.tsx b/apps/web/core/components/inbox/content/issue-properties.tsx
index 133a040c9f6..f8b0c36421c 100644
--- a/apps/web/core/components/inbox/content/issue-properties.tsx
+++ b/apps/web/core/components/inbox/content/issue-properties.tsx
@@ -6,13 +6,13 @@
 
 import { observer } from "mobx-react";
 import {
-  StatePropertyIcon,
-  MembersPropertyIcon,
-  PriorityPropertyIcon,
-  DueDatePropertyIcon,
-  LabelPropertyIcon,
-  DuplicatePropertyIcon,
-} from "@plane/propel/icons";
+  DueDateOutline,
+  DuplicateOfOutline,
+  LabelsOutline,
+  MembersOutline,
+  PriorityOutline,
+  StateOutline,
+} from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TInboxDuplicateIssueDetails, TIssue } from "@plane/types";
 import { ControlLink } from "@plane/ui";
@@ -69,7 +69,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
             {/* Intake State */}
             <div className="flex h-8 items-center gap-2">
               <div className="flex w-2/5 flex-shrink-0 items-center gap-1 text-13 text-tertiary">
-                <StatePropertyIcon className="h-4 w-4 flex-shrink-0" />
+                <StateOutline className="h-4 w-4 flex-shrink-0" />
                 <span>State</span>
               </div>
               {issue?.state_id && (
@@ -90,7 +90,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
             {/* Assignee */}
             <div className="flex h-8 items-center gap-2">
               <div className="flex w-2/5 flex-shrink-0 items-center gap-1 text-13 text-tertiary">
-                <MembersPropertyIcon className="h-4 w-4 flex-shrink-0" />
+                <MembersOutline className="h-4 w-4 flex-shrink-0" />
                 <span>Assignees</span>
               </div>
               <MemberDropdown
@@ -118,7 +118,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
             {/* Priority */}
             <div className="flex h-8 items-center gap-2">
               <div className="flex w-2/5 flex-shrink-0 items-center gap-1 text-13 text-tertiary">
-                <PriorityPropertyIcon className="h-4 w-4 flex-shrink-0" />
+                <PriorityOutline className="h-4 w-4 flex-shrink-0" />
                 <span>Priority</span>
               </div>
               <PriorityDropdown
@@ -140,7 +140,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
             {/* Due Date */}
             <div className="flex h-8 items-center gap-2">
               <div className="flex w-2/5 flex-shrink-0 items-center gap-1 text-13 text-tertiary">
-                <DueDatePropertyIcon className="h-4 w-4 flex-shrink-0" />
+                <DueDateOutline className="h-4 w-4 flex-shrink-0" />
                 <span>Due date</span>
               </div>
               <DateDropdown
@@ -165,7 +165,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
             {/* Labels */}
             <div className="flex min-h-8 items-center gap-2">
               <div className="flex w-2/5 flex-shrink-0 items-center gap-1 text-13 text-tertiary">
-                <LabelPropertyIcon className="h-4 w-4 flex-shrink-0" />
+                <LabelsOutline className="h-4 w-4 flex-shrink-0" />
                 <span>Labels</span>
               </div>
               <div className="h-full min-h-8 w-3/5 flex-grow pt-1">
@@ -188,7 +188,7 @@ export const InboxIssueContentProperties = observer(function InboxIssueContentPr
             {duplicateIssueDetails && (
               <div className="flex min-h-8 gap-2">
                 <div className="flex w-2/5 flex-shrink-0 gap-1 pt-2 text-13 text-tertiary">
-                  <DuplicatePropertyIcon className="h-4 w-4 flex-shrink-0" />
+                  <DuplicateOfOutline className="h-4 w-4 flex-shrink-0" />
                   <span>Duplicate of</span>
                 </div>
 
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx
index 47269b4416c..a19cc49f7f7 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/date.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { PAST_DURATION_FILTER_OPTIONS } from "@plane/constants";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TInboxIssueFilterDateKeys } from "@plane/types";
 import { renderFormattedDate } from "@plane/utils";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
@@ -53,7 +53,7 @@ export const InboxIssueAppliedFiltersDate = observer(function InboxIssueAppliedF
               className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
               onClick={() => handleInboxIssueFilters(filterKey, handleFilterValue(optionDetail?.value))}
             >
-              <CloseIcon className={`h-3 w-3`} />
+              <CloseOutline className={`h-3 w-3`} />
             </div>
           </div>
         );
@@ -63,7 +63,7 @@ export const InboxIssueAppliedFiltersDate = observer(function InboxIssueAppliedF
         className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
         onClick={clearFilter}
       >
-        <CloseIcon className={`h-3 w-3`} />
+        <CloseOutline className={`h-3 w-3`} />
       </div>
     </div>
   );
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx
index ef7d4511da7..8f137df25a0 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/label.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // hooks
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { useLabel } from "@/hooks/store/use-label";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 
@@ -44,7 +44,7 @@ export const InboxIssueAppliedFiltersLabel = observer(function InboxIssueApplied
               className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
               onClick={() => handleInboxIssueFilters("labels", handleFilterValue(value))}
             >
-              <CloseIcon className={`h-3 w-3`} />
+              <CloseOutline className={`h-3 w-3`} />
             </div>
           </div>
         );
@@ -54,7 +54,7 @@ export const InboxIssueAppliedFiltersLabel = observer(function InboxIssueApplied
         className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
         onClick={clearFilter}
       >
-        <CloseIcon className={`h-3 w-3`} />
+        <CloseOutline className={`h-3 w-3`} />
       </div>
     </div>
   );
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx
index 322382d2ee5..c7d755465ab 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/member.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 
 // plane types
 import { Avatar } from "@makeplane/propel/components/avatar";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TInboxIssueFilterMemberKeys } from "@plane/types";
 // helpers
 import { getFileURL } from "@plane/utils";
@@ -59,7 +59,7 @@ export const InboxIssueAppliedFiltersMember = observer(function InboxIssueApplie
               className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
               onClick={() => handleInboxIssueFilters(filterKey, handleFilterValue(value))}
             >
-              <CloseIcon className={`h-3 w-3`} />
+              <CloseOutline className={`h-3 w-3`} />
             </div>
           </div>
         );
@@ -69,7 +69,7 @@ export const InboxIssueAppliedFiltersMember = observer(function InboxIssueApplie
         className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
         onClick={clearFilter}
       >
-        <CloseIcon className={`h-3 w-3`} />
+        <CloseOutline className={`h-3 w-3`} />
       </div>
     </div>
   );
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx
index f100bccfb4a..85069f8909e 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/priority.tsx
@@ -7,7 +7,8 @@
 import { observer } from "mobx-react";
 import { ISSUE_PRIORITIES } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { PriorityIcon, CloseIcon } from "@plane/propel/icons";
+import { PriorityIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TIssuePriorities } from "@plane/types";
 // hooks
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
@@ -43,7 +44,7 @@ export const InboxIssueAppliedFiltersPriority = observer(function InboxIssueAppl
               className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
               onClick={() => handleInboxIssueFilters("priority", handleFilterValue(optionDetail?.key))}
             >
-              <CloseIcon className={`h-3 w-3`} />
+              <CloseOutline className={`h-3 w-3`} />
             </div>
           </div>
         );
@@ -53,7 +54,7 @@ export const InboxIssueAppliedFiltersPriority = observer(function InboxIssueAppl
         className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
         onClick={clearFilter}
       >
-        <CloseIcon className={`h-3 w-3`} />
+        <CloseOutline className={`h-3 w-3`} />
       </div>
     </div>
   );
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx
index 746e4e08410..26a416a5486 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/state.tsx
@@ -6,7 +6,8 @@
 
 import { observer } from "mobx-react";
 import { EIconSize } from "@plane/constants";
-import { StateGroupIcon, CloseIcon } from "@plane/propel/icons";
+import { StateGroupIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // hooks
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 import { useProjectState } from "@/hooks/store/use-project-state";
@@ -41,7 +42,7 @@ export const InboxIssueAppliedFiltersState = observer(function InboxIssueApplied
               className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
               onClick={() => handleInboxIssueFilters("state", handleFilterValue(optionDetail?.id))}
             >
-              <CloseIcon className={`h-3 w-3`} />
+              <CloseOutline className={`h-3 w-3`} />
             </div>
           </div>
         );
@@ -51,7 +52,7 @@ export const InboxIssueAppliedFiltersState = observer(function InboxIssueApplied
         className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
         onClick={clearFilter}
       >
-        <CloseIcon className={`h-3 w-3`} />
+        <CloseOutline className={`h-3 w-3`} />
       </div>
     </div>
   );
diff --git a/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx b/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx
index b0161b7bfa1..f78a13b31d1 100644
--- a/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/applied-filters/status.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 import { INBOX_STATUS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TInboxIssueStatus } from "@plane/types";
 import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 import { InboxStatusIcon } from "../../inbox-status-icon";
@@ -41,7 +41,7 @@ export const InboxIssueAppliedFiltersStatus = observer(function InboxIssueApplie
                 className="relative flex h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden text-tertiary transition-all hover:text-secondary"
                 onClick={() => handleInboxIssueFilters("status", handleFilterValue(optionDetail?.status))}
               >
-                <CloseIcon className={`h-3 w-3`} />
+                <CloseOutline className={`h-3 w-3`} />
               </div>
             )}
           </div>
diff --git a/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx b/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx
index 99ae144cd0c..18c378711bd 100644
--- a/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/filters/filter-selection.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 // hooks
 import { useLabel } from "@/hooks/store/use-label";
 import { useMember } from "@/hooks/store/use-member";
@@ -32,7 +32,7 @@ export const InboxIssueFilterSelection = observer(function InboxIssueFilterSelec
     <div className="flex h-full w-full flex-col overflow-hidden">
       <div className="bg-surface-1 p-2.5 pb-0">
         <div className="flex items-center gap-1.5 rounded-sm border-[0.5px] border-subtle bg-surface-2 px-1.5 py-1 text-11">
-          <SearchIcon className="text-placeholder" width={12} height={12} strokeWidth={2} />
+          <SearchOutline className="text-placeholder" width={12} height={12} />
           <input
             type="text"
             className="w-full bg-surface-2 outline-none placeholder:text-placeholder"
@@ -43,7 +43,7 @@ export const InboxIssueFilterSelection = observer(function InboxIssueFilterSelec
           />
           {filtersSearchQuery !== "" && (
             <button type="button" className="grid place-items-center" onClick={() => setFiltersSearchQuery("")}>
-              <CloseIcon className="text-tertiary" height={12} width={12} strokeWidth={2} />
+              <CloseOutline className="text-tertiary" height={12} width={12} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/inbox/inbox-filter/root.tsx b/apps/web/core/components/inbox/inbox-filter/root.tsx
index 2413ccc382f..5e830e3a22c 100644
--- a/apps/web/core/components/inbox/inbox-filter/root.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/root.tsx
@@ -4,10 +4,9 @@
  * See the LICENSE file for details.
  */
 
-import { ListFilter } from "lucide-react";
+import { ChevronDownOutline, FilterOutline } from "@makeplane/propel/icons";
 import { getButtonStyling } from "@plane/propel/button";
 // plane imports
-import { ChevronDownIcon } from "@plane/propel/icons";
 import { cn } from "@plane/utils";
 // components
 import { FiltersDropdown } from "@/components/issues/issue-layouts/filters";
@@ -17,13 +16,13 @@ import useSize from "@/hooks/use-window-size";
 import { InboxIssueFilterSelection } from "./filters/filter-selection";
 import { InboxIssueOrderByDropdown } from "./sorting/order-by";
 
-const smallButton = <ListFilter className="size-3" />;
+const smallButton = <FilterOutline className="size-3" />;
 
 const largeButton = (
   <div className={cn(getButtonStyling("secondary", "base"), "px-2 text-tertiary")}>
-    <ListFilter className="size-3" />
+    <FilterOutline className="size-3" />
     <span>Filters</span>
-    <ChevronDownIcon className="size-3" strokeWidth={2} />
+    <ChevronDownOutline className="size-3" />
   </div>
 );
 export function FiltersRoot() {
diff --git a/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx b/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx
index ad2e720c715..da18a8bbb6b 100644
--- a/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx
+++ b/apps/web/core/components/inbox/inbox-filter/sorting/order-by.tsx
@@ -5,11 +5,10 @@
  */
 
 import { observer } from "mobx-react";
-import { ArrowDownWideNarrow, ArrowUpWideNarrow } from "lucide-react";
+import { ChevronDownOutline, SortAscendingOutline, SortDescendingOutline, TickOutline } from "@makeplane/propel/icons";
 import { INBOX_ISSUE_ORDER_BY_OPTIONS, INBOX_ISSUE_SORT_BY_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { getButtonStyling } from "@plane/propel/button";
-import { CheckIcon, ChevronDownIcon } from "@plane/propel/icons";
 import type { TInboxIssueSortingOrderByKeys, TInboxIssueSortingSortByKeys } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 // constants
@@ -28,19 +27,19 @@ export const InboxIssueOrderByDropdown = observer(function InboxIssueOrderByDrop
     INBOX_ISSUE_ORDER_BY_OPTIONS.find((option) => inboxSorting?.order_by?.includes(option.key)) || undefined;
   const smallButton =
     inboxSorting?.sort_by === "asc" ? (
-      <ArrowUpWideNarrow className="size-3" />
+      <SortAscendingOutline className="size-3" />
     ) : (
-      <ArrowDownWideNarrow className="size-3" />
+      <SortDescendingOutline className="size-3" />
     );
   const largeButton = (
     <div className={cn(getButtonStyling("secondary", "base"), "px-2 text-tertiary")}>
       {inboxSorting?.sort_by === "asc" ? (
-        <ArrowUpWideNarrow className="size-3" />
+        <SortAscendingOutline className="size-3" />
       ) : (
-        <ArrowDownWideNarrow className="size-3" />
+        <SortDescendingOutline className="size-3" />
       )}
       {t(orderByDetails?.i18n_label || "inbox_issue.order_by.created_at")}
-      <ChevronDownIcon className="size-3" strokeWidth={2} />
+      <ChevronDownOutline className="size-3" />
     </div>
   );
   return (
@@ -57,7 +56,7 @@ export const InboxIssueOrderByDropdown = observer(function InboxIssueOrderByDrop
           onClick={() => handleInboxIssueSorting("order_by", option.key as TInboxIssueSortingOrderByKeys)}
         >
           {t(option.i18n_label)}
-          {inboxSorting?.order_by?.includes(option.key) && <CheckIcon className="size-3" />}
+          {inboxSorting?.order_by?.includes(option.key) && <TickOutline className="size-3" />}
         </CustomMenu.MenuItem>
       ))}
       <hr className="my-2 border-subtle" />
@@ -68,7 +67,7 @@ export const InboxIssueOrderByDropdown = observer(function InboxIssueOrderByDrop
           onClick={() => handleInboxIssueSorting("sort_by", option.key as TInboxIssueSortingSortByKeys)}
         >
           {t(option.i18n_label)}
-          {inboxSorting?.sort_by?.includes(option.key) && <CheckIcon className="size-3" />}
+          {inboxSorting?.sort_by?.includes(option.key) && <TickOutline className="size-3" />}
         </CustomMenu.MenuItem>
       ))}
     </CustomMenu>
diff --git a/apps/web/core/components/inbox/inbox-status-icon.tsx b/apps/web/core/components/inbox/inbox-status-icon.tsx
index ceaf5826d25..143bef6ecf9 100644
--- a/apps/web/core/components/inbox/inbox-status-icon.tsx
+++ b/apps/web/core/components/inbox/inbox-status-icon.tsx
@@ -4,35 +4,40 @@
  * See the LICENSE file for details.
  */
 
-import { AlertTriangle, CheckCircle2, Clock, XCircle } from "lucide-react";
-import { CopyIcon } from "@plane/propel/icons";
+import {
+  ClockOutline,
+  CloseCircleOutline,
+  CopyOutline,
+  TickCircleOutline,
+  WarningTriangleOutline,
+} from "@makeplane/propel/icons";
 import type { TInboxIssueStatus } from "@plane/types";
 import { EInboxIssueStatus } from "@plane/types";
 import { cn } from "@plane/utils";
 
 export const ICON_PROPERTIES = {
   [EInboxIssueStatus.PENDING]: {
-    icon: AlertTriangle,
+    icon: WarningTriangleOutline,
     textColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "text-warning-primary"),
     bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "bg-warning-subtle"),
   },
   [EInboxIssueStatus.DECLINED]: {
-    icon: XCircle,
+    icon: CloseCircleOutline,
     textColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "text-danger-primary"),
     bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "bg-danger-subtle"),
   },
   [EInboxIssueStatus.SNOOZED]: {
-    icon: Clock,
+    icon: ClockOutline,
     textColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "text-danger-primary" : "text-placeholder"),
     bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "bg-danger-subtle" : "bg-layer-3"),
   },
   [EInboxIssueStatus.ACCEPTED]: {
-    icon: CheckCircle2,
+    icon: TickCircleOutline,
     textColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "text-success-primary"),
     bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "bg-success-subtle"),
   },
   [EInboxIssueStatus.DUPLICATE]: {
-    icon: CopyIcon,
+    icon: CopyOutline,
     textColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "text-secondary"),
     bgColor: (snoozeDatePassed: boolean = false) => (snoozeDatePassed ? "" : "bg-layer-3"),
   },
@@ -51,5 +56,11 @@ export function InboxStatusIcon({
   if (type === undefined) return null;
   const Icon = ICON_PROPERTIES[type];
   if (!Icon) return null;
-  return <Icon.icon size={size} className={cn(`h-3 w-3 ${renderColor && Icon?.textColor(false)}`, className)} />;
+  return (
+    <Icon.icon
+      width={size}
+      height={size}
+      className={cn(`h-3 w-3 ${renderColor && Icon?.textColor(false)}`, className)}
+    />
+  );
 }
diff --git a/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx b/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx
index 6d6c80e937c..c0f76b46342 100644
--- a/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx
+++ b/apps/web/core/components/inbox/modals/create-modal/issue-properties.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { ETabIndices } from "@plane/constants";
-import { ParentPropertyIcon } from "@plane/propel/icons";
+import { ParentOutline } from "@makeplane/propel/icons";
 import type { ISearchIssueResponse, TIssue } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 import { renderFormattedPayloadDate, getDate, getTabIndex } from "@plane/utils";
@@ -181,7 +181,7 @@ export const InboxIssueProperties = observer(function InboxIssueProperties(props
                   type="button"
                   className="flex h-full cursor-pointer items-center justify-between gap-1 rounded-sm border-[0.5px] border-strong px-2 py-0.5 text-11 hover:bg-layer-1"
                 >
-                  <ParentPropertyIcon className="h-3 w-3 flex-shrink-0" />
+                  <ParentOutline className="h-3 w-3 flex-shrink-0" />
                   <span className="whitespace-nowrap">
                     {selectedParentIssue
                       ? `${selectedParentIssue.project__identifier}-${selectedParentIssue.sequence_id}`
@@ -215,7 +215,7 @@ export const InboxIssueProperties = observer(function InboxIssueProperties(props
               className="flex h-full cursor-pointer items-center justify-between gap-1 rounded-sm border-[0.5px] border-strong px-2 py-0.5 text-11 hover:bg-layer-1"
               onClick={() => setParentIssueModalOpen(true)}
             >
-              <ParentPropertyIcon className="h-3 w-3 flex-shrink-0" />
+              <ParentOutline className="h-3 w-3 flex-shrink-0" />
               <span className="whitespace-nowrap">Add parent</span>
             </button>
           )}
diff --git a/apps/web/core/components/inbox/modals/select-duplicate.tsx b/apps/web/core/components/inbox/modals/select-duplicate.tsx
index c90c8b2de40..1482226608d 100644
--- a/apps/web/core/components/inbox/modals/select-duplicate.tsx
+++ b/apps/web/core/components/inbox/modals/select-duplicate.tsx
@@ -10,7 +10,7 @@ import { useTheme } from "next-themes";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon } from "@plane/propel/icons";
+import { SearchOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { ISearchIssueResponse } from "@plane/types";
 import { Loader, EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
@@ -139,7 +139,7 @@ export function SelectDuplicateInboxIssueModal(props: Props) {
         }}
       >
         <div className="relative m-1">
-          <SearchIcon
+          <SearchOutline
             className="text-opacity-40 pointer-events-none absolute top-3.5 left-4 h-5 w-5 text-primary"
             aria-hidden="true"
           />
diff --git a/apps/web/core/components/inbox/root.tsx b/apps/web/core/components/inbox/root.tsx
index cf2d8780487..130d19b03cc 100644
--- a/apps/web/core/components/inbox/root.tsx
+++ b/apps/web/core/components/inbox/root.tsx
@@ -6,11 +6,10 @@
 
 import { useEffect, useState } from "react";
 import { observer } from "mobx-react";
-import { PanelLeft } from "lucide-react";
+import { IntakeOutline, LeftSidePaneOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { EmptyStateCompact } from "@plane/propel/empty-state";
-import { IntakeIcon } from "@plane/propel/icons";
 import { EInboxIssueCurrentTab } from "@plane/types";
 import { cn } from "@plane/utils";
 // components
@@ -69,7 +68,7 @@ export const InboxIssueRoot = observer(function InboxIssueRoot(props: TInboxIssu
   if (error && error?.status === "init-error")
     return (
       <div className="relative flex h-full w-full flex-col items-center justify-center gap-3">
-        <IntakeIcon className="size-[60px]" strokeWidth={1.5} />
+        <IntakeOutline className="size-[60px]" />
         <div className="text-secondary">{error?.message}</div>
       </div>
     );
@@ -78,7 +77,7 @@ export const InboxIssueRoot = observer(function InboxIssueRoot(props: TInboxIssu
     <>
       {!inboxIssueId && (
         <div className="flex h-12 w-full items-center border-b border-subtle px-4 lg:hidden">
-          <PanelLeft
+          <LeftSidePaneOutline
             onClick={() => setIsMobileSidebar(!isMobileSidebar)}
             className={cn("h-4 w-4", isMobileSidebar ? "text-accent-primary" : "text-secondary")}
           />
diff --git a/apps/web/core/components/integration/single-integration-card.tsx b/apps/web/core/components/integration/single-integration-card.tsx
index 3176039fa9f..889e6b70de0 100644
--- a/apps/web/core/components/integration/single-integration-card.tsx
+++ b/apps/web/core/components/integration/single-integration-card.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import useSWR, { mutate } from "swr";
-import { CheckCircle } from "lucide-react";
+import { TickCircleOutline } from "@makeplane/propel/icons";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { Button } from "@plane/propel/button";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
@@ -124,7 +124,7 @@ export const SingleIntegrationCard = observer(function SingleIntegrationCard({ i
           <h3 className="flex items-center gap-2 text-body-xs-medium">
             {integration.title}
             {workspaceIntegrations
-              ? isInstalled && <CheckCircle className="h-3.5 w-3.5 fill-transparent text-success-primary" />
+              ? isInstalled && <TickCircleOutline className="h-3.5 w-3.5 fill-transparent text-success-primary" />
               : null}
           </h3>
           <p className="text-body-xs-regular text-secondary">
diff --git a/apps/web/core/components/issues/attachment/attachment-detail.tsx b/apps/web/core/components/issues/attachment/attachment-detail.tsx
index c27e4412fc5..87abec23d7c 100644
--- a/apps/web/core/components/issues/attachment/attachment-detail.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-detail.tsx
@@ -7,8 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
-import { AlertCircle } from "lucide-react";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, WarningCircleOutline } from "@makeplane/propel/icons";
 // ui
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import {
@@ -88,7 +87,7 @@ export const IssueAttachmentsDetail = observer(function IssueAttachmentsDetail(p
                   disabled={isMobile}
                 >
                   <span>
-                    <AlertCircle className="h-3 w-3" />
+                    <WarningCircleOutline className="h-3 w-3" />
                   </span>
                 </Tooltip>
               </div>
@@ -103,7 +102,7 @@ export const IssueAttachmentsDetail = observer(function IssueAttachmentsDetail(p
 
         {!disabled && (
           <button type="button" onClick={() => setIsDeleteIssueAttachmentModalOpen(true)}>
-            <CloseIcon className="h-4 w-4 text-secondary hover:text-primary" />
+            <CloseOutline className="h-4 w-4 text-secondary hover:text-primary" />
           </button>
         )}
       </div>
diff --git a/apps/web/core/components/issues/attachment/attachment-item-list.tsx b/apps/web/core/components/issues/attachment/attachment-item-list.tsx
index 4341e5c9510..4473b16f084 100644
--- a/apps/web/core/components/issues/attachment/attachment-item-list.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-item-list.tsx
@@ -8,7 +8,7 @@ import { useCallback, useState } from "react";
 import { observer } from "mobx-react";
 import type { FileRejection } from "react-dropzone";
 import { useDropzone } from "react-dropzone";
-import { UploadCloud } from "lucide-react";
+import { UploadOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TIssueServiceType } from "@plane/types";
@@ -135,7 +135,7 @@ export const IssueAttachmentItemList = observer(function IssueAttachmentItemList
               <div className="absolute top-0 left-0 z-30 flex h-full w-full items-center justify-center bg-surface-2/75">
                 <div className="flex items-center justify-center rounded-md bg-surface-1 p-1">
                   <div className="flex flex-col items-center justify-center rounded-md border border-dashed border-strong px-5 py-6">
-                    <UploadCloud className="size-7" />
+                    <UploadOutline className="size-7" />
                     <span className="text-13 text-tertiary">{t("attachment.drag_and_drop")}</span>
                   </div>
                 </div>
diff --git a/apps/web/core/components/issues/attachment/attachment-list-item.tsx b/apps/web/core/components/issues/attachment/attachment-list-item.tsx
index ed7319a6b8b..870e9e5cd21 100644
--- a/apps/web/core/components/issues/attachment/attachment-list-item.tsx
+++ b/apps/web/core/components/issues/attachment/attachment-list-item.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { TrashIcon } from "@plane/propel/icons";
+import { DeleteOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TIssueServiceType } from "@plane/types";
 import { EIssueServiceType } from "@plane/types";
@@ -94,7 +94,7 @@ export const IssueAttachmentsListItem = observer(function IssueAttachmentsListIt
                 }}
               >
                 <div className="flex items-center gap-2">
-                  <TrashIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                  <DeleteOutline className="h-3.5 w-3.5" />
                   <span>{t("common.actions.delete")}</span>
                 </div>
               </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/issues/filters.tsx b/apps/web/core/components/issues/filters.tsx
index cbd899e9f24..6d0fb1b40b0 100644
--- a/apps/web/core/components/issues/filters.tsx
+++ b/apps/web/core/components/issues/filters.tsx
@@ -6,7 +6,7 @@
 
 import { useCallback, useState } from "react";
 import { observer } from "mobx-react";
-import { ChartNoAxesColumn, SlidersHorizontal } from "lucide-react";
+import { BarOutline, PreferencesOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EIssueFilterType, ISSUE_STORE_TO_FILTERS_MAP } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -110,7 +110,7 @@ export const HeaderFilters = observer(function HeaderFilters(props: Props) {
       </div>
       <WorkItemFiltersToggle entityType={storeType} entityId={projectId} />
       <FiltersDropdown
-        miniIcon={<SlidersHorizontal className="size-3.5" />}
+        miniIcon={<PreferencesOutline className="size-3.5" />}
         title={t("common.display")}
         placement="bottom-end"
       >
@@ -129,7 +129,7 @@ export const HeaderFilters = observer(function HeaderFilters(props: Props) {
         <Button className="hidden px-2 md:block" onClick={() => setAnalyticsModal(true)} variant="secondary" size="lg">
           <div className="hidden @4xl:flex">{t("common.analytics")}</div>
           <div className="flex @4xl:hidden">
-            <ChartNoAxesColumn className="size-3.5" />
+            <BarOutline className="size-3.5" />
           </div>
         </Button>
       ) : (
diff --git a/apps/web/core/components/issues/header.tsx b/apps/web/core/components/issues/header.tsx
index aff203e03a0..dcd86d300ee 100644
--- a/apps/web/core/components/issues/header.tsx
+++ b/apps/web/core/components/issues/header.tsx
@@ -12,7 +12,7 @@ import { Circle } from "lucide-react";
 import { EUserPermissions, EUserPermissionsLevel, SPACE_BASE_PATH, SPACE_BASE_URL } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { NewTabIcon, WorkItemsIcon } from "@plane/propel/icons";
+import { NewTabOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { EIssuesStoreType } from "@plane/types";
 import { Breadcrumbs, Header } from "@plane/ui";
@@ -71,7 +71,7 @@ export const IssuesHeader = observer(function IssuesHeader() {
                 <BreadcrumbLink
                   label="Work Items"
                   href={`/${workspaceSlug}/projects/${projectId}/issues/`}
-                  icon={<WorkItemsIcon className="h-4 w-4 text-tertiary" />}
+                  icon={<WorkItemsOutline className="h-4 w-4 text-tertiary" />}
                   isLast
                 />
               }
@@ -98,7 +98,7 @@ export const IssuesHeader = observer(function IssuesHeader() {
           >
             <Circle className="h-1.5 w-1.5 fill-accent-primary" strokeWidth={2} />
             {t("workspace_projects.network.public.title")}
-            <NewTabIcon className="hidden h-3 w-3 group-hover:block" strokeWidth={2} />
+            <NewTabOutline className="hidden h-3 w-3 group-hover:block" />
           </a>
         ) : (
           <></>
diff --git a/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx b/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx
index 688169f0450..38bea85d80b 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx
@@ -5,9 +5,8 @@
  */
 
 import React from "react";
-import { Paperclip } from "lucide-react";
+import { AttachOutline, LinkOutline, RelationsOutline, ViewsOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, ViewsIcon, RelationPropertyIcon } from "@plane/propel/icons";
 // plane imports
 import type { TIssueServiceType, TWorkItemWidgets } from "@plane/types";
 // local imports
@@ -39,7 +38,7 @@ export function IssueDetailWidgetActionButtons(props: Props) {
           customButton={
             <IssueDetailWidgetButton
               title={t("issue.add.sub_issue")}
-              icon={<ViewsIcon className="h-3.5 w-3.5 flex-shrink-0" strokeWidth={2} />}
+              icon={<ViewsOutline className="h-3.5 w-3.5 flex-shrink-0" />}
               disabled={disabled}
             />
           }
@@ -53,7 +52,7 @@ export function IssueDetailWidgetActionButtons(props: Props) {
           customButton={
             <IssueDetailWidgetButton
               title={t("issue.add.relation")}
-              icon={<RelationPropertyIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+              icon={<RelationsOutline className="h-3.5 w-3.5 flex-shrink-0" />}
               disabled={disabled}
             />
           }
@@ -66,7 +65,7 @@ export function IssueDetailWidgetActionButtons(props: Props) {
           customButton={
             <IssueDetailWidgetButton
               title={t("issue.add.link")}
-              icon={<LinkIcon className="h-3.5 w-3.5 flex-shrink-0" strokeWidth={2} />}
+              icon={<LinkOutline className="h-3.5 w-3.5 flex-shrink-0" />}
               disabled={disabled}
             />
           }
@@ -82,7 +81,7 @@ export function IssueDetailWidgetActionButtons(props: Props) {
           customButton={
             <IssueDetailWidgetButton
               title={t("common.attach")}
-              icon={<Paperclip className="h-3.5 w-3.5 flex-shrink-0" strokeWidth={2} />}
+              icon={<AttachOutline className="h-3.5 w-3.5 flex-shrink-0" />}
               disabled={disabled}
             />
           }
diff --git a/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx
index dc6155550f0..ff88b1aef57 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/attachments/quick-action-button.tsx
@@ -8,7 +8,7 @@ import React, { useCallback, useState } from "react";
 import { observer } from "mobx-react";
 import type { FileRejection } from "react-dropzone";
 import { useDropzone } from "react-dropzone";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 // plane imports
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TIssueServiceType } from "@plane/types";
@@ -103,7 +103,7 @@ export const IssueAttachmentActionButton = observer(function IssueAttachmentActi
     >
       <button {...getRootProps()} type="button" disabled={disabled}>
         <input {...getInputProps()} />
-        {customButton ? customButton : <PlusIcon className="h-4 w-4" />}
+        {customButton ? customButton : <AddOutline className="h-4 w-4" />}
       </button>
     </div>
   );
diff --git a/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx
index 7ed50892902..054ff87ae95 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/links/quick-action-button.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TIssueServiceType } from "@plane/types";
 // hooks
@@ -32,7 +32,7 @@ export const IssueLinksActionButton = observer(function IssueLinksActionButton(p
 
   return (
     <button type="button" onClick={handleOnClick} disabled={disabled}>
-      {customButton ? customButton : <PlusIcon className="h-4 w-4" />}
+      {customButton ? customButton : <AddOutline className="h-4 w-4" />}
     </button>
   );
 });
diff --git a/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx
index c2f41bcf3fa..c70f7da2aad 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/relations/quick-action-button.tsx
@@ -8,7 +8,7 @@ import React from "react";
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TIssueServiceType } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
@@ -41,7 +41,7 @@ export const RelationActionButton = observer(function RelationActionButton(props
   };
 
   // button element
-  const customButtonElement = customButton ? <>{customButton}</> : <PlusIcon className="h-4 w-4" />;
+  const customButtonElement = customButton ? <>{customButton}</> : <AddOutline className="h-4 w-4" />;
 
   return (
     <CustomMenu
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx
index cf4260b2eba..38eabc48537 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/display-filters.tsx
@@ -7,7 +7,7 @@
 import { useMemo } from "react";
 import { isEmpty } from "lodash-es";
 import { observer } from "mobx-react";
-import { SlidersHorizontal } from "lucide-react";
+import { PreferencesOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { IIssueDisplayFilterOptions, ILayoutDisplayFiltersOptions, IIssueDisplayProperties } from "@plane/types";
 import { cn } from "@plane/utils";
@@ -56,7 +56,7 @@ export const SubIssueDisplayFilters = observer(function SubIssueDisplayFilters(p
               )}
             >
               {isFilterApplied && <span className="absolute -top-1 -right-1 rounded-full bg-accent-primary p-1" />}
-              <SlidersHorizontal className="h-3.5 w-3.5 text-primary" />
+              <PreferencesOutline className="h-3.5 w-3.5 text-primary" />
             </div>
           }
         >
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx
index de9c765f9c3..4f9a681b8d7 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/filters.tsx
@@ -6,9 +6,8 @@
 
 import { useMemo, useState } from "react";
 import { observer } from "mobx-react";
-import { ListFilter } from "lucide-react";
+import { CloseOutline, FilterOutline, SearchOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
 import type { IIssueFilterOptions, IState } from "@plane/types";
 import { cn } from "@plane/utils";
 import {
@@ -53,14 +52,14 @@ export const SubIssueFilters = observer(function SubIssueFilters(props: TSubIssu
             )}
           >
             {isFilterApplied && <span className="absolute -top-1 -right-1 rounded-full bg-accent-primary p-1" />}
-            <ListFilter className="h-3.5 w-3.5 text-primary" />
+            <FilterOutline className="h-3.5 w-3.5 text-primary" />
           </div>
         }
       >
         <div className="flex max-h-[350px] flex-col overflow-hidden">
           <div className="bg-surface-1 p-2.5 pb-0">
             <div className="flex items-center gap-1.5 rounded-sm border-[0.5px] border-subtle bg-surface-2 px-1.5 py-1 text-11">
-              <SearchIcon className="text-placeholder" width={12} height={12} strokeWidth={2} />
+              <SearchOutline className="text-placeholder" width={12} height={12} />
               <input
                 type="text"
                 className="w-full bg-surface-2 outline-none placeholder:text-placeholder"
@@ -70,7 +69,7 @@ export const SubIssueFilters = observer(function SubIssueFilters(props: TSubIssu
               />
               {filtersSearchQuery !== "" && (
                 <button type="button" className="grid place-items-center" onClick={() => setFiltersSearchQuery("")}>
-                  <CloseIcon className="text-tertiary" height={12} width={12} strokeWidth={2} />
+                  <CloseOutline className="text-tertiary" height={12} width={12} />
                 </button>
               )}
             </div>
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx
index b76d7241002..65cd542e658 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-group.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import { CircleDashed } from "lucide-react";
 import { ALL_ISSUES } from "@plane/constants";
-import { ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline } from "@makeplane/propel/icons";
 import type { IGroupByColumn, TIssue, TIssueServiceType, TSubIssueOperations } from "@plane/types";
 import { EIssuesStoreType } from "@plane/types";
 import { Collapsible } from "@plane/ui";
@@ -65,11 +65,10 @@ export const SubIssuesListGroup = observer(function SubIssuesListGroup(props: TS
         title={
           !isAllIssues && (
             <div className="flex items-center gap-2 p-3">
-              <ChevronRightIcon
+              <ChevronRightOutline
                 className={cn("size-3.5 text-placeholder transition-all", {
                   "rotate-90": isCollapsibleOpen,
                 })}
-                strokeWidth={2.5}
               />
               <div className="grid flex-shrink-0 place-items-center overflow-hidden">
                 {group.icon ?? <CircleDashed className="size-3.5" strokeWidth={2} />}
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx
index d4df90d71ea..b62b56af7a7 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx
@@ -5,9 +5,8 @@
  */
 
 import { observer } from "mobx-react";
-import { Link as Loader } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, EditIcon, TrashIcon, CloseIcon, ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline, CloseOutline, DeleteOutline, EditOutline, LinkOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TIssue, TIssueServiceType, TSubIssueOperations } from "@plane/types";
@@ -122,7 +121,7 @@ export const SubIssuesListItem = observer(function SubIssuesListItem(props: Prop
                 <>
                   {subIssueHelpers.preview_loader.includes(issue.id) ? (
                     <div className="flex h-full w-full cursor-not-allowed items-center justify-center rounded-xs bg-layer-1 transition-all">
-                      <Loader width={14} strokeWidth={2} className="animate-spin" />
+                      <LinkOutline width={14} height={14} className="animate-spin" />
                     </div>
                   ) : (
                     <div
@@ -138,11 +137,10 @@ export const SubIssuesListItem = observer(function SubIssuesListItem(props: Prop
                         setSubIssueHelpers(parentIssueId, "issue_visibility", issueId);
                       }}
                     >
-                      <ChevronRightIcon
+                      <ChevronRightOutline
                         className={cn("size-3.5 transition-all", {
                           "rotate-90": subIssueHelpers.issue_visibility.includes(issue.id),
                         })}
-                        strokeWidth={2.5}
                       />
                     </div>
                   )}
@@ -198,7 +196,7 @@ export const SubIssuesListItem = observer(function SubIssuesListItem(props: Prop
                     }}
                   >
                     <div className="flex items-center gap-2">
-                      <EditIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                      <EditOutline className="h-3.5 w-3.5" />
                       <span>{t("issue.edit")}</span>
                     </div>
                   </CustomMenu.MenuItem>
@@ -210,7 +208,7 @@ export const SubIssuesListItem = observer(function SubIssuesListItem(props: Prop
                   }}
                 >
                   <div className="flex items-center gap-2">
-                    <LinkIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                    <LinkOutline className="h-3.5 w-3.5" />
                     <span>{t("issue.copy_link")}</span>
                   </div>
                 </CustomMenu.MenuItem>
@@ -223,7 +221,7 @@ export const SubIssuesListItem = observer(function SubIssuesListItem(props: Prop
                     }}
                   >
                     <div className="flex items-center gap-2">
-                      <CloseIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                      <CloseOutline className="h-3.5 w-3.5" />
                       {issueServiceType === EIssueServiceType.ISSUES
                         ? t("issue.remove.parent.label")
                         : t("issue.remove.label")}
@@ -239,7 +237,7 @@ export const SubIssuesListItem = observer(function SubIssuesListItem(props: Prop
                     }}
                   >
                     <div className="flex items-center gap-2">
-                      <TrashIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                      <DeleteOutline className="h-3.5 w-3.5" />
                       <span>{t("issue.delete.label")}</span>
                     </div>
                   </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx
index 250e8ff883b..550a3eee451 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/properties.tsx
@@ -9,7 +9,7 @@ import type { SyntheticEvent } from "react";
 import { useMemo } from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
-import { StartDatePropertyIcon, DueDatePropertyIcon } from "@plane/propel/icons";
+import { DueDateOutline, StartDateOutline } from "@makeplane/propel/icons";
 import type { IIssueDisplayProperties, TIssue } from "@plane/types";
 import { getDate, renderFormattedPayloadDate, shouldHighlightIssueDueDate } from "@plane/utils";
 // components
@@ -172,7 +172,7 @@ export const SubIssuesListItemProperties = observer(function SubIssuesListItemPr
             onChange={handleStartDate}
             maxDate={maxDate}
             placeholder={t("common.order_by.start_date")}
-            icon={<StartDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+            icon={<StartDateOutline className="h-3 w-3 flex-shrink-0" />}
             buttonVariant={issue.start_date ? "border-with-text" : "border-without-text"}
             optionsClassName="z-30"
             disabled={!canEdit}
@@ -193,7 +193,7 @@ export const SubIssuesListItemProperties = observer(function SubIssuesListItemPr
             onChange={handleTargetDate}
             minDate={minDate}
             placeholder={t("common.order_by.due_date")}
-            icon={<DueDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+            icon={<DueDateOutline className="h-3 w-3 flex-shrink-0" />}
             buttonVariant={issue.target_date ? "border-with-text" : "border-without-text"}
             buttonClassName={shouldHighlight ? "text-danger-primary" : ""}
             clearIconClassName="text-primary"
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx
index ef808a1fe7c..1b509f151df 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/root.tsx
@@ -7,7 +7,7 @@
 import { useCallback, useMemo } from "react";
 import { observer } from "mobx-react";
 // plane imports
-import { ListFilter } from "lucide-react";
+import { FilterOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import type { GroupByColumnTypes, TIssue, TIssueServiceType, TSubIssueOperations } from "@plane/types";
@@ -99,7 +99,7 @@ export const SubIssuesListRoot = observer(function SubIssuesListRoot(props: Prop
               ? t("sub_work_item.empty_state.list_filters.description")
               : t("sub_work_item.empty_state.sub_list_filters.description")
           }
-          icon={<ListFilter />}
+          icon={<FilterOutline />}
           customClassName={storeType !== EIssuesStoreType.EPIC ? "border-none" : ""}
           actionElement={
             <Button variant="secondary" onClick={() => resetFilters(rootIssueId)}>
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx
index ded8cc8cb96..eb6dbfa8626 100644
--- a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx
+++ b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/quick-action-button.tsx
@@ -8,7 +8,7 @@ import React from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon, WorkItemsIcon } from "@plane/propel/icons";
+import { AddOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 import type { TIssue, TIssueServiceType } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 // hooks
@@ -69,18 +69,18 @@ export const SubIssuesActionButton = observer(function SubIssuesActionButton(pro
   const optionItems = [
     {
       i18n_label: "common.create_new",
-      icon: <PlusIcon className="h-3 w-3" />,
+      icon: <AddOutline className="h-3 w-3" />,
       onClick: handleCreateNew,
     },
     {
       i18n_label: "common.add_existing",
-      icon: <WorkItemsIcon className="h-3 w-3" />,
+      icon: <WorkItemsOutline className="h-3 w-3" />,
       onClick: handleAddExisting,
     },
   ];
 
   // button element
-  const customButtonElement = customButton ? <>{customButton}</> : <PlusIcon className="h-4 w-4" />;
+  const customButtonElement = customButton ? <>{customButton}</> : <AddOutline className="h-4 w-4" />;
 
   return (
     <CustomMenu customButton={customButtonElement} placement="bottom-start" disabled={disabled} closeOnSelect>
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx
index 60169008867..1b4f094a738 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity-filter.tsx
@@ -5,12 +5,11 @@
  */
 
 import { observer } from "mobx-react";
-import { ListFilter } from "lucide-react";
+import { FilterOutline, TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TActivityFilters, TActivityFilterOption } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { IconButton } from "@plane/propel/icon-button";
-import { CheckIcon } from "@plane/propel/icons";
 import { PopoverMenu } from "@plane/ui";
 // helper
 import { cn } from "@plane/utils";
@@ -32,7 +31,7 @@ export const ActivityFilter = observer(function ActivityFilter(props: TActivityF
       buttonClassName="outline-none"
       button={
         <>
-          <IconButton variant="tertiary" icon={ListFilter} />
+          <IconButton variant="tertiary" icon={FilterOutline} />
           {selectedFilters.length < filterOptions.length && (
             <span className="absolute -top-0.5 -right-0.5 h-2 w-2 rounded-full bg-accent-primary" />
           )}
@@ -57,7 +56,7 @@ export const ActivityFilter = observer(function ActivityFilter(props: TActivityF
               }
             )}
           >
-            {item.isSelected && <CheckIcon className="h-2.5 w-2.5" />}
+            {item.isSelected && <TickOutline className="h-2.5 w-2.5" />}
           </div>
           <div className={cn("whitespace-nowrap", item.isSelected ? "text-primary" : "text-secondary")}>
             {t(item.labelTranslationKey)}
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx
index 588d2983398..31e3b9fd22b 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/archived-at.tsx
@@ -5,9 +5,8 @@
  */
 
 import { observer } from "mobx-react";
-import { RotateCcw } from "lucide-react";
+import { ArchiveOutline, RefreshOutline } from "@makeplane/propel/icons";
 // hooks
-import { ArchiveIcon } from "@plane/propel/icons";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
 import { IssueActivityBlockComponent } from "./";
@@ -30,9 +29,9 @@ export const IssueArchivedAtActivity = observer(function IssueArchivedAtActivity
     <IssueActivityBlockComponent
       icon={
         activity.new_value === "restore" ? (
-          <RotateCcw className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />
+          <RefreshOutline className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />
         ) : (
-          <ArchiveIcon className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />
+          <ArchiveOutline className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />
         )
       }
       activityId={activityId}
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx
index 35fff299a66..35219aa0e02 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/assignee.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // icons
-import { MembersPropertyIcon } from "@plane/propel/icons";
+import { MembersOutline } from "@makeplane/propel/icons";
 // hooks;
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -26,7 +26,7 @@ export const IssueAssigneeActivity = observer(function IssueAssigneeActivity(pro
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<MembersPropertyIcon className="h-3.5 w-3.5 flex-shrink-0 text-secondary" />}
+      icon={<MembersOutline className="h-3.5 w-3.5 flex-shrink-0 text-secondary" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx
index c25c4539bb6..abede9fd892 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/attachment.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { Paperclip } from "lucide-react";
+import { AttachOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -25,7 +25,7 @@ export const IssueAttachmentActivity = observer(function IssueAttachmentActivity
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<Paperclip size={14} className="text-secondary" aria-hidden="true" />}
+      icon={<AttachOutline width={14} height={14} className="text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx
index 35fada263b5..27fa813c198 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/cycle.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // hooks
-import { CycleIcon } from "@plane/propel/icons";
+import { CyclesOutline } from "@makeplane/propel/icons";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
 import { IssueActivityBlockComponent } from "./";
@@ -26,7 +26,7 @@ export const IssueCycleActivity = observer(function IssueCycleActivity(props: TI
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<CycleIcon className="h-4 w-4 flex-shrink-0 text-secondary" />}
+      icon={<CyclesOutline className="h-4 w-4 flex-shrink-0 text-secondary" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx
index b95177cff02..a63c9bad759 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/default.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // plane imports
-import { WorkItemsIcon } from "@plane/propel/icons";
+import { WorkItemsOutline } from "@makeplane/propel/icons";
 import { EInboxIssueSource } from "@plane/types";
 // hooks
 import { capitalizeFirstLetter } from "@plane/utils";
@@ -31,7 +31,7 @@ export const IssueDefaultActivity = observer(function IssueDefaultActivity(props
   return (
     <IssueActivityBlockComponent
       activityId={activityId}
-      icon={<WorkItemsIcon width={14} height={14} className="text-secondary" aria-hidden="true" />}
+      icon={<WorkItemsOutline width={14} height={14} className="text-secondary" aria-hidden="true" />}
       ends={ends}
     >
       <>
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx
index 1c40cfb12fe..838aa6bf0ba 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/description.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { AlignLeft } from "lucide-react";
+import { AlignLeftOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -25,7 +25,7 @@ export const IssueDescriptionActivity = observer(function IssueDescriptionActivi
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<AlignLeft size={14} className="text-secondary" aria-hidden="true" />}
+      icon={<AlignLeftOutline width={14} height={14} className="text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx
index e4ae08471e0..5e630834081 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/estimate.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { EstimatePropertyIcon } from "@plane/propel/icons";
+import { EstimateOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -26,7 +26,7 @@ export const IssueEstimateActivity = observer(function IssueEstimateActivity(pro
 
   return (
     <IssueActivityBlockComponent
-      icon={<EstimatePropertyIcon className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />}
+      icon={<EstimateOutline className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx
index b3093c9d460..e26a79d5d93 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/helpers/activity-block.tsx
@@ -5,7 +5,7 @@
  */
 
 import type { ReactNode } from "react";
-import { Network } from "lucide-react";
+import { HierarchyOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { renderFormattedTime, renderFormattedDate, calculateTimeAgo } from "@plane/utils";
@@ -41,7 +41,7 @@ export function IssueActivityBlockComponent(props: TIssueActivityBlockComponent)
     >
       <div className="absolute top-0 bottom-0 left-[13px] w-px bg-layer-3" aria-hidden />
       <div className="z-[4] flex h-7 w-7 flex-shrink-0 items-center justify-center overflow-hidden rounded-lg border border-subtle bg-layer-2 text-secondary shadow-raised-100">
-        {icon ? icon : <Network className="h-3.5 w-3.5" />}
+        {icon ? icon : <HierarchyOutline className="h-3.5 w-3.5" />}
       </div>
       <div className="w-full truncate text-secondary">
         {!activity?.field && activity?.verb === "created" ? (
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx
index 4dd03c08773..cfd637bec1f 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/inbox.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // hooks
-import { IntakeIcon } from "@plane/propel/icons";
+import { IntakeOutline } from "@makeplane/propel/icons";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
 import { IssueActivityBlockComponent } from "./";
@@ -41,7 +41,7 @@ export const IssueInboxActivity = observer(function IssueInboxActivity(props: TI
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<IntakeIcon className="h-4 w-4 flex-shrink-0 text-secondary" />}
+      icon={<IntakeOutline className="h-4 w-4 flex-shrink-0 text-secondary" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx
index d0584f2d0f7..862bed2375b 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/label.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { LabelPropertyIcon } from "@plane/propel/icons";
+import { LabelsOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 import { useLabel } from "@/hooks/store/use-label";
@@ -29,7 +29,7 @@ export const IssueLabelActivity = observer(function IssueLabelActivity(props: TI
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<LabelPropertyIcon height={14} width={14} className="text-secondary" />}
+      icon={<LabelsOutline height={14} width={14} className="text-secondary" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx
index 1af4cf9e51a..7b901b6a7ec 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/link.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { MessageSquare } from "lucide-react";
+import { ChatOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -25,7 +25,7 @@ export const IssueLinkActivity = observer(function IssueLinkActivity(props: TIss
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<MessageSquare size={14} className="text-secondary" aria-hidden="true" />}
+      icon={<ChatOutline width={14} height={14} className="text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx
index 8e4b53c50d7..1eb78e724a0 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/module.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // hooks
-import { ModuleIcon } from "@plane/propel/icons";
+import { ModuleOutline } from "@makeplane/propel/icons";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
 import { IssueActivityBlockComponent } from "./";
@@ -26,7 +26,7 @@ export const IssueModuleActivity = observer(function IssueModuleActivity(props:
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<ModuleIcon className="h-4 w-4 flex-shrink-0 text-secondary" />}
+      icon={<ModuleOutline className="h-4 w-4 flex-shrink-0 text-secondary" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx
index 60058c29197..86c28c1cb31 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/name.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { Type } from "lucide-react";
+import { TextOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -25,7 +25,7 @@ export const IssueNameActivity = observer(function IssueNameActivity(props: TIss
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<Type size={14} className="text-secondary" aria-hidden="true" />}
+      icon={<TextOutline width={14} height={14} className="text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx
index d1060a276ad..56a588e0b32 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/parent.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { ParentPropertyIcon } from "@plane/propel/icons";
+import { ParentOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -25,7 +25,7 @@ export const IssueParentActivity = observer(function IssueParentActivity(props:
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<ParentPropertyIcon className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />}
+      icon={<ParentOutline className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx
index 3b89a348a63..d7a69666826 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/priority.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { PriorityPropertyIcon } from "@plane/propel/icons";
+import { PriorityOutline } from "@makeplane/propel/icons";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
@@ -25,7 +25,7 @@ export const IssuePriorityActivity = observer(function IssuePriorityActivity(pro
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<PriorityPropertyIcon className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />}
+      icon={<PriorityOutline className="h-3.5 w-3.5 text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx
index c25eb6d149b..f9ad6bcea71 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/start_date.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { CalendarDays } from "lucide-react";
+import { CalendarOutline } from "@makeplane/propel/icons";
 // hooks
 import { renderFormattedDate } from "@plane/utils";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
@@ -27,7 +27,7 @@ export const IssueStartDateActivity = observer(function IssueStartDateActivity(p
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<CalendarDays size={14} className="text-secondary" aria-hidden="true" />}
+      icon={<CalendarOutline width={14} height={14} className="text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx
index c51625573cc..fe9c5e07455 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/state.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // hooks
-import { StatePropertyIcon } from "@plane/propel/icons";
+import { StateOutline } from "@makeplane/propel/icons";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 // components
 import { IssueActivityBlockComponent, IssueLink } from "./";
@@ -26,7 +26,7 @@ export const IssueStateActivity = observer(function IssueStateActivity(props: TI
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<StatePropertyIcon className="h-4 w-4 flex-shrink-0 text-secondary" />}
+      icon={<StateOutline className="h-4 w-4 flex-shrink-0 text-secondary" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx
index d38c497089d..6d3c9fc42eb 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/activity/actions/target_date.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { CalendarDays } from "lucide-react";
+import { CalendarOutline } from "@makeplane/propel/icons";
 // hooks
 import { renderFormattedDate } from "@plane/utils";
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
@@ -27,7 +27,7 @@ export const IssueTargetDateActivity = observer(function IssueTargetDateActivity
   if (!activity) return <></>;
   return (
     <IssueActivityBlockComponent
-      icon={<CalendarDays size={14} className="text-secondary" aria-hidden="true" />}
+      icon={<CalendarOutline width={14} height={14} className="text-secondary" aria-hidden="true" />}
       activityId={activityId}
       ends={ends}
     >
diff --git a/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx b/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx
index c2eca48be59..daba50e14ae 100644
--- a/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-activity/sort-root.tsx
@@ -5,7 +5,7 @@
  */
 
 import { memo } from "react";
-import { ArrowUpWideNarrow, ArrowDownWideNarrow } from "lucide-react";
+import { SortAscendingOutline, SortDescendingOutline } from "@makeplane/propel/icons";
 // plane package imports
 import { E_SORT_ORDER } from "@plane/constants";
 import { IconButton } from "@plane/propel/icon-button";
@@ -15,7 +15,7 @@ export type TActivitySortRoot = {
   toggleSort: () => void;
 };
 export const ActivitySortRoot = memo(function ActivitySortRoot(props: TActivitySortRoot) {
-  const SortIcon = props.sortOrder === E_SORT_ORDER.ASC ? ArrowUpWideNarrow : ArrowDownWideNarrow;
+  const SortIcon = props.sortOrder === E_SORT_ORDER.ASC ? SortAscendingOutline : SortDescendingOutline;
   return <IconButton variant="tertiary" icon={SortIcon} onClick={props.toggleSort} />;
 });
 
diff --git a/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx b/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx
index 8f788018260..6c9cc4aa0e3 100644
--- a/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx
+++ b/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx
@@ -8,7 +8,7 @@ import { useRef } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CopyLinkIcon } from "@plane/propel/icons";
+import { LinkOutline } from "@makeplane/propel/icons";
 import { IconButton } from "@plane/propel/icon-button";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -148,7 +148,7 @@ export const IssueDetailQuickActions = observer(function IssueDetailQuickActions
           )}
           <div className="flex flex-wrap items-center gap-2 text-tertiary">
             <Tooltip label={t("common.actions.copy_link")} disabled={isMobile}>
-              <IconButton variant="secondary" size="lg" onClick={handleCopyText} icon={CopyLinkIcon} />
+              <IconButton variant="secondary" size="lg" onClick={handleCopyText} icon={LinkOutline} />
             </Tooltip>
             <WorkItemDetailQuickActions
               parentRef={parentRef}
diff --git a/apps/web/core/components/issues/issue-detail/label/create-label.tsx b/apps/web/core/components/issues/issue-detail/label/create-label.tsx
index bb319632727..830b7bed0ad 100644
--- a/apps/web/core/components/issues/issue-detail/label/create-label.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/create-label.tsx
@@ -8,11 +8,10 @@ import { useState, Fragment, useEffect } from "react";
 import { TwitterPicker } from "react-color";
 import { Controller, useForm } from "react-hook-form";
 import { usePopper } from "react-popper";
-import { Loader } from "lucide-react";
+import { AddOutline, CloseOutline, LoadingOutline } from "@makeplane/propel/icons";
 import { Popover } from "@headlessui/react";
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
-import { PlusIcon, CloseIcon } from "@plane/propel/icons";
 import type { IIssueLabel } from "@plane/types";
 // hooks
 
@@ -88,7 +87,7 @@ export function LabelCreate(props: ILabelCreate) {
         onClick={handleIsCreateToggle}
       >
         <div className="flex-shrink-0">
-          {isCreateToggle ? <CloseIcon className="h-2.5 w-2.5" /> : <PlusIcon className="h-2.5 w-2.5" />}
+          {isCreateToggle ? <CloseOutline className="h-2.5 w-2.5" /> : <AddOutline className="h-2.5 w-2.5" />}
         </div>
         <div className="flex-shrink-0">{isCreateToggle ? "Cancel" : "New"}</div>
       </div>
@@ -159,7 +158,7 @@ export function LabelCreate(props: ILabelCreate) {
             onClick={() => setIsCreateToggle(false)}
             disabled={disabled}
           >
-            <CloseIcon className="h-3.5 w-3.5 text-on-color" />
+            <CloseOutline className="h-3.5 w-3.5 text-on-color" />
           </button>
           <button
             type="submit"
@@ -167,9 +166,9 @@ export function LabelCreate(props: ILabelCreate) {
             disabled={isSubmitting}
           >
             {isSubmitting ? (
-              <Loader className="spin h-3.5 w-3.5 text-on-color" />
+              <LoadingOutline className="spin h-3.5 w-3.5 text-on-color" />
             ) : (
-              <PlusIcon className="h-3.5 w-3.5 text-on-color" />
+              <AddOutline className="h-3.5 w-3.5 text-on-color" />
             )}
           </button>
         </form>
diff --git a/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx b/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx
index ff2f84f7d41..bb11041dc21 100644
--- a/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/label-list-item.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Button } from "@plane/propel/button";
-import { CloseIcon, LabelFilledIcon } from "@plane/propel/icons";
+import { CloseOutline, LabelsFilled } from "@makeplane/propel/icons";
 // types
 import { useLabel } from "@/hooks/store/use-label";
 import type { TLabelOperations } from "./root";
@@ -38,9 +38,9 @@ export const LabelListItem = observer(function LabelListItem(props: TLabelListIt
   if (!label) return <></>;
   return (
     <Button variant="tertiary" size="sm" key={labelId} onClick={handleLabel} disabled={disabled}>
-      <LabelFilledIcon className="size-3" color={label.color ?? "#000000"} />
+      <LabelsFilled className="size-3" color={label.color ?? "#000000"} />
       <span className="text-body-xs-regular">{label.name}</span>
-      {!disabled && <CloseIcon className="h-2.5 w-2.5 transition-all group-hover:text-danger-primary" />}
+      {!disabled && <CloseOutline className="h-2.5 w-2.5 transition-all group-hover:text-danger-primary" />}
     </Button>
   );
 });
diff --git a/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx b/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
index 9c006514610..07cfe84276c 100644
--- a/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/label/select/label-select.tsx
@@ -7,13 +7,12 @@
 import { Fragment, useState } from "react";
 import { observer } from "mobx-react";
 import { usePopper } from "react-popper";
-import { Loader } from "lucide-react";
+import { AddOutline, LoadingOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { EUserPermissionsLevel, getRandomLabelColor } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CheckIcon, SearchIcon, PlusIcon } from "@plane/propel/icons";
 import type { IIssueLabel } from "@plane/types";
 import { EUserProjectRoles } from "@plane/types";
 // helpers
@@ -132,7 +131,7 @@ export const IssueLabelSelect = observer(function IssueLabelSelect(props: IIssue
             type="button"
             variant="tertiary"
             size="sm"
-            prependIcon={<PlusIcon />}
+            prependIcon={<AddOutline />}
             onClick={() => !projectLabels && fetchLabels()}
           >
             {label}
@@ -148,7 +147,7 @@ export const IssueLabelSelect = observer(function IssueLabelSelect(props: IIssue
           >
             <div className="px-2">
               <div className="flex w-full items-center justify-start rounded-sm border border-subtle bg-surface-2 px-2">
-                <SearchIcon className="h-3.5 w-3.5 text-tertiary" />
+                <SearchOutline className="h-3.5 w-3.5 text-tertiary" />
                 <Combobox.Input
                   className="w-full bg-transparent px-2 py-1 text-11 text-secondary placeholder:text-placeholder focus:outline-none"
                   value={query}
@@ -181,7 +180,7 @@ export const IssueLabelSelect = observer(function IssueLabelSelect(props: IIssue
                           {option.content}
                           {selected && (
                             <div className="flex-shrink-0">
-                              <CheckIcon className={`h-3.5 w-3.5`} />
+                              <TickOutline className={`h-3.5 w-3.5`} />
                             </div>
                           )}
                         </>
@@ -190,7 +189,7 @@ export const IssueLabelSelect = observer(function IssueLabelSelect(props: IIssue
                   ))}
                 </ul>
               ) : submitting ? (
-                <Loader className="spin h-3.5 w-3.5" />
+                <LoadingOutline className="spin h-3.5 w-3.5" />
               ) : canCreateLabel ? (
                 <ul className="space-y-1">
                   <Combobox.Option
diff --git a/apps/web/core/components/issues/issue-detail/links/link-detail.tsx b/apps/web/core/components/issues/issue-detail/links/link-detail.tsx
index 1263fc866b3..4666eeac4d2 100644
--- a/apps/web/core/components/issues/issue-detail/links/link-detail.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/link-detail.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { NewTabIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
+import { DeleteOutline, EditOutline, NewTabOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { getIconForLink, copyTextToClipboard, calculateTimeAgo } from "@plane/utils";
@@ -84,7 +84,7 @@ export function IssueLinkDetail(props: TIssueLinkDetail) {
                   toggleIssueLinkModal(true);
                 }}
               >
-                <EditIcon className="h-3 w-3 stroke-[1.5] text-secondary" />
+                <EditOutline className="h-3 w-3 stroke-[1.5] text-secondary" />
               </button>
               <a
                 href={linkDetail.url}
@@ -92,7 +92,7 @@ export function IssueLinkDetail(props: TIssueLinkDetail) {
                 rel="noopener noreferrer"
                 className="flex items-center justify-center p-1 hover:bg-layer-1"
               >
-                <NewTabIcon className="h-3 w-3 stroke-[1.5] text-secondary" />
+                <NewTabOutline className="h-3 w-3 stroke-[1.5] text-secondary" />
               </a>
               <button
                 type="button"
@@ -103,7 +103,7 @@ export function IssueLinkDetail(props: TIssueLinkDetail) {
                   linkOperations.remove(linkDetail.id);
                 }}
               >
-                <TrashIcon className="h-3 w-3" />
+                <DeleteOutline className="h-3 w-3" />
               </button>
             </div>
           )}
diff --git a/apps/web/core/components/issues/issue-detail/links/link-item.tsx b/apps/web/core/components/issues/issue-detail/links/link-item.tsx
index 82e45db6be3..f0b9e1bf7b3 100644
--- a/apps/web/core/components/issues/issue-detail/links/link-item.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/link-item.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, CopyIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
+import { CopyOutline, DeleteOutline, EditOutline, LinkOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TIssueServiceType } from "@plane/types";
@@ -60,7 +60,7 @@ export const IssueLinkItem = observer(function IssueLinkItem(props: TIssueLinkIt
           {faviconUrl ? (
             <img src={faviconUrl} alt="favicon" className="size-4 flex-shrink-0" />
           ) : (
-            <LinkIcon className="size-4 flex-shrink-0 text-tertiary group-hover:text-primary" />
+            <LinkOutline className="size-4 flex-shrink-0 text-tertiary group-hover:text-primary" />
           )}
           <Tooltip label={linkDetail.url} layout="stacked" disabled={isMobile}>
             <a
@@ -93,7 +93,7 @@ export const IssueLinkItem = observer(function IssueLinkItem(props: TIssueLinkIt
             }}
             className="relative grid cursor-pointer place-items-center rounded-sm p-1 text-placeholder outline-none group-hover:text-secondary hover:bg-layer-1"
           >
-            <CopyIcon className="h-3.5 w-3.5 stroke-[1.5]" />
+            <CopyOutline className="h-3.5 w-3.5 stroke-[1.5]" />
           </span>
           <CustomMenu
             ellipsis
@@ -108,7 +108,7 @@ export const IssueLinkItem = observer(function IssueLinkItem(props: TIssueLinkIt
                 toggleIssueLinkModal(true);
               }}
             >
-              <EditIcon className="h-3 w-3 stroke-[1.5] text-secondary" />
+              <EditOutline className="h-3 w-3 stroke-[1.5] text-secondary" />
               {t("common.actions.edit")}
             </CustomMenu.MenuItem>
             <CustomMenu.MenuItem
@@ -117,7 +117,7 @@ export const IssueLinkItem = observer(function IssueLinkItem(props: TIssueLinkIt
                 linkOperations.remove(linkDetail.id);
               }}
             >
-              <TrashIcon className="h-3 w-3" />
+              <DeleteOutline className="h-3 w-3" />
               {t("common.actions.delete")}
             </CustomMenu.MenuItem>
           </CustomMenu>
diff --git a/apps/web/core/components/issues/issue-detail/links/root.tsx b/apps/web/core/components/issues/issue-detail/links/root.tsx
index de2153ab7dc..038353a5cad 100644
--- a/apps/web/core/components/issues/issue-detail/links/root.tsx
+++ b/apps/web/core/components/issues/issue-detail/links/root.tsx
@@ -6,7 +6,7 @@
 
 import { useCallback, useMemo, useState } from "react";
 
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 // plane imports
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TIssueLink } from "@plane/types";
@@ -132,7 +132,7 @@ export function IssueLinkRoot(props: TIssueLinkRoot) {
               onClick={() => toggleIssueLinkModal(true)}
               disabled={disabled}
             >
-              <PlusIcon className="h-4 w-4" />
+              <AddOutline className="h-4 w-4" />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/issues/issue-detail/parent-select.tsx b/apps/web/core/components/issues/issue-detail/parent-select.tsx
index 41c0a256b03..073f7c65e69 100644
--- a/apps/web/core/components/issues/issue-detail/parent-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/parent-select.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import Link from "next/link";
 
 import { useTranslation } from "@plane/i18n";
-import { EditIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, EditOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { cn } from "@plane/utils";
@@ -115,7 +115,7 @@ export const IssueParentSelect = observer(function IssueParentSelect(props: TIss
                     handleRemoveSubIssue(workspaceSlug, projectId, parentIssue.id, issueId);
                   }}
                 >
-                  <CloseIcon className="h-2.5 w-2.5 text-tertiary hover:text-danger-primary" />
+                  <CloseOutline className="h-2.5 w-2.5 text-tertiary hover:text-danger-primary" />
                 </span>
               </Tooltip>
             )}
@@ -129,7 +129,7 @@ export const IssueParentSelect = observer(function IssueParentSelect(props: TIss
               "text-placeholder": !issue.parent_id && !parentIssue,
             })}
           >
-            <EditIcon className="h-2.5 w-2.5 flex-shrink-0" />
+            <EditOutline className="h-2.5 w-2.5 flex-shrink-0" />
           </span>
         )}
       </button>
diff --git a/apps/web/core/components/issues/issue-detail/relation-select.tsx b/apps/web/core/components/issues/issue-detail/relation-select.tsx
index 6df125cab2b..da0d59b3fde 100644
--- a/apps/web/core/components/issues/issue-detail/relation-select.tsx
+++ b/apps/web/core/components/issues/issue-detail/relation-select.tsx
@@ -8,7 +8,7 @@ import React from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
 
-import { EditIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, EditOutline } from "@makeplane/propel/icons";
 // Plane
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -146,7 +146,7 @@ export const IssueRelationSelect = observer(function IssueRelationSelect(props:
                             removeRelation(workspaceSlug, projectId, issueId, relationKey, relationIssueId);
                           }}
                         >
-                          <CloseIcon className="h-2.5 w-2.5 text-tertiary hover:text-danger-primary" />
+                          <CloseOutline className="h-2.5 w-2.5 text-tertiary hover:text-danger-primary" />
                         </span>
                       </Tooltip>
                     )}
@@ -163,7 +163,7 @@ export const IssueRelationSelect = observer(function IssueRelationSelect(props:
                 "text-placeholder": relationIssueIds.length === 0,
               })}
             >
-              <EditIcon className="h-2.5 w-2.5 flex-shrink-0" />
+              <EditOutline className="h-2.5 w-2.5 flex-shrink-0" />
             </span>
           )}
         </div>
diff --git a/apps/web/core/components/issues/issue-detail/sidebar.tsx b/apps/web/core/components/issues/issue-detail/sidebar.tsx
index 8077c4ef947..8a4a3ba1219 100644
--- a/apps/web/core/components/issues/issue-detail/sidebar.tsx
+++ b/apps/web/core/components/issues/issue-detail/sidebar.tsx
@@ -9,18 +9,18 @@ import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 // ui
 import {
-  CycleIcon,
-  StatePropertyIcon,
-  ModuleIcon,
-  MembersPropertyIcon,
-  PriorityPropertyIcon,
-  StartDatePropertyIcon,
-  DueDatePropertyIcon,
-  LabelPropertyIcon,
-  UserCirclePropertyIcon,
-  EstimatePropertyIcon,
-  ParentPropertyIcon,
-} from "@plane/propel/icons";
+  CyclesOutline,
+  DueDateOutline,
+  EstimateOutline,
+  LabelsOutline,
+  MembersOutline,
+  ModuleOutline,
+  ParentOutline,
+  PriorityOutline,
+  StartDateOutline,
+  StateOutline,
+  UserOutline,
+} from "@makeplane/propel/icons";
 import { cn, getDate, renderFormattedPayloadDate, shouldHighlightIssueDueDate } from "@plane/utils";
 // components
 import { DateDropdown } from "@/components/dropdowns/date";
@@ -83,7 +83,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
         <div className="h-full w-full overflow-y-auto px-6">
           <h5 className="mt-5 text-body-xs-medium">{t("common.properties")}</h5>
           <div className={`mt-4 mb-2 space-y-2.5 truncate ${!isEditable ? "opacity-60" : ""}`}>
-            <SidebarPropertyListItem icon={StatePropertyIcon} label={t("common.state")}>
+            <SidebarPropertyListItem icon={StateOutline} label={t("common.state")}>
               <StateDropdown
                 value={issue?.state_id}
                 onChange={(val) => issueOperations.update(workspaceSlug, projectId, issueId, { state_id: val })}
@@ -98,7 +98,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
               />
             </SidebarPropertyListItem>
 
-            <SidebarPropertyListItem icon={MembersPropertyIcon} label={t("common.assignees")}>
+            <SidebarPropertyListItem icon={MembersOutline} label={t("common.assignees")}>
               <MemberDropdown
                 value={issue?.assignee_ids ?? undefined}
                 onChange={(val) => issueOperations.update(workspaceSlug, projectId, issueId, { assignee_ids: val })}
@@ -116,7 +116,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
               />
             </SidebarPropertyListItem>
 
-            <SidebarPropertyListItem icon={PriorityPropertyIcon} label={t("common.priority")}>
+            <SidebarPropertyListItem icon={PriorityOutline} label={t("common.priority")}>
               <PriorityDropdown
                 value={issue?.priority}
                 onChange={(val) => issueOperations.update(workspaceSlug, projectId, issueId, { priority: val })}
@@ -129,7 +129,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
             </SidebarPropertyListItem>
 
             {createdByDetails && (
-              <SidebarPropertyListItem icon={UserCirclePropertyIcon} label={t("common.created_by")}>
+              <SidebarPropertyListItem icon={UserOutline} label={t("common.created_by")}>
                 <div className="flex gap-2 px-2">
                   <ButtonAvatars showTooltip userIds={createdByDetails.id} />
                   <span className="grow truncate text-body-xs-regular leading-5">{createdByDetails?.display_name}</span>
@@ -137,7 +137,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
               </SidebarPropertyListItem>
             )}
 
-            <SidebarPropertyListItem icon={StartDatePropertyIcon} label={t("common.order_by.start_date")}>
+            <SidebarPropertyListItem icon={StartDateOutline} label={t("common.order_by.start_date")}>
               <DateDropdown
                 placeholder={t("issue.add.start_date")}
                 value={issue.start_date}
@@ -157,7 +157,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
               />
             </SidebarPropertyListItem>
 
-            <SidebarPropertyListItem icon={DueDatePropertyIcon} label={t("common.order_by.due_date")}>
+            <SidebarPropertyListItem icon={DueDateOutline} label={t("common.order_by.due_date")}>
               <div className="flex w-full items-center gap-2">
                 <DateDropdown
                   placeholder={t("issue.add.due_date")}
@@ -183,7 +183,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
             </SidebarPropertyListItem>
 
             {projectId && areEstimateEnabledByProjectId(projectId) && (
-              <SidebarPropertyListItem icon={EstimatePropertyIcon} label={t("common.estimate")}>
+              <SidebarPropertyListItem icon={EstimateOutline} label={t("common.estimate")}>
                 <EstimateDropdown
                   value={issue?.estimate_point ?? undefined}
                   onChange={(val: string | undefined) =>
@@ -204,7 +204,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
             )}
 
             {projectDetails?.module_view && (
-              <SidebarPropertyListItem icon={ModuleIcon} label={t("common.modules")}>
+              <SidebarPropertyListItem icon={ModuleOutline} label={t("common.modules")}>
                 <IssueModuleSelect
                   className="w-full grow"
                   workspaceSlug={workspaceSlug}
@@ -217,7 +217,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
             )}
 
             {projectDetails?.cycle_view && (
-              <SidebarPropertyListItem icon={CycleIcon} label={t("common.cycle")} appendElement={null}>
+              <SidebarPropertyListItem icon={CyclesOutline} label={t("common.cycle")} appendElement={null}>
                 <IssueCycleSelect
                   className="h-7.5 w-full grow"
                   workspaceSlug={workspaceSlug}
@@ -229,7 +229,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
               </SidebarPropertyListItem>
             )}
 
-            <SidebarPropertyListItem icon={ParentPropertyIcon} label={t("common.parent")}>
+            <SidebarPropertyListItem icon={ParentOutline} label={t("common.parent")}>
               <IssueParentSelectRoot
                 className="h-7.5 w-full grow"
                 workspaceSlug={workspaceSlug}
@@ -240,7 +240,7 @@ export const IssueDetailsSidebar = observer(function IssueDetailsSidebar(props:
               />
             </SidebarPropertyListItem>
 
-            <SidebarPropertyListItem icon={LabelPropertyIcon} label={t("common.labels")}>
+            <SidebarPropertyListItem icon={LabelsOutline} label={t("common.labels")}>
               <IssueLabel
                 workspaceSlug={workspaceSlug}
                 projectId={projectId}
diff --git a/apps/web/core/components/issues/issue-detail/subscription.tsx b/apps/web/core/components/issues/issue-detail/subscription.tsx
index d9573d63c62..6b59dce9d88 100644
--- a/apps/web/core/components/issues/issue-detail/subscription.tsx
+++ b/apps/web/core/components/issues/issue-detail/subscription.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { isNil } from "lodash-es";
 import { observer } from "mobx-react";
-import { Bell, BellOff } from "lucide-react";
+import { SubscribeOutline, UnsubscribeOutline } from "@makeplane/propel/icons";
 // plane-i18n
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -82,7 +82,7 @@ export const IssueSubscription = observer(function IssueSubscription(props: TIss
   return (
     <div>
       <Button
-        prependIcon={isSubscribed ? <BellOff /> : <Bell className="h-3 w-3" />}
+        prependIcon={isSubscribed ? <UnsubscribeOutline /> : <SubscribeOutline className="h-3 w-3" />}
         variant="secondary"
         className="hover:!bg-accent-primary/20"
         onClick={handleSubscription}
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx
index 199a54881cb..d68a3f460ff 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/months-dropdown.tsx
@@ -8,7 +8,7 @@ import React, { useState } from "react";
 import { observer } from "mobx-react";
 import { usePopper } from "react-popper";
 import { Popover, Transition } from "@headlessui/react";
-import { ChevronLeftIcon, ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronLeftOutline, ChevronRightOutline } from "@makeplane/propel/icons";
 //hooks
 // icons
 // constants
@@ -118,7 +118,7 @@ export const CalendarMonthsDropdown = observer(function CalendarMonthsDropdown(p
                   handleDateChange(previousYear);
                 }}
               >
-                <ChevronLeftIcon height={14} width={14} />
+                <ChevronLeftOutline height={14} width={14} />
               </button>
               <span className="text-11">{activeMonthDate.getFullYear()}</span>
               <button
@@ -129,7 +129,7 @@ export const CalendarMonthsDropdown = observer(function CalendarMonthsDropdown(p
                   handleDateChange(nextYear);
                 }}
               >
-                <ChevronRightIcon height={14} width={14} />
+                <ChevronRightOutline height={14} width={14} />
               </button>
             </div>
             <div className="grid grid-cols-4 items-stretch justify-items-stretch gap-4 pt-3">
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx
index 758f4f01b42..5c730330ae7 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/dropdowns/options-dropdown.tsx
@@ -8,7 +8,7 @@ import React, { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { usePopper } from "react-popper";
-import { MoreVerticalIcon } from "lucide-react";
+import { ChevronUpOutline, MoreVerticalOutline, TickOutline } from "@makeplane/propel/icons";
 import { Popover, Transition } from "@headlessui/react";
 // hooks
 // ui
@@ -16,7 +16,6 @@ import { Popover, Transition } from "@headlessui/react";
 import type { TSupportedFilterTypeForUpdate } from "@plane/constants";
 import { EIssueFilterType } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, ChevronUpIcon } from "@plane/propel/icons";
 import type { TCalendarLayouts, TSupportedFilterForUpdate } from "@plane/types";
 import { Switch } from "@makeplane/propel/components/switch";
 // types
@@ -112,11 +111,11 @@ export const CalendarOptionsDropdown = observer(function CalendarOptionsDropdown
                 <div
                   className={`flex h-3.5 w-3.5 items-center justify-center transition-all ${open ? "" : "rotate-180"}`}
                 >
-                  <ChevronUpIcon width={12} strokeWidth={2} />
+                  <ChevronUpOutline width={12} />
                 </div>
               </div>
               <div className="md:hidden">
-                <MoreVerticalIcon className="h-4 text-secondary" strokeWidth={2} />
+                <MoreVerticalOutline className="h-4 text-secondary" />
               </div>
             </button>
           </Popover.Button>
@@ -145,7 +144,7 @@ export const CalendarOptionsDropdown = observer(function CalendarOptionsDropdown
                       onClick={() => handleLayoutChange(layoutDetails.key, closePopover)}
                     >
                       {layoutDetails.title}
-                      {calendarLayout === layout && <CheckIcon width={12} height={12} strokeWidth={2} />}
+                      {calendarLayout === layout && <TickOutline width={12} height={12} />}
                     </button>
                   ))}
                   <button
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/header.tsx b/apps/web/core/components/issues/issue-layouts/calendar/header.tsx
index a16d80a15dc..58ea8bab8e9 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/header.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/header.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 // components
 import type { TSupportedFilterTypeForUpdate } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ChevronLeftIcon, ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronLeftOutline, ChevronRightOutline } from "@makeplane/propel/icons";
 import type { TSupportedFilterForUpdate } from "@plane/types";
 import { Row } from "@plane/ui";
 // icons
@@ -104,10 +104,10 @@ export const CalendarHeader = observer(function CalendarHeader(props: ICalendarH
     <Row className="mb-4 flex items-center justify-between gap-2">
       <div className="flex items-center gap-1.5">
         <button type="button" className="grid place-items-center" onClick={handlePrevious}>
-          <ChevronLeftIcon height={16} width={16} strokeWidth={2} />
+          <ChevronLeftOutline height={16} width={16} />
         </button>
         <button type="button" className="grid place-items-center" onClick={handleNext}>
-          <ChevronRightIcon height={16} width={16} strokeWidth={2} />
+          <ChevronRightOutline height={16} width={16} />
         </button>
         <CalendarMonthsDropdown issuesFilterStore={issuesFilterStore} />
       </div>
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx b/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx
index f8666fdb381..8a7afcda824 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/issue-block.tsx
@@ -7,7 +7,7 @@
 import { useState, useRef, forwardRef } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { MoreHorizontal } from "lucide-react";
+import { MoreHorizontalOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useOutsideClickDetector } from "@plane/hooks";
 import { Popover } from "@plane/propel/popover";
@@ -74,7 +74,7 @@ export const CalendarIssueBlock = observer(
         }`}
         onClick={() => setIsMenuActive(!isMenuActive)}
       >
-        <MoreHorizontal className="h-3.5 w-3.5" />
+        <MoreHorizontalOutline className="h-3.5 w-3.5" />
       </div>
     );
 
diff --git a/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx b/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx
index a5b3a4c8a6f..20b4eecccbc 100644
--- a/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx
+++ b/apps/web/core/components/issues/issue-layouts/calendar/quick-add-issue-actions.tsx
@@ -11,7 +11,7 @@ import { useParams } from "next/navigation";
 
 import { useTranslation } from "@plane/i18n";
 // plane imports
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import { setPromiseToast } from "@plane/propel/toast";
 import type { ISearchIssueResponse, TIssue } from "@plane/types";
 import { EIssueLayoutTypes } from "@plane/types";
@@ -125,7 +125,7 @@ export const CalendarQuickAddIssueActions = observer(function CalendarQuickAddIs
               customButtonClassName="w-full"
               customButton={
                 <div className="flex w-full items-center gap-x-[6px] rounded-md px-2 py-1.5 text-tertiary hover:text-tertiary">
-                  <PlusIcon className="h-3.5 w-3.5 flex-shrink-0 stroke-2" />
+                  <AddOutline className="h-3.5 w-3.5 flex-shrink-0" />
                   <span className="flex-shrink-0 text-13 font-medium">
                     {isEpic ? t("epic.add.label") : t("issue.add.label")}
                   </span>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx
index 37b467aa446..5ee18b05488 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/cycle.tsx
@@ -5,7 +5,8 @@
  */
 
 import { observer } from "mobx-react";
-import { CloseIcon, CycleGroupIcon } from "@plane/propel/icons";
+import { CycleGroupIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TCycleGroups } from "@plane/types";
 // hooks
 import { useCycle } from "@/hooks/store/use-cycle";
@@ -42,7 +43,7 @@ export const AppliedCycleFilters = observer(function AppliedCycleFilters(props:
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(cycleId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx
index 89bec65783b..e8cad0eb32e 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/date.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // icons
 import { DATE_AFTER_FILTER_OPTIONS } from "@plane/constants";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // helpers
 import { renderFormattedDate, capitalizeFirstLetter } from "@plane/utils";
 // constants
@@ -49,7 +49,7 @@ export const AppliedDateFilters = observer(function AppliedDateFilters(props: Pr
             className="grid place-items-center text-tertiary hover:text-secondary"
             onClick={() => handleRemove(date)}
           >
-            <CloseIcon height={10} width={10} strokeWidth={2} />
+            <CloseOutline height={10} width={10} />
           </button>
         </div>
       ))}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx
index 34dcb6114fc..bd11e47e5d6 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/label.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 // icons
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { IIssueLabel } from "@plane/types";
 // types
 
@@ -43,7 +43,7 @@ export const AppliedLabelsFilters = observer(function AppliedLabelsFilters(props
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(labelId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx
index 411c28e75a5..73a53ca670e 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/members.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Avatar } from "@makeplane/propel/components/avatar";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // helpers
 import { getFileURL } from "@plane/utils";
 // hooks
@@ -47,7 +47,7 @@ export const AppliedMembersFilters = observer(function AppliedMembersFilters(pro
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(memberId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx
index 2264ee6fdbb..e142846a26c 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/module.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // hooks
-import { CloseIcon, ModuleIcon } from "@plane/propel/icons";
+import { CloseOutline, ModuleOutline } from "@makeplane/propel/icons";
 import { useModule } from "@/hooks/store/use-module";
 // ui
 
@@ -30,7 +30,7 @@ export const AppliedModuleFilters = observer(function AppliedModuleFilters(props
 
         return (
           <div key={moduleId} className="flex items-center gap-1 truncate rounded-sm bg-layer-1 p-1 text-11">
-            <ModuleIcon className="h-3 w-3 flex-shrink-0" />
+            <ModuleOutline className="h-3 w-3 flex-shrink-0" />
             <span className="truncate normal-case">{moduleDetails.name}</span>
             {editable && (
               <button
@@ -38,7 +38,7 @@ export const AppliedModuleFilters = observer(function AppliedModuleFilters(props
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(moduleId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx
index db4ae8ddf0c..7f9f11306ba 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/priority.tsx
@@ -7,7 +7,8 @@
 import { observer } from "mobx-react";
 
 // icons
-import { CloseIcon, PriorityIcon } from "@plane/propel/icons";
+import { PriorityIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TIssuePriorities } from "@plane/types";
 // types
 
@@ -32,7 +33,7 @@ export const AppliedPriorityFilters = observer(function AppliedPriorityFilters(p
               className="grid place-items-center text-tertiary hover:text-secondary"
               onClick={() => handleRemove(priority)}
             >
-              <CloseIcon height={10} width={10} strokeWidth={2} />
+              <CloseOutline height={10} width={10} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx
index 7e71273869a..0baaccd76f3 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/project.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // hooks
 import { useProject } from "@/hooks/store/use-project";
 
@@ -40,7 +40,7 @@ export const AppliedProjectFilters = observer(function AppliedProjectFilters(pro
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(projectId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
index f3ec236d9a4..9abdf66cb44 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state-group.tsx
@@ -8,7 +8,8 @@ import { observer } from "mobx-react";
 
 // icons
 import { EIconSize } from "@plane/constants";
-import { CloseIcon, StateGroupIcon } from "@plane/propel/icons";
+import { StateGroupIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TStateGroups } from "@plane/types";
 
 type Props = {
@@ -30,7 +31,7 @@ export const AppliedStateGroupFilters = observer(function AppliedStateGroupFilte
             className="grid place-items-center text-tertiary hover:text-secondary"
             onClick={() => handleRemove(stateGroup)}
           >
-            <CloseIcon height={10} width={10} strokeWidth={2} />
+            <CloseOutline height={10} width={10} />
           </button>
         </div>
       ))}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx
index 47be1809658..5b04e9b6e8b 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/applied-filters/state.tsx
@@ -8,7 +8,8 @@ import { observer } from "mobx-react";
 // icons
 // plane imports
 import { EIconSize } from "@plane/constants";
-import { CloseIcon, StateGroupIcon } from "@plane/propel/icons";
+import { StateGroupIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { IState } from "@plane/types";
 
 type Props = {
@@ -43,7 +44,7 @@ export const AppliedStateFilters = observer(function AppliedStateFilters(props:
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(stateId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx
index 695dab108c9..2757c507822 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/filters/module.tsx
@@ -9,7 +9,7 @@ import { sortBy } from "lodash-es";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // components
-import { ModuleIcon } from "@plane/propel/icons";
+import { ModuleOutline } from "@makeplane/propel/icons";
 import { Loader } from "@plane/ui";
 import { FilterHeader, FilterOption } from "@/components/issues/issue-layouts/filters";
 import { useModule } from "@/hooks/store/use-module";
@@ -70,7 +70,7 @@ export const FilterModule = observer(function FilterModule(props: Props) {
                     key={cycle.id}
                     isChecked={appliedFilters?.includes(cycle.id) ? true : false}
                     onClick={() => handleUpdate(cycle.id)}
-                    icon={<ModuleIcon className="h-3 w-3 flex-shrink-0" />}
+                    icon={<ModuleOutline className="h-3 w-3 flex-shrink-0" />}
                     title={cycle.name}
                   />
                 ))}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx
index e6e2b80af00..986407fa050 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-header.tsx
@@ -5,7 +5,7 @@
  */
 
 // plane imports
-import { ChevronDownIcon, ChevronUpIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, ChevronUpOutline } from "@makeplane/propel/icons";
 
 type Props = {
   title: string;
@@ -22,7 +22,7 @@ export function FilterHeader({ title, isPreviewEnabled, handleIsPreviewEnabled }
         className="grid h-5 w-5 flex-shrink-0 place-items-center rounded-sm hover:bg-layer-transparent-hover"
         onClick={handleIsPreviewEnabled}
       >
-        {isPreviewEnabled ? <ChevronUpIcon height={14} width={14} /> : <ChevronDownIcon height={14} width={14} />}
+        {isPreviewEnabled ? <ChevronUpOutline height={14} width={14} /> : <ChevronDownOutline height={14} width={14} />}
       </button>
     </div>
   );
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx
index af27943edfd..ace90e5e1dc 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/helpers/filter-option.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 
 type Props = {
   icon?: React.ReactNode;
@@ -29,7 +29,7 @@ export function FilterOption(props: Props) {
           isChecked ? "border-accent-strong bg-accent-primary text-on-color" : "border-strong"
         } ${multiple ? "rounded-xs" : "rounded-full"}`}
       >
-        {isChecked && <CheckIcon width={10} height={10} strokeWidth={3} />}
+        {isChecked && <TickOutline width={10} height={10} />}
       </div>
       <div className="flex items-center gap-2 truncate">
         {icon && <div className="grid w-5 flex-shrink-0 place-items-center">{icon}</div>}
diff --git a/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx b/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx
index 14f74909465..f4b1d338f5e 100644
--- a/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx
+++ b/apps/web/core/components/issues/issue-layouts/filters/header/mobile-layout-selection.tsx
@@ -7,7 +7,7 @@
 import { ISSUE_LAYOUTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import type { EIssueLayoutTypes } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 import { IssueLayoutIcon } from "../../layout-icon";
@@ -33,7 +33,7 @@ export function MobileLayoutSelection({
           {activeLayout && (
             <IssueLayoutIcon layout={activeLayout} size={14} strokeWidth={2} className={`h-3.5 w-3.5`} />
           )}
-          <ChevronDownIcon className="my-auto size-3 text-secondary" strokeWidth={2} />
+          <ChevronDownOutline className="my-auto size-3 text-secondary" />
         </Button>
       }
       customButtonClassName="flex flex-grow justify-center text-secondary text-13"
diff --git a/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx b/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx
index 8da61601b84..502deca7ac8 100644
--- a/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx
+++ b/apps/web/core/components/issues/issue-layouts/group-drag-overlay.tsx
@@ -5,7 +5,7 @@
  */
 
 import { useRef } from "react";
-import { AlertCircle } from "lucide-react";
+import { WarningCircleOutline } from "@makeplane/propel/icons";
 // plane imports
 import { ISSUE_ORDER_BY_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -66,7 +66,7 @@ export function GroupDragOverlay(props: Props) {
         >
           {dropErrorMessage ? (
             <div className="flex items-center">
-              <AlertCircle width={13} height={13} /> &nbsp;
+              <WarningCircleOutline width={13} height={13} /> &nbsp;
               <span>{dropErrorMessage}</span>
             </div>
           ) : (
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/block.tsx b/apps/web/core/components/issues/issue-layouts/kanban/block.tsx
index 046879b6747..e64e356c703 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/block.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/block.tsx
@@ -11,7 +11,7 @@ import { draggable, dropTargetForElements } from "@atlaskit/pragmatic-drag-and-d
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane helpers
-import { MoreHorizontal } from "lucide-react";
+import { MoreHorizontalOutline } from "@makeplane/propel/icons";
 import { useOutsideClickDetector } from "@plane/hooks";
 // types
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
@@ -80,7 +80,7 @@ const KanbanIssueDetailsBlock = observer(function KanbanIssueDetailsBlock(props:
       }`}
       onClick={() => setIsMenuActive(!isMenuActive)}
     >
-      <MoreHorizontal className="h-3.5 w-3.5" />
+      <MoreHorizontalOutline className="h-3.5 w-3.5" />
     </div>
   );
 
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx b/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
index 044ba461405..c3ce5841a87 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/headers/group-by-card.tsx
@@ -8,8 +8,8 @@ import React from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // lucide icons
-import { Minimize2, Maximize2, Circle } from "lucide-react";
-import { PlusIcon } from "@plane/propel/icons";
+import { Circle } from "lucide-react";
+import { AddOutline, ArrowCollapseOutline, FullScreenOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TIssue, ISearchIssueResponse, TIssueKanbanFilters, TIssueGroupByOptions } from "@plane/types";
 // ui
@@ -140,11 +140,7 @@ export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHea
             className="flex h-[20px] w-[20px] flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden rounded-sm bg-layer-transparent transition-all hover:bg-layer-transparent-hover"
             onClick={() => handleCollapsedGroups("group_by", column_id)}
           >
-            {verticalAlignPosition ? (
-              <Maximize2 width={14} strokeWidth={2} />
-            ) : (
-              <Minimize2 width={14} strokeWidth={2} />
-            )}
+            {verticalAlignPosition ? <FullScreenOutline width={14} /> : <ArrowCollapseOutline width={14} />}
           </button>
         )}
 
@@ -153,7 +149,7 @@ export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHea
             <CustomMenu
               customButton={
                 <span className="flex h-[20px] w-[20px] flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden rounded-sm bg-layer-transparent transition-all hover:bg-layer-transparent-hover">
-                  <PlusIcon height={14} width={14} strokeWidth={2} />
+                  <AddOutline height={14} width={14} />
                 </span>
               }
               placement="bottom-end"
@@ -180,7 +176,7 @@ export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHea
                 setIsOpen(true);
               }}
             >
-              <PlusIcon width={14} strokeWidth={2} />
+              <AddOutline width={14} />
             </button>
           ))}
       </div>
diff --git a/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx b/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
index 960b7574b0a..fdfcc2b6d14 100644
--- a/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
+++ b/apps/web/core/components/issues/issue-layouts/kanban/headers/sub-group-by-card.tsx
@@ -7,7 +7,7 @@
 import React from "react";
 import { observer } from "mobx-react";
 import { Circle } from "lucide-react";
-import { ChevronDownIcon, ChevronUpIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, ChevronUpOutline } from "@makeplane/propel/icons";
 // Plane
 import type { TIssueGroupByOptions, TIssueKanbanFilters } from "@plane/types";
 
@@ -31,9 +31,9 @@ export const HeaderSubGroupByCard = observer(function HeaderSubGroupByCard(props
     >
       <div className="flex h-[20px] w-[20px] flex-shrink-0 items-center justify-center overflow-hidden rounded-xs transition-all hover:bg-layer-1">
         {collapsedGroups?.sub_group_by.includes(column_id) ? (
-          <ChevronDownIcon width={14} strokeWidth={2} />
+          <ChevronDownOutline width={14} />
         ) : (
-          <ChevronUpIcon width={14} strokeWidth={2} />
+          <ChevronUpOutline width={14} />
         )}
       </div>
 
diff --git a/apps/web/core/components/issues/issue-layouts/layout-icon.tsx b/apps/web/core/components/issues/issue-layouts/layout-icon.tsx
index 5b06251f627..04a90895509 100644
--- a/apps/web/core/components/issues/issue-layouts/layout-icon.tsx
+++ b/apps/web/core/components/issues/issue-layouts/layout-icon.tsx
@@ -4,13 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import {
-  ListLayoutIcon,
-  BoardLayoutIcon,
-  CalendarLayoutIcon,
-  SheetLayoutIcon,
-  TimelineLayoutIcon,
-} from "@plane/propel/icons";
+import { BoardOutline, CalendarOutline, ListOutline, TableOutline, TimelineOutline } from "@makeplane/propel/icons";
 import type { ISvgIcons } from "@plane/propel/icons";
 import { EIssueLayoutTypes } from "@plane/types";
 
@@ -26,15 +20,15 @@ export function IssueLayoutIcon({
 
   switch (layout) {
     case EIssueLayoutTypes.LIST:
-      return <ListLayoutIcon {...iconProps} />;
+      return <ListOutline {...iconProps} />;
     case EIssueLayoutTypes.KANBAN:
-      return <BoardLayoutIcon {...iconProps} />;
+      return <BoardOutline {...iconProps} />;
     case EIssueLayoutTypes.CALENDAR:
-      return <CalendarLayoutIcon {...iconProps} />;
+      return <CalendarOutline {...iconProps} />;
     case EIssueLayoutTypes.SPREADSHEET:
-      return <SheetLayoutIcon {...iconProps} />;
+      return <TableOutline {...iconProps} />;
     case EIssueLayoutTypes.GANTT:
-      return <TimelineLayoutIcon {...iconProps} />;
+      return <TimelineOutline {...iconProps} />;
     default:
       return null;
   }
diff --git a/apps/web/core/components/issues/issue-layouts/list/block.tsx b/apps/web/core/components/issues/issue-layouts/list/block.tsx
index aea5a059730..976d6d41c1d 100644
--- a/apps/web/core/components/issues/issue-layouts/list/block.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/block.tsx
@@ -10,7 +10,7 @@ import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine";
 import { draggable } from "@atlaskit/pragmatic-drag-and-drop/element/adapter";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline } from "@makeplane/propel/icons";
 // types
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -250,11 +250,10 @@ export const IssueBlock = observer(function IssueBlock(props: IssueBlockProps) {
                     className="grid size-4 place-items-center rounded-xs text-placeholder hover:text-tertiary"
                     onClick={handleToggleExpand}
                   >
-                    <ChevronRightIcon
+                    <ChevronRightOutline
                       className={cn("size-4", {
                         "rotate-90": isExpanded,
                       })}
-                      strokeWidth={2.5}
                     />
                   </button>
                 )}
diff --git a/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx b/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
index 43614f859c4..2e004431b23 100644
--- a/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
+++ b/apps/web/core/components/issues/issue-layouts/list/headers/group-by-card.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { CircleDashed } from "lucide-react";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 // types
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TIssue, ISearchIssueResponse, TIssueGroupByOptions } from "@plane/types";
@@ -125,7 +125,7 @@ export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHea
             <CustomMenu
               customButton={
                 <span className="flex h-5 w-5 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden rounded-xs transition-all hover:bg-layer-1">
-                  <PlusIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                  <AddOutline className="h-3.5 w-3.5" />
                 </span>
               }
             >
@@ -152,7 +152,7 @@ export const HeaderGroupByCard = observer(function HeaderGroupByCard(props: IHea
                 setIsOpen(true);
               }}
             >
-              <PlusIcon width={14} strokeWidth={2} />
+              <AddOutline width={14} />
             </div>
           ))}
 
diff --git a/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx b/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx
index 8e5222bb6b6..6ce4eb1d39a 100644
--- a/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx
+++ b/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx
@@ -10,10 +10,9 @@ import { xor } from "lodash-es";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { Paperclip } from "lucide-react";
+import { AttachOutline, DueDateOutline, LinkOutline, StartDateOutline, ViewsOutline } from "@makeplane/propel/icons";
 // i18n
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, StartDatePropertyIcon, ViewsIcon, DueDatePropertyIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TIssue, IIssueDisplayProperties, TIssuePriorities } from "@plane/types";
 // ui
@@ -278,7 +277,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
             onChange={handleStartDate}
             maxDate={maxDate}
             placeholder={t("common.order_by.start_date")}
-            icon={<StartDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+            icon={<StartDateOutline className="h-3 w-3 flex-shrink-0" />}
             buttonVariant={issue.start_date ? "border-with-text" : "border-without-text"}
             optionsClassName="z-10"
             disabled={isReadOnly}
@@ -302,7 +301,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
             onChange={handleTargetDate}
             minDate={minDate}
             placeholder={t("common.order_by.due_date")}
-            icon={<DueDatePropertyIcon className="h-3 w-3 shrink-0" />}
+            icon={<DueDateOutline className="h-3 w-3 shrink-0" />}
             buttonVariant={issue.target_date ? "border-with-text" : "border-without-text"}
             buttonClassName={
               shouldHighlightIssueDueDate(issue.target_date, stateDetails?.group) ? "text-danger-primary" : ""
@@ -426,7 +425,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
                 }
               )}
             >
-              <ViewsIcon className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
+              <ViewsOutline className="h-3 w-3 flex-shrink-0" />
               <div className="text-caption-sm-regular">{subIssueCount}</div>
             </div>
           </Tooltip>
@@ -446,7 +445,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
             onFocus={handleEventPropagation}
             onClick={handleEventPropagation}
           >
-            <Paperclip className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
+            <AttachOutline className="h-3 w-3 flex-shrink-0" />
             <div className="text-caption-sm-regular">{issue.attachment_count}</div>
           </div>
         </Tooltip>
@@ -465,7 +464,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
             onFocus={handleEventPropagation}
             onClick={handleEventPropagation}
           >
-            <LinkIcon className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
+            <LinkOutline className="h-3 w-3 flex-shrink-0" />
             <div className="text-caption-sm-regular">{issue.link_count}</div>
           </div>
         </Tooltip>
diff --git a/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx b/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx
index a6f73512848..98b018ff9a8 100644
--- a/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx
+++ b/apps/web/core/components/issues/issue-layouts/properties/label-dropdown.tsx
@@ -8,13 +8,12 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import type { Placement } from "@popperjs/core";
 import { useParams } from "next/navigation";
 import { usePopper } from "react-popper";
-import { Loader } from "lucide-react";
+import { ChevronDownOutline, LoadingOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import { Combobox } from "@headlessui/react";
 // plane imports
 import { EUserPermissionsLevel, getRandomLabelColor } from "@plane/constants";
 import { useOutsideClickDetector } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, SearchIcon, ChevronDownIcon } from "@plane/propel/icons";
 // types
 import type { IIssueLabel } from "@plane/types";
 import { EUserProjectRoles } from "@plane/types";
@@ -216,7 +215,7 @@ export function LabelDropdown(props: ILabelDropdownProps) {
         disabled={disabled}
       >
         {label}
-        {!hideDropdownArrow && !disabled && <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />}
+        {!hideDropdownArrow && !disabled && <ChevronDownOutline className="h-3 w-3" aria-hidden="true" />}
       </button>
     ),
     [
@@ -260,7 +259,7 @@ export function LabelDropdown(props: ILabelDropdownProps) {
               {...attributes.popper}
             >
               <div className="flex w-full items-center justify-start rounded-sm border border-subtle bg-surface-2 px-2">
-                <SearchIcon className="h-3.5 w-3.5 text-tertiary" />
+                <SearchOutline className="h-3.5 w-3.5 text-tertiary" />
                 <Combobox.Input
                   ref={inputRef}
                   className="w-full bg-transparent px-2 py-1 text-caption-sm-regular text-secondary placeholder:text-placeholder focus:outline-none"
@@ -298,7 +297,7 @@ export function LabelDropdown(props: ILabelDropdownProps) {
                             {option.content}
                             {selected && (
                               <div className="flex-shrink-0">
-                                <CheckIcon className={`h-3.5 w-3.5`} />
+                                <TickOutline className={`h-3.5 w-3.5`} />
                               </div>
                             )}
                           </>
@@ -307,7 +306,7 @@ export function LabelDropdown(props: ILabelDropdownProps) {
                     ))}
                   </ul>
                 ) : submitting ? (
-                  <Loader className="h-3.5 w-3.5 animate-spin" />
+                  <LoadingOutline className="h-3.5 w-3.5 animate-spin" />
                 ) : canCreateLabel ? (
                   <p
                     onClick={() => {
diff --git a/apps/web/core/components/issues/issue-layouts/properties/labels.tsx b/apps/web/core/components/issues/issue-layouts/properties/labels.tsx
index 91ad08b057b..97949fb2a3c 100644
--- a/apps/web/core/components/issues/issue-layouts/properties/labels.tsx
+++ b/apps/web/core/components/issues/issue-layouts/properties/labels.tsx
@@ -11,7 +11,7 @@ import { observer } from "mobx-react";
 import { useOutsideClickDetector } from "@plane/hooks";
 // i18n
 import { useTranslation } from "@plane/i18n";
-import { LabelPropertyIcon } from "@plane/propel/icons";
+import { LabelsOutline } from "@makeplane/propel/icons";
 // types
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IIssueLabel } from "@plane/types";
@@ -61,7 +61,7 @@ const NoLabel = observer(function NoLabel({ isMobile, noLabelBorder, fullWidth,
           fullWidth && "w-full"
         )}
       >
-        <LabelPropertyIcon className="h-3.5 w-3.5" />
+        <LabelsOutline className="h-3.5 w-3.5" />
         {placeholderText}
       </div>
     </Tooltip>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/helper.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/helper.tsx
index 121074d0af8..0e15c8aa5a1 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/helper.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/helper.tsx
@@ -5,10 +5,18 @@
  */
 
 import { useMemo } from "react";
-import { XCircle, ArchiveRestoreIcon } from "lucide-react";
+import {
+  ArchiveOutline,
+  CloseCircleOutline,
+  CopyOutline,
+  DeleteOutline,
+  EditOutline,
+  LinkOutline,
+  NewTabOutline,
+  RestoreOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, CopyIcon, NewTabIcon, EditIcon, ArchiveIcon, TrashIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { EIssuesStoreType, TIssue } from "@plane/types";
 import type { TContextMenuItem } from "@plane/ui";
@@ -161,7 +169,7 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
   const createEditMenuItem = (customEditAction?: () => void): TContextMenuItem => ({
     key: "edit",
     title: t("common.actions.edit"),
-    icon: EditIcon,
+    icon: EditOutline,
     action:
       customEditAction ||
       (() => {
@@ -175,7 +183,7 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
     const baseItem = {
       key: "make-a-copy",
       title: t("common.actions.make_a_copy"),
-      icon: CopyIcon,
+      icon: CopyOutline,
       action: () => {
         setCreateUpdateIssueModal(true);
       },
@@ -194,21 +202,21 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
   const createOpenInNewTabMenuItem = (): TContextMenuItem => ({
     key: "open-in-new-tab",
     title: t("common.actions.open_in_new_tab"),
-    icon: NewTabIcon,
+    icon: NewTabOutline,
     action: actionHandlers.handleOpenInNewTab,
   });
 
   const createCopyLinkMenuItem = (): TContextMenuItem => ({
     key: "copy-link",
     title: t("common.actions.copy_link"),
-    icon: LinkIcon,
+    icon: LinkOutline,
     action: actionHandlers.handleCopyIssueLink,
   });
 
   const createRemoveFromCycleMenuItem = (): TContextMenuItem => ({
     key: "remove-from-cycle",
     title: "Remove from cycle",
-    icon: XCircle,
+    icon: CloseCircleOutline,
     action: () => handleOptionalAction(handleRemoveFromView, "Remove from cycle"),
     shouldRender: isEditingAllowed,
   });
@@ -216,7 +224,7 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
   const createRemoveFromModuleMenuItem = (): TContextMenuItem => ({
     key: "remove-from-module",
     title: "Remove from module",
-    icon: XCircle,
+    icon: CloseCircleOutline,
     action: () => handleOptionalAction(handleRemoveFromView, "Remove from module"),
     shouldRender: isEditingAllowed,
   });
@@ -225,7 +233,7 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
     key: "archive",
     title: t("common.actions.archive"),
     description: isInArchivableGroup ? undefined : t("issue.archive.description"),
-    icon: ArchiveIcon,
+    icon: ArchiveOutline,
     className: "items-start",
     iconClassName: "mt-1",
     action: () => handleOptionalAction(setArchiveIssueModal, "Archive", true),
@@ -236,7 +244,7 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
   const createRestoreMenuItem = (): TContextMenuItem => ({
     key: "restore",
     title: "Restore",
-    icon: ArchiveRestoreIcon,
+    icon: RestoreOutline,
     action: actionHandlers.handleIssueRestore,
     shouldRender: isRestoringAllowed,
   });
@@ -244,7 +252,7 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
   const createDeleteMenuItem = (): TContextMenuItem => ({
     key: "delete",
     title: t("common.actions.delete"),
-    icon: TrashIcon,
+    icon: DeleteOutline,
     action: () => {
       setDeleteIssueModal(true);
     },
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx
index b8485587807..879dde4d5ff 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/issue-detail.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
 import { omit } from "lodash-es";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { Ellipsis } from "lucide-react";
+import { MoreHorizontalOutline } from "@makeplane/propel/icons";
 // plane imports
 import { ARCHIVABLE_STATE_GROUPS, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import type { TIssue } from "@plane/types";
@@ -228,7 +228,7 @@ export const WorkItemDetailQuickActions = observer(function WorkItemDetailQuickA
       <CustomMenu
         ellipsis
         placement={placements}
-        customButton={<IconButton size="lg" variant="secondary" icon={Ellipsis} />}
+        customButton={<IconButton size="lg" variant="secondary" icon={MoreHorizontalOutline} />}
         portalElement={portalElement}
         menuItemsClassName="z-[14]"
         maxHeight="lg"
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx
index 0362734af1d..6645e3514ac 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/gantt.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import { Row } from "@plane/ui";
 import type { TQuickAddIssueButton } from "../root";
 
@@ -21,7 +21,7 @@ export const GanttQuickAddIssueButton = observer(function GanttQuickAddIssueButt
       onClick={onClick}
     >
       <Row className="flex gap-2 py-2">
-        <PlusIcon className="my-auto h-3.5 w-3.5 stroke-2" />
+        <AddOutline className="my-auto h-3.5 w-3.5" />
         <span className="text-13 font-medium">{t(`${isEpic ? "epic.new" : "issue.new"}`)}</span>
       </Row>
     </button>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx
index 4ecd6a36208..20e5909aac6 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/kanban.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import type { TQuickAddIssueButton } from "../root";
 
 export const KanbanQuickAddIssueButton = observer(function KanbanQuickAddIssueButton(props: TQuickAddIssueButton) {
@@ -18,7 +18,7 @@ export const KanbanQuickAddIssueButton = observer(function KanbanQuickAddIssueBu
       className="flex w-full cursor-pointer items-center gap-2 rounded-lg bg-layer-transparent px-2 py-1 py-1.5 hover:bg-layer-transparent-hover"
       onClick={onClick}
     >
-      <PlusIcon className="h-3.5 w-3.5 stroke-2" />
+      <AddOutline className="h-3.5 w-3.5" />
       <span className="text-13 font-medium">{isEpic ? t("epic.new") : t("issue.new")}</span>
     </div>
   );
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx
index 1a17c44f887..51826e72fa5 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/list.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import { Row } from "@plane/ui";
 import type { TQuickAddIssueButton } from "../root";
 
@@ -19,7 +19,7 @@ export const ListQuickAddIssueButton = observer(function ListQuickAddIssueButton
       className="flex w-full cursor-pointer items-center gap-2 bg-layer-transparent py-3 hover:bg-layer-transparent-hover"
       onClick={onClick}
     >
-      <PlusIcon className="h-3.5 w-3.5 stroke-2" />
+      <AddOutline className="h-3.5 w-3.5" />
       <span className="text-13 font-medium">{isEpic ? t("epic.new") : t("issue.new")}</span>
     </Row>
   );
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx
index a94ccb068d1..74432604d91 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/button/spreadsheet.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import type { TQuickAddIssueButton } from "../root";
 
 export const SpreadsheetAddIssueButton = observer(function SpreadsheetAddIssueButton(props: TQuickAddIssueButton) {
@@ -20,7 +20,7 @@ export const SpreadsheetAddIssueButton = observer(function SpreadsheetAddIssueBu
         className="flex w-full items-center gap-x-[6px] bg-layer-transparent px-2 py-2 transition-colors hover:bg-layer-transparent-hover"
         onClick={onClick}
       >
-        <PlusIcon className="h-3.5 w-3.5 stroke-2" />
+        <AddOutline className="h-3.5 w-3.5" />
         <span className="text-13 font-medium">{isEpic ? t("epic.add.label") : t("issue.add.label")}</span>
       </button>
     </div>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx b/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx
index c8b1b36a000..fb991a2a719 100644
--- a/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx
+++ b/apps/web/core/components/issues/issue-layouts/quick-add/root.tsx
@@ -12,7 +12,7 @@ import type { UseFormRegister } from "react-hook-form";
 import { useForm } from "react-hook-form";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import { setPromiseToast } from "@plane/propel/toast";
 import type { IProject, TIssue, EIssueLayoutTypes } from "@plane/types";
 import { cn, createIssuePayload } from "@plane/utils";
@@ -167,7 +167,7 @@ export const QuickAddIssueRoot = observer(function QuickAddIssueRoot(props: TQui
               className="flex w-full cursor-pointer items-center gap-2 bg-layer-transparent px-2 py-3 hover:bg-layer-transparent-hover"
               onClick={() => handleIsOpen(true)}
             >
-              <PlusIcon className="h-3.5 w-3.5 stroke-2" />
+              <AddOutline className="h-3.5 w-3.5" />
               <span className="text-13 font-medium">{t(`${isEpic ? "epic.new" : "issue.new"}`)}</span>
             </button>
           )}
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx
index 580198afa03..6fde28d2d8d 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/due-date-column.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { DueDatePropertyIcon } from "@plane/propel/icons";
+import { DueDateOutline } from "@makeplane/propel/icons";
 // types
 import type { TIssue } from "@plane/types";
 import { cn, getDate, renderFormattedPayloadDate, shouldHighlightIssueDueDate } from "@plane/utils";
@@ -48,7 +48,7 @@ export const SpreadsheetDueDateColumn = observer(function SpreadsheetDueDateColu
         }}
         disabled={disabled}
         placeholder="Due date"
-        icon={<DueDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+        icon={<DueDateOutline className="h-3 w-3 flex-shrink-0" />}
         buttonVariant="transparent-with-text"
         buttonContainerClassName="w-full"
         buttonClassName={cn(
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx
index e68676e42ec..fb30e89c5f1 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/header-column.tsx
@@ -5,7 +5,14 @@
  */
 
 //ui
-import { ArrowDownWideNarrow, ArrowUpNarrowWide, CheckIcon, ChevronDownIcon, Eraser, MoveRight } from "lucide-react";
+import { Eraser } from "lucide-react";
+import {
+  ArrowNarrowRightOutline,
+  ChevronDownOutline,
+  SortAscendingOutline,
+  SortDescendingOutline,
+  TickOutline,
+} from "@makeplane/propel/icons";
 // constants
 import { SPREADSHEET_PROPERTY_DETAILS } from "@plane/constants";
 // i18n
@@ -62,13 +69,13 @@ export function HeaderColumn(props: Props) {
             {activeSortingProperty === property && (
               <div className="flex h-3.5 w-3.5 items-center justify-center rounded-full">
                 {propertyDetails.ascendingOrderKey === displayFilters.order_by ? (
-                  <ArrowDownWideNarrow className="h-3 w-3" />
+                  <SortDescendingOutline className="h-3 w-3" />
                 ) : (
-                  <ArrowUpNarrowWide className="h-3 w-3" />
+                  <SortAscendingOutline className="h-3 w-3" />
                 )}
               </div>
             )}
-            <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
+            <ChevronDownOutline className="h-3 w-3" aria-hidden="true" />
           </div>
         </Row>
       }
@@ -85,13 +92,15 @@ export function HeaderColumn(props: Props) {
           }`}
         >
           <div className="flex items-center gap-2">
-            <ArrowDownWideNarrow className="h-3 w-3 stroke-[1.5]" />
+            <SortDescendingOutline className="h-3 w-3 stroke-[1.5]" />
             <span>{propertyDetails.ascendingOrderTitle}</span>
-            <MoveRight className="h-3 w-3" />
+            <ArrowNarrowRightOutline className="h-3 w-3" />
             <span>{propertyDetails.descendingOrderTitle}</span>
           </div>
 
-          {selectedMenuItem === `${propertyDetails.ascendingOrderKey}_${property}` && <CheckIcon className="h-3 w-3" />}
+          {selectedMenuItem === `${propertyDetails.ascendingOrderKey}_${property}` && (
+            <TickOutline className="h-3 w-3" />
+          )}
         </div>
       </CustomMenu.MenuItem>
       <CustomMenu.MenuItem onClick={() => handleOrderBy(propertyDetails.descendingOrderKey, property)}>
@@ -103,14 +112,14 @@ export function HeaderColumn(props: Props) {
           }`}
         >
           <div className="flex items-center gap-2">
-            <ArrowUpNarrowWide className="h-3 w-3 stroke-[1.5]" />
+            <SortAscendingOutline className="h-3 w-3 stroke-[1.5]" />
             <span>{propertyDetails.descendingOrderTitle}</span>
-            <MoveRight className="h-3 w-3" />
+            <ArrowNarrowRightOutline className="h-3 w-3" />
             <span>{propertyDetails.ascendingOrderTitle}</span>
           </div>
 
           {selectedMenuItem === `${propertyDetails.descendingOrderKey}_${property}` && (
-            <CheckIcon className="h-3 w-3" />
+            <TickOutline className="h-3 w-3" />
           )}
         </div>
       </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx
index fd4a180c9d9..3bcd8da9167 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/columns/start-date-column.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { StartDatePropertyIcon } from "@plane/propel/icons";
+import { StartDateOutline } from "@makeplane/propel/icons";
 // types
 import type { TIssue } from "@plane/types";
 // components
@@ -42,7 +42,7 @@ export const SpreadsheetStartDateColumn = observer(function SpreadsheetStartDate
         }}
         disabled={disabled}
         placeholder="Start date"
-        icon={<StartDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+        icon={<StartDateOutline className="h-3 w-3 flex-shrink-0" />}
         buttonVariant="transparent-with-text"
         buttonClassName="text-left rounded-none group-[.selected-issue-row]:bg-accent-primary/5 group-[.selected-issue-row]:hover:bg-accent-primary/10 px-page-x"
         buttonContainerClassName="w-full"
diff --git a/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx b/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx
index 05aab46286a..7adaa6295b8 100644
--- a/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx
+++ b/apps/web/core/components/issues/issue-layouts/spreadsheet/issue-row.tsx
@@ -8,11 +8,10 @@ import type { Dispatch, MouseEvent, MutableRefObject, SetStateAction } from "rea
 import { useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { MoreHorizontal } from "lucide-react";
+import { ChevronRightOutline, MoreHorizontalOutline } from "@makeplane/propel/icons";
 import { SPREADSHEET_SELECT_GROUP } from "@plane/constants";
 // plane helpers
 import { useOutsideClickDetector } from "@plane/hooks";
-import { ChevronRightIcon } from "@plane/propel/icons";
 // types
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IIssueDisplayProperties, TIssue } from "@plane/types";
@@ -220,7 +219,7 @@ const IssueRowDetails = observer(function IssueRowDetails(props: IssueRowDetails
       }`}
       onClick={() => setIsMenuActive(!isMenuActive)}
     >
-      <MoreHorizontal className="h-3.5 w-3.5" />
+      <MoreHorizontalOutline className="h-3.5 w-3.5" />
     </div>
   );
   if (!issueDetail) return null;
@@ -340,11 +339,10 @@ const IssueRowDetails = observer(function IssueRowDetails(props: IssueRowDetails
                     className="grid size-4 place-items-center rounded-xs text-placeholder hover:text-tertiary"
                     onClick={handleToggleExpand}
                   >
-                    <ChevronRightIcon
+                    <ChevronRightOutline
                       className={cn("size-4", {
                         "rotate-90": isExpanded,
                       })}
-                      strokeWidth={2.5}
                     />
                   </button>
                 )}
diff --git a/apps/web/core/components/issues/issue-layouts/utils.tsx b/apps/web/core/components/issues/issue-layouts/utils.tsx
index ecb40b07d04..e14a7c47a0c 100644
--- a/apps/web/core/components/issues/issue-layouts/utils.tsx
+++ b/apps/web/core/components/issues/issue-layouts/utils.tsx
@@ -10,27 +10,27 @@ import { extractInstruction } from "@atlaskit/pragmatic-drag-and-drop-hitbox/tre
 import { clone, isNil, pull, uniq, concat } from "lodash-es";
 import scrollIntoView from "smooth-scroll-into-view-if-needed";
 import type { FC } from "react";
-import { CalendarDays, LayersIcon, Paperclip } from "lucide-react";
+import {
+  AttachOutline,
+  CalendarOutline,
+  CyclesOutline,
+  DueDateOutline,
+  EstimateOutline,
+  LabelsOutline,
+  LinkOutline,
+  MembersOutline,
+  ModuleOutline,
+  PriorityOutline,
+  StartDateOutline,
+  StateOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 // plane types
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { EIconSize, ISSUE_PRIORITIES, STATE_GROUPS } from "@plane/constants";
 import { Logo } from "@plane/propel/emoji-icon-picker";
 import type { ISvgIcons } from "@plane/propel/icons";
-import {
-  CycleGroupIcon,
-  CycleIcon,
-  ModuleIcon,
-  PriorityIcon,
-  StateGroupIcon,
-  LinkIcon,
-  StatePropertyIcon,
-  MembersPropertyIcon,
-  DueDatePropertyIcon,
-  EstimatePropertyIcon,
-  LabelPropertyIcon,
-  PriorityPropertyIcon,
-  StartDatePropertyIcon,
-} from "@plane/propel/icons";
+import { CycleGroupIcon, PriorityIcon, StateGroupIcon } from "@plane/propel/icons";
 import type {
   GroupByColumnTypes,
   IGroupByColumn,
@@ -206,7 +206,7 @@ const getCycleColumns = (): IGroupByColumn[] | undefined => {
   cycles.push({
     id: "None",
     name: "None",
-    icon: <CycleIcon className="h-3.5 w-3.5" />,
+    icon: <CyclesOutline className="h-3.5 w-3.5" />,
     payload: {},
   });
   return cycles;
@@ -226,14 +226,14 @@ const getModuleColumns = (): IGroupByColumn[] | undefined => {
     modules.push({
       id: module.id,
       name: module.name,
-      icon: <ModuleIcon className="h-3.5 w-3.5" />,
+      icon: <ModuleOutline className="h-3.5 w-3.5" />,
       payload: { module_ids: [module.id] },
     });
   });
   modules.push({
     id: "None",
     name: "None",
-    icon: <ModuleIcon className="h-3.5 w-3.5" />,
+    icon: <ModuleOutline className="h-3.5 w-3.5" />,
     payload: {},
   });
   return modules;
@@ -846,19 +846,19 @@ export const getScopeMemberIds = ({ isWorkspaceLevel, projectId }: TGetColumns):
 export const getTeamProjectColumns = (): IGroupByColumn[] | undefined => undefined;
 
 export const SpreadSheetPropertyIconMap: Record<string, FC<ISvgIcons>> = {
-  MembersPropertyIcon: MembersPropertyIcon,
-  CalenderDays: CalendarDays,
-  DueDatePropertyIcon: DueDatePropertyIcon,
-  EstimatePropertyIcon: EstimatePropertyIcon,
-  LabelPropertyIcon: LabelPropertyIcon,
-  ModuleIcon: ModuleIcon,
-  ContrastIcon: CycleIcon,
-  PriorityPropertyIcon: PriorityPropertyIcon,
-  StartDatePropertyIcon: StartDatePropertyIcon,
-  StatePropertyIcon: StatePropertyIcon,
-  Link2: LinkIcon,
-  Paperclip: Paperclip,
-  LayersIcon: LayersIcon,
+  MembersOutline: MembersOutline,
+  CalenderDays: CalendarOutline,
+  DueDateOutline: DueDateOutline,
+  EstimateOutline: EstimateOutline,
+  LabelsOutline: LabelsOutline,
+  ModuleOutline: ModuleOutline,
+  ContrastIcon: CyclesOutline,
+  PriorityOutline: PriorityOutline,
+  StartDateOutline: StartDateOutline,
+  StateOutline: StateOutline,
+  Link2: LinkOutline,
+  AttachOutline: AttachOutline,
+  WorkItemsOutline: WorkItemsOutline,
 };
 
 export const SPREADSHEET_COLUMNS: { [key in keyof IIssueDisplayProperties]: TSpreadsheetColumn } = {
diff --git a/apps/web/core/components/issues/issue-modal/components/default-properties.tsx b/apps/web/core/components/issues/issue-modal/components/default-properties.tsx
index 67219a2f59a..2119c4087d7 100644
--- a/apps/web/core/components/issues/issue-modal/components/default-properties.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/default-properties.tsx
@@ -10,7 +10,7 @@ import type { Control } from "react-hook-form";
 import { Controller } from "react-hook-form";
 import { ETabIndices, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ParentPropertyIcon } from "@plane/propel/icons";
+import { ParentOutline } from "@makeplane/propel/icons";
 // types
 import type { ISearchIssueResponse, TIssue } from "@plane/types";
 // ui
@@ -314,7 +314,7 @@ export const IssueDefaultProperties = observer(function IssueDefaultProperties(p
             className="flex h-full cursor-pointer items-center justify-between gap-1 rounded-sm border-[0.5px] border-strong px-2 py-0.5 text-caption-sm-regular hover:bg-layer-1"
             onClick={() => setParentIssueListModalOpen(true)}
           >
-            <ParentPropertyIcon className="h-3 w-3 flex-shrink-0" />
+            <ParentOutline className="h-3 w-3 flex-shrink-0" />
             <span className="whitespace-nowrap">{t("add_parent")}</span>
           </button>
         )}
diff --git a/apps/web/core/components/issues/issue-modal/components/description-editor.tsx b/apps/web/core/components/issues/issue-modal/components/description-editor.tsx
index 54225c6b71a..36098a176dc 100644
--- a/apps/web/core/components/issues/issue-modal/components/description-editor.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/description-editor.tsx
@@ -8,7 +8,7 @@ import React, { useEffect, useState } from "react";
 import { observer } from "mobx-react";
 import type { Control } from "react-hook-form";
 import { Controller } from "react-hook-form";
-import { Sparkle } from "lucide-react";
+import { AiStar1Outline } from "@makeplane/propel/icons";
 // plane imports
 import { ETabIndices } from "@plane/constants";
 import type { EditorRefApi } from "@plane/editor";
@@ -258,7 +258,7 @@ export const IssueDescriptionEditor = observer(function IssueDescriptionEditor(p
                   "Generating response"
                 ) : (
                   <>
-                    <Sparkle className="h-3.5 w-3.5" />I{"'"}m feeling lucky
+                    <AiStar1Outline className="h-3.5 w-3.5" />I{"'"}m feeling lucky
                   </>
                 )}
               </button>
@@ -282,7 +282,7 @@ export const IssueDescriptionEditor = observer(function IssueDescriptionEditor(p
                     onClick={() => setGptAssistantModal((prevData) => !prevData)}
                     tabIndex={-1}
                   >
-                    <Sparkle className="h-4 w-4" />
+                    <AiStar1Outline className="h-4 w-4" />
                     AI
                   </button>
                 }
diff --git a/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx b/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx
index dd4e9d3e23e..03836bb767e 100644
--- a/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx
+++ b/apps/web/core/components/issues/issue-modal/components/parent-tag.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import type { Control } from "react-hook-form";
 import { Controller } from "react-hook-form";
 import { ETabIndices } from "@plane/constants";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane imports
 // types
 import type { ISearchIssueResponse, TIssue } from "@plane/types";
@@ -69,7 +69,7 @@ export const IssueParentTag = observer(function IssueParentTag(props: TIssuePare
               }}
               tabIndex={getIndex("remove_parent")}
             >
-              <CloseIcon className="h-3 w-3 cursor-pointer" />
+              <CloseOutline className="h-3 w-3 cursor-pointer" />
             </button>
           </div>
         </div>
diff --git a/apps/web/core/components/issues/issue-update-status.tsx b/apps/web/core/components/issues/issue-update-status.tsx
index 2fab140e9f3..0d1129f71ca 100644
--- a/apps/web/core/components/issues/issue-update-status.tsx
+++ b/apps/web/core/components/issues/issue-update-status.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { RefreshCw } from "lucide-react";
+import { RefreshOutline } from "@makeplane/propel/icons";
 // types
 import type { TNameDescriptionLoader } from "@plane/types";
 
@@ -25,7 +25,7 @@ export const NameDescriptionUpdateStatus = observer(function NameDescriptionUpda
         }`}
       >
         {isSubmitting !== "submitted" && isSubmitting !== "saved" && (
-          <RefreshCw className="size-3.5 animate-spin stroke-tertiary" />
+          <RefreshOutline className="size-3.5 animate-spin text-tertiary" />
         )}
         <span className="text-13 text-tertiary">{isSubmitting === "submitting" ? "Saving..." : "Saved"}</span>
       </div>
diff --git a/apps/web/core/components/issues/layout-quick-actions.tsx b/apps/web/core/components/issues/layout-quick-actions.tsx
index c68f9e907fb..5a326108d3f 100644
--- a/apps/web/core/components/issues/layout-quick-actions.tsx
+++ b/apps/web/core/components/issues/layout-quick-actions.tsx
@@ -10,7 +10,7 @@ import type { TContextMenuItem } from "@plane/ui";
 import { CustomMenu } from "@plane/ui";
 import { copyUrlToClipboard, cn } from "@plane/utils";
 import { useLayoutMenuItems } from "@/components/common/quick-actions-helper";
-import { Ellipsis } from "lucide-react";
+import { MoreHorizontalOutline } from "@makeplane/propel/icons";
 import { IconButton } from "@plane/propel/icon-button";
 
 type Props = {
@@ -55,7 +55,7 @@ export const LayoutQuickActions = observer(function LayoutQuickActions(props: Pr
         closeOnSelect
         maxHeight="lg"
         className="flex size-[26px] flex-shrink-0 items-center justify-center rounded"
-        customButton={<IconButton size="lg" variant="tertiary" icon={Ellipsis} />}
+        customButton={<IconButton size="lg" variant="tertiary" icon={MoreHorizontalOutline} />}
       >
         {MENU_ITEMS.map((item) => {
           if (item.shouldRender === false) return null;
diff --git a/apps/web/core/components/issues/parent-issues-list-modal.tsx b/apps/web/core/components/issues/parent-issues-list-modal.tsx
index 19ec49a6ef7..b96be7b0902 100644
--- a/apps/web/core/components/issues/parent-issues-list-modal.tsx
+++ b/apps/web/core/components/issues/parent-issues-list-modal.tsx
@@ -7,12 +7,11 @@
 import React, { useEffect, useState } from "react";
 import { useParams } from "next/navigation";
 // icons
-import { Rocket } from "lucide-react";
+import { RocketOutline, SearchOutline } from "@makeplane/propel/icons";
 // headless ui
 import { Combobox } from "@headlessui/react";
 // i18n
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon } from "@plane/propel/icons";
 // types
 import type { ISearchIssueResponse } from "@plane/types";
 // ui
@@ -99,7 +98,7 @@ export function ParentIssuesListModal({
         }}
       >
         <div className="relative m-1">
-          <SearchIcon
+          <SearchOutline
             className="text-opacity-40 pointer-events-none absolute top-3.5 left-4 h-5 w-5 text-primary"
             aria-hidden="true"
           />
@@ -190,7 +189,7 @@ export function ParentIssuesListModal({
                         rel="noopener noreferrer"
                         onClick={(e) => e.stopPropagation()}
                       >
-                        <Rocket className="h-4 w-4" />
+                        <RocketOutline className="h-4 w-4" />
                       </a>
                     </Combobox.Option>
                   ))}
diff --git a/apps/web/core/components/issues/peek-overview/error.tsx b/apps/web/core/components/issues/peek-overview/error.tsx
index a494ce977f1..a3472154576 100644
--- a/apps/web/core/components/issues/peek-overview/error.tsx
+++ b/apps/web/core/components/issues/peek-overview/error.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { MoveRight } from "lucide-react";
+import { ArrowNarrowRightOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 // assets
 import emptyIssue from "@/app/assets/empty-state/issue.svg?url";
@@ -27,7 +27,7 @@ export function IssuePeekOverviewError(props: TIssuePeekOverviewError) {
       <div className="flex flex-shrink-0 justify-start">
         <Tooltip label="Close the peek view" disabled={isMobile}>
           <button onClick={removeRoutePeekId} className="m-5 h-5 w-5">
-            <MoveRight className="h-4 w-4 text-tertiary hover:text-secondary" />
+            <ArrowNarrowRightOutline className="h-4 w-4 text-tertiary hover:text-secondary" />
           </button>
         </Tooltip>
       </div>
diff --git a/apps/web/core/components/issues/peek-overview/header.tsx b/apps/web/core/components/issues/peek-overview/header.tsx
index 5e3855bce27..1ba6f471d19 100644
--- a/apps/web/core/components/issues/peek-overview/header.tsx
+++ b/apps/web/core/components/issues/peek-overview/header.tsx
@@ -7,10 +7,16 @@
 import { useRef } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
-import { MoveDiagonal, MoveRight } from "lucide-react";
+import {
+  ArrowNarrowRightOutline,
+  DragDropOutline,
+  FullScreenPeekOutline,
+  LinkOutline,
+  ModalPeekOutline,
+  SidePeekOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CenterPanelIcon, CopyLinkIcon, FullScreenPanelIcon, SidePanelIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TNameDescriptionLoader } from "@plane/types";
@@ -34,17 +40,17 @@ export type TPeekModes = "side-peek" | "modal" | "full-screen";
 const PEEK_OPTIONS: { key: TPeekModes; icon: any; i18n_title: string }[] = [
   {
     key: "side-peek",
-    icon: SidePanelIcon,
+    icon: SidePeekOutline,
     i18n_title: "common.side_peek",
   },
   {
     key: "modal",
-    icon: CenterPanelIcon,
+    icon: ModalPeekOutline,
     i18n_title: "common.modal",
   },
   {
     key: "full-screen",
-    icon: FullScreenPanelIcon,
+    icon: FullScreenPeekOutline,
     i18n_title: "common.full_screen",
   },
 ];
@@ -161,13 +167,13 @@ export const IssuePeekOverviewHeader = observer(function IssuePeekOverviewHeader
       <div className="flex items-center gap-4">
         <Tooltip label={t("common.close_peek_view")} disabled={isMobile}>
           <button onClick={removeRoutePeekId}>
-            <MoveRight className="h-4 w-4 text-tertiary hover:text-secondary" />
+            <ArrowNarrowRightOutline className="h-4 w-4 text-tertiary hover:text-secondary" />
           </button>
         </Tooltip>
 
         <Tooltip label={t("issue.open_in_full_screen")} disabled={isMobile}>
           <Link href={workItemLink} onClick={() => removeRoutePeekId()}>
-            <MoveDiagonal className="h-4 w-4 text-tertiary hover:text-secondary" />
+            <DragDropOutline className="h-4 w-4 text-tertiary hover:text-secondary" />
           </Link>
         </Tooltip>
         {currentMode && embedIssue === false && (
@@ -206,7 +212,7 @@ export const IssuePeekOverviewHeader = observer(function IssuePeekOverviewHeader
             <IssueSubscription workspaceSlug={workspaceSlug} projectId={projectId} issueId={issueId} />
           )}
           <Tooltip label={t("common.actions.copy_link")} disabled={isMobile}>
-            <IconButton variant="secondary" size="lg" onClick={handleCopyText} icon={CopyLinkIcon} />
+            <IconButton variant="secondary" size="lg" onClick={handleCopyText} icon={LinkOutline} />
           </Tooltip>
           {issueDetails && (
             <WorkItemDetailQuickActions
diff --git a/apps/web/core/components/issues/peek-overview/loader.tsx b/apps/web/core/components/issues/peek-overview/loader.tsx
index 31ede6415f5..51323d55588 100644
--- a/apps/web/core/components/issues/peek-overview/loader.tsx
+++ b/apps/web/core/components/issues/peek-overview/loader.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { MoveRight } from "lucide-react";
+import { ArrowNarrowRightOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { Loader } from "@plane/ui";
 // hooks
@@ -25,7 +25,7 @@ export function IssuePeekOverviewLoader(props: TIssuePeekOverviewLoader) {
         <div className="flex items-center gap-2">
           <Tooltip label="Close the peek view" disabled={isMobile}>
             <button onClick={removeRoutePeekId}>
-              <MoveRight className="h-4 w-4 text-tertiary hover:text-secondary" />
+              <ArrowNarrowRightOutline className="h-4 w-4 text-tertiary hover:text-secondary" />
             </button>
           </Tooltip>
           <Loader.Item width="30px" height="30px" />
diff --git a/apps/web/core/components/issues/peek-overview/properties.tsx b/apps/web/core/components/issues/peek-overview/properties.tsx
index 8f35cc1645a..46476ff1193 100644
--- a/apps/web/core/components/issues/peek-overview/properties.tsx
+++ b/apps/web/core/components/issues/peek-overview/properties.tsx
@@ -9,18 +9,18 @@ import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 // ui icons
 import {
-  CycleIcon,
-  StatePropertyIcon,
-  ModuleIcon,
-  MembersPropertyIcon,
-  PriorityPropertyIcon,
-  StartDatePropertyIcon,
-  DueDatePropertyIcon,
-  LabelPropertyIcon,
-  UserCirclePropertyIcon,
-  EstimatePropertyIcon,
-  ParentPropertyIcon,
-} from "@plane/propel/icons";
+  CyclesOutline,
+  DueDateOutline,
+  EstimateOutline,
+  LabelsOutline,
+  MembersOutline,
+  ModuleOutline,
+  ParentOutline,
+  PriorityOutline,
+  StartDateOutline,
+  StateOutline,
+  UserOutline,
+} from "@makeplane/propel/icons";
 import { cn, getDate, renderFormattedPayloadDate, shouldHighlightIssueDueDate } from "@plane/utils";
 // components
 import { DateDropdown } from "@/components/dropdowns/date";
@@ -78,7 +78,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
     <div>
       <h6 className="text-body-xs-medium">{t("common.properties")}</h6>
       <div className={`mt-3 w-full space-y-3 ${disabled ? "opacity-60" : ""}`}>
-        <SidebarPropertyListItem icon={StatePropertyIcon} label={t("common.state")}>
+        <SidebarPropertyListItem icon={StateOutline} label={t("common.state")}>
           <StateDropdown
             value={issue?.state_id}
             onChange={(val) => issueOperations.update(workspaceSlug, projectId, issueId, { state_id: val })}
@@ -93,7 +93,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
           />
         </SidebarPropertyListItem>
 
-        <SidebarPropertyListItem icon={MembersPropertyIcon} label={t("common.assignees")}>
+        <SidebarPropertyListItem icon={MembersOutline} label={t("common.assignees")}>
           <MemberDropdown
             value={issue?.assignee_ids ?? undefined}
             onChange={(val) => issueOperations.update(workspaceSlug, projectId, issueId, { assignee_ids: val })}
@@ -111,7 +111,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
           />
         </SidebarPropertyListItem>
 
-        <SidebarPropertyListItem icon={PriorityPropertyIcon} label={t("common.priority")}>
+        <SidebarPropertyListItem icon={PriorityOutline} label={t("common.priority")}>
           <PriorityDropdown
             value={issue?.priority}
             onChange={(val) => issueOperations.update(workspaceSlug, projectId, issueId, { priority: val })}
@@ -124,11 +124,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
         </SidebarPropertyListItem>
 
         {createdByDetails && (
-          <SidebarPropertyListItem
-            icon={UserCirclePropertyIcon}
-            label={t("common.created_by")}
-            childrenClassName="px-2"
-          >
+          <SidebarPropertyListItem icon={UserOutline} label={t("common.created_by")} childrenClassName="px-2">
             <ButtonAvatars
               showTooltip
               userIds={createdByDetails?.display_name?.includes("-intake") ? null : createdByDetails?.id}
@@ -139,7 +135,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
           </SidebarPropertyListItem>
         )}
 
-        <SidebarPropertyListItem icon={StartDatePropertyIcon} label={t("common.order_by.start_date")}>
+        <SidebarPropertyListItem icon={StartDateOutline} label={t("common.order_by.start_date")}>
           <DateDropdown
             value={issue.start_date}
             onChange={(val) =>
@@ -159,7 +155,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
           />
         </SidebarPropertyListItem>
 
-        <SidebarPropertyListItem icon={DueDatePropertyIcon} label={t("common.order_by.due_date")}>
+        <SidebarPropertyListItem icon={DueDateOutline} label={t("common.order_by.due_date")}>
           <div className="flex w-full items-center gap-2">
             <DateDropdown
               value={issue.target_date}
@@ -185,7 +181,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
         </SidebarPropertyListItem>
 
         {isEstimateEnabled && (
-          <SidebarPropertyListItem icon={EstimatePropertyIcon} label={t("common.estimate")}>
+          <SidebarPropertyListItem icon={EstimateOutline} label={t("common.estimate")}>
             <EstimateDropdown
               value={issue.estimate_point ?? undefined}
               onChange={(val) => issueOperations.update(workspaceSlug, projectId, issueId, { estimate_point: val })}
@@ -204,7 +200,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
         )}
 
         {projectDetails?.module_view && (
-          <SidebarPropertyListItem icon={ModuleIcon} label={t("common.modules")}>
+          <SidebarPropertyListItem icon={ModuleOutline} label={t("common.modules")}>
             <IssueModuleSelect
               className="w-full grow"
               workspaceSlug={workspaceSlug}
@@ -217,7 +213,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
         )}
 
         {projectDetails?.cycle_view && (
-          <SidebarPropertyListItem icon={CycleIcon} label={t("common.cycle")} appendElement={null}>
+          <SidebarPropertyListItem icon={CyclesOutline} label={t("common.cycle")} appendElement={null}>
             <IssueCycleSelect
               className="h-7.5 w-full grow"
               workspaceSlug={workspaceSlug}
@@ -229,7 +225,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
           </SidebarPropertyListItem>
         )}
 
-        <SidebarPropertyListItem icon={ParentPropertyIcon} label={t("common.parent")}>
+        <SidebarPropertyListItem icon={ParentOutline} label={t("common.parent")}>
           <IssueParentSelectRoot
             className="h-7.5 w-full grow"
             disabled={disabled}
@@ -240,7 +236,7 @@ export const PeekOverviewProperties = observer(function PeekOverviewProperties(p
           />
         </SidebarPropertyListItem>
 
-        <SidebarPropertyListItem icon={LabelPropertyIcon} label={t("common.labels")}>
+        <SidebarPropertyListItem icon={LabelsOutline} label={t("common.labels")}>
           <IssueLabel workspaceSlug={workspaceSlug} projectId={projectId} issueId={issueId} disabled={disabled} />
         </SidebarPropertyListItem>
       </div>
diff --git a/apps/web/core/components/issues/preview-card/date.tsx b/apps/web/core/components/issues/preview-card/date.tsx
index 9f95f330270..e0b130f39ca 100644
--- a/apps/web/core/components/issues/preview-card/date.tsx
+++ b/apps/web/core/components/issues/preview-card/date.tsx
@@ -4,9 +4,8 @@
  * See the LICENSE file for details.
  */
 
-import { CalendarDays } from "lucide-react";
+import { CalendarOutline, DueDateOutline, StartDateOutline } from "@makeplane/propel/icons";
 // plane imports
-import { DueDatePropertyIcon, StartDatePropertyIcon } from "@plane/propel/icons";
 import type { TStateGroups } from "@plane/types";
 import { cn, renderFormattedDate, shouldHighlightIssueDueDate } from "@plane/utils";
 
@@ -32,14 +31,14 @@ export function WorkItemPreviewCardDate(props: Props) {
             "text-danger-primary": shouldHighlightDate,
           })}
         >
-          <CalendarDays className="size-3 shrink-0" />
+          <CalendarOutline className="size-3 shrink-0" />
           <span>
             {renderFormattedDate(startDate)} - {renderFormattedDate(targetDate)}
           </span>
         </div>
       ) : startDate ? (
         <div className="flex h-full items-center gap-1">
-          <StartDatePropertyIcon className="size-3 shrink-0" />
+          <StartDateOutline className="size-3 shrink-0" />
           <span>{renderFormattedDate(startDate)}</span>
         </div>
       ) : (
@@ -48,7 +47,7 @@ export function WorkItemPreviewCardDate(props: Props) {
             "text-danger-primary": shouldHighlightDate,
           })}
         >
-          <DueDatePropertyIcon className="size-3 shrink-0" />
+          <DueDateOutline className="size-3 shrink-0" />
           <span>{renderFormattedDate(targetDate)}</span>
         </div>
       )}
diff --git a/apps/web/core/components/issues/relations/issue-list-item.tsx b/apps/web/core/components/issues/relations/issue-list-item.tsx
index 15b1a4e79d0..58db2db88b2 100644
--- a/apps/web/core/components/issues/relations/issue-list-item.tsx
+++ b/apps/web/core/components/issues/relations/issue-list-item.tsx
@@ -7,7 +7,7 @@
 import React from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, EditIcon, TrashIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, DeleteOutline, EditOutline, LinkOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TIssueRelationTypes } from "@plane/types";
@@ -168,7 +168,7 @@ export const RelationIssueListItem = observer(function RelationIssueListItem(pro
                 {!disabled && (
                   <CustomMenu.MenuItem onClick={handleEditIssue}>
                     <div className="flex items-center gap-2">
-                      <EditIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                      <EditOutline className="h-3.5 w-3.5" />
                       <span>{t("common.actions.edit")}</span>
                     </div>
                   </CustomMenu.MenuItem>
@@ -176,7 +176,7 @@ export const RelationIssueListItem = observer(function RelationIssueListItem(pro
 
                 <CustomMenu.MenuItem onClick={handleCopyIssueLink}>
                   <div className="flex items-center gap-2">
-                    <LinkIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                    <LinkOutline className="h-3.5 w-3.5" />
                     <span>{t("common.actions.copy_link")}</span>
                   </div>
                 </CustomMenu.MenuItem>
@@ -184,7 +184,7 @@ export const RelationIssueListItem = observer(function RelationIssueListItem(pro
                 {!disabled && (
                   <CustomMenu.MenuItem onClick={handleRemoveRelation}>
                     <div className="flex items-center gap-2">
-                      <CloseIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                      <CloseOutline className="h-3.5 w-3.5" />
                       <span>{t("common.actions.remove_relation")}</span>
                     </div>
                   </CustomMenu.MenuItem>
@@ -193,7 +193,7 @@ export const RelationIssueListItem = observer(function RelationIssueListItem(pro
                 {!disabled && (
                   <CustomMenu.MenuItem onClick={handleDeleteIssue}>
                     <div className="flex items-center gap-2">
-                      <TrashIcon className="h-3.5 w-3.5" strokeWidth={2} />
+                      <DeleteOutline className="h-3.5 w-3.5" />
                       <span>{t("common.actions.delete")}</span>
                     </div>
                   </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/issues/select/base.tsx b/apps/web/core/components/issues/select/base.tsx
index 67d11aba909..be202f197ff 100644
--- a/apps/web/core/components/issues/select/base.tsx
+++ b/apps/web/core/components/issues/select/base.tsx
@@ -8,13 +8,12 @@ import React, { useEffect, useRef, useState } from "react";
 import type { Placement } from "@popperjs/core";
 import { observer } from "mobx-react";
 import { usePopper } from "react-popper";
-import { Component, Loader } from "lucide-react";
+import { GroupOutline, LabelsOutline, LoadingOutline, SearchOutline, TickOutline } from "@makeplane/propel/icons";
 import { Combobox } from "@headlessui/react";
 import { getRandomLabelColor } from "@plane/constants";
 // plane imports
 import { useOutsideClickDetector } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon, SearchIcon, LabelPropertyIcon } from "@plane/propel/icons";
 import type { IIssueLabel } from "@plane/types";
 import { cn } from "@plane/utils";
 // components
@@ -185,7 +184,7 @@ export const WorkItemLabelSelectBase = observer(function WorkItemLabelSelectBase
               buttonClassName
             )}
           >
-            <LabelPropertyIcon className="h-3 w-3 flex-shrink-0" />
+            <LabelsOutline className="h-3 w-3 flex-shrink-0" />
             <span>{t("labels")}</span>
           </div>
         )}
@@ -199,7 +198,7 @@ export const WorkItemLabelSelectBase = observer(function WorkItemLabelSelectBase
             {...attributes.popper}
           >
             <div className="flex items-center gap-1.5 rounded-sm border border-subtle bg-surface-2 px-2">
-              <SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
+              <SearchOutline className="h-3.5 w-3.5 text-placeholder" />
               <Combobox.Input
                 as="input"
                 ref={inputRef}
@@ -242,7 +241,7 @@ export const WorkItemLabelSelectBase = observer(function WorkItemLabelSelectBase
                                     <span className="truncate">{label.name}</span>
                                   </div>
                                   <div className="flex shrink-0 items-center justify-center rounded-sm p-1">
-                                    <CheckIcon className={`h-3 w-3 ${selected ? "opacity-100" : "opacity-0"}`} />
+                                    <TickOutline className={`h-3 w-3 ${selected ? "opacity-100" : "opacity-0"}`} />
                                   </div>
                                 </div>
                               )}
@@ -252,7 +251,7 @@ export const WorkItemLabelSelectBase = observer(function WorkItemLabelSelectBase
                         return (
                           <li key={label.id} className="border-y border-subtle">
                             <div className="flex items-center gap-2 truncate p-2 text-primary select-none">
-                              <Component className="h-3 w-3" /> {label.name}
+                              <GroupOutline className="h-3 w-3" /> {label.name}
                             </div>
                             <ul>
                               {children.map((child) => (
@@ -278,7 +277,7 @@ export const WorkItemLabelSelectBase = observer(function WorkItemLabelSelectBase
                                         <span>{child.name}</span>
                                       </div>
                                       <div className="flex items-center justify-center rounded-sm p-1">
-                                        <CheckIcon className={`h-3 w-3 ${selected ? "opacity-100" : "opacity-0"}`} />
+                                        <TickOutline className={`h-3 w-3 ${selected ? "opacity-100" : "opacity-0"}`} />
                                       </div>
                                     </div>
                                   )}
@@ -290,7 +289,7 @@ export const WorkItemLabelSelectBase = observer(function WorkItemLabelSelectBase
                     })}
                   </ul>
                 ) : submitting ? (
-                  <Loader className="h-3.5 w-3.5 animate-spin" />
+                  <LoadingOutline className="h-3.5 w-3.5 animate-spin" />
                 ) : createLabelEnabled ? (
                   <p
                     onClick={() => {
diff --git a/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx b/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx
index 23288a6bd23..d863534670f 100644
--- a/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx
+++ b/apps/web/core/components/issues/workspace-draft/draft-issue-block.tsx
@@ -8,7 +8,7 @@ import React, { useRef, useState } from "react";
 import { omit } from "lodash-es";
 import { observer } from "mobx-react";
 import { SquareStackIcon } from "lucide-react";
-import { CopyIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
+import { CopyOutline, DeleteOutline, EditOutline } from "@makeplane/propel/icons";
 // plane utils
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TWorkspaceDraftIssue } from "@plane/types";
@@ -64,7 +64,7 @@ export const DraftIssueBlock = observer(function DraftIssueBlock(props: Props) {
     {
       key: "edit",
       title: "edit",
-      icon: EditIcon,
+      icon: EditOutline,
       action: () => {
         setIssueToEdit(issue);
         setCreateUpdateIssueModal(true);
@@ -73,7 +73,7 @@ export const DraftIssueBlock = observer(function DraftIssueBlock(props: Props) {
     {
       key: "make-a-copy",
       title: "make_a_copy",
-      icon: CopyIcon,
+      icon: CopyOutline,
       action: () => {
         setCreateUpdateIssueModal(true);
       },
@@ -91,7 +91,7 @@ export const DraftIssueBlock = observer(function DraftIssueBlock(props: Props) {
     {
       key: "delete",
       title: "delete",
-      icon: TrashIcon,
+      icon: DeleteOutline,
       action: () => {
         setDeleteIssueModal(true);
       },
diff --git a/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx b/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx
index 123d59d7977..21fe204a7d4 100644
--- a/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx
+++ b/apps/web/core/components/issues/workspace-draft/draft-issue-properties.tsx
@@ -8,7 +8,7 @@ import { useCallback, useMemo } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { DueDatePropertyIcon, StartDatePropertyIcon } from "@plane/propel/icons";
+import { DueDateOutline, StartDateOutline } from "@makeplane/propel/icons";
 // types
 import type { TIssuePriorities, TWorkspaceDraftIssue } from "@plane/types";
 import { getDate, renderFormattedPayloadDate, shouldHighlightIssueDueDate } from "@plane/utils";
@@ -185,7 +185,7 @@ export const DraftIssueProperties = observer(function DraftIssueProperties(props
           onChange={handleStartDate}
           maxDate={maxDate}
           placeholder="Start date"
-          icon={<StartDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+          icon={<StartDateOutline className="h-3 w-3 flex-shrink-0" />}
           buttonVariant={issue.start_date ? "border-with-text" : "border-without-text"}
           optionsClassName="z-10"
           renderByDefault={isMobile}
@@ -200,7 +200,7 @@ export const DraftIssueProperties = observer(function DraftIssueProperties(props
           onChange={handleTargetDate}
           minDate={minDate}
           placeholder="Due date"
-          icon={<DueDatePropertyIcon className="h-3 w-3 flex-shrink-0" />}
+          icon={<DueDateOutline className="h-3 w-3 flex-shrink-0" />}
           buttonVariant={issue.target_date ? "border-with-text" : "border-without-text"}
           buttonClassName={
             shouldHighlightIssueDueDate(issue?.target_date || null, stateDetails?.group) ? "text-danger-primary" : ""
diff --git a/apps/web/core/components/labels/label-block/label-item-block.tsx b/apps/web/core/components/labels/label-block/label-item-block.tsx
index 00298ebe310..4dcf69237c3 100644
--- a/apps/web/core/components/labels/label-block/label-item-block.tsx
+++ b/apps/web/core/components/labels/label-block/label-item-block.tsx
@@ -10,7 +10,7 @@ import type { LucideIcon } from "lucide-react";
 // plane helpers
 import { useOutsideClickDetector } from "@plane/hooks";
 import type { ISvgIcons } from "@plane/propel/icons";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // types
 import type { IIssueLabel } from "@plane/types";
 // ui
@@ -101,7 +101,7 @@ export function LabelItemBlock(props: ILabelItemBlock) {
                   handleLabelDelete(label);
                 }}
               >
-                <CloseIcon className="size-3.5 flex-shrink-0 text-tertiary" />
+                <CloseOutline className="size-3.5 flex-shrink-0 text-tertiary" />
               </button>
             </div>
           )}
diff --git a/apps/web/core/components/labels/label-block/label-name.tsx b/apps/web/core/components/labels/label-block/label-name.tsx
index 23e0c60ac89..5698e47b036 100644
--- a/apps/web/core/components/labels/label-block/label-name.tsx
+++ b/apps/web/core/components/labels/label-block/label-name.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { Component } from "lucide-react";
+import { GroupOutline } from "@makeplane/propel/icons";
 
 interface ILabelName {
   name: string;
@@ -18,7 +18,7 @@ export function LabelName(props: ILabelName) {
   return (
     <div className="flex items-center gap-3 pr-20">
       {isGroup ? (
-        <Component className="h-3.5 w-3.5" color={color} />
+        <GroupOutline className="h-3.5 w-3.5" color={color} />
       ) : (
         <span
           className="h-3.5 w-3.5 flex-shrink-0 rounded-full"
diff --git a/apps/web/core/components/labels/project-setting-label-group.tsx b/apps/web/core/components/labels/project-setting-label-group.tsx
index 16012b0489b..2fb466c32b7 100644
--- a/apps/web/core/components/labels/project-setting-label-group.tsx
+++ b/apps/web/core/components/labels/project-setting-label-group.tsx
@@ -9,7 +9,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
-import { EditIcon, TrashIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, DeleteOutline, EditOutline } from "@makeplane/propel/icons";
 import type { IIssueLabel } from "@plane/types";
 // components
 import type { TLabelOperationsCallbacks } from "./create-update-label-inline";
@@ -54,7 +54,7 @@ export const ProjectSettingLabelGroup = observer(function ProjectSettingLabelGro
 
   const customMenuItems: ICustomMenuItem[] = [
     {
-      CustomIcon: EditIcon,
+      CustomIcon: EditOutline,
       onClick: () => {
         setEditLabelForm(true);
         setIsUpdating(true);
@@ -64,7 +64,7 @@ export const ProjectSettingLabelGroup = observer(function ProjectSettingLabelGro
       key: "edit_label",
     },
     {
-      CustomIcon: TrashIcon,
+      CustomIcon: DeleteOutline,
       onClick: () => {
         handleLabelDelete(label);
       },
@@ -117,7 +117,7 @@ export const ProjectSettingLabelGroup = observer(function ProjectSettingLabelGro
 
                       <Disclosure.Button>
                         <span>
-                          <ChevronDownIcon
+                          <ChevronDownOutline
                             className={`h-4 w-4 text-placeholder ${!open ? "rotate-90 transform" : ""}`}
                           />
                         </span>
diff --git a/apps/web/core/components/labels/project-setting-label-item.tsx b/apps/web/core/components/labels/project-setting-label-item.tsx
index 8955617ef55..23169a60b1c 100644
--- a/apps/web/core/components/labels/project-setting-label-item.tsx
+++ b/apps/web/core/components/labels/project-setting-label-item.tsx
@@ -7,7 +7,7 @@
 import type { Dispatch, SetStateAction } from "react";
 import { useState } from "react";
 import { useParams } from "next/navigation";
-import { EditIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, EditOutline } from "@makeplane/propel/icons";
 // types
 import type { IIssueLabel } from "@plane/types";
 // hooks
@@ -65,14 +65,14 @@ export function ProjectSettingLabelItem(props: Props) {
 
   const customMenuItems: ICustomMenuItem[] = [
     {
-      CustomIcon: CloseIcon,
+      CustomIcon: CloseOutline,
       onClick: removeFromGroup,
       isVisible: !!label.parent,
       text: "Remove from group",
       key: "remove_from_group",
     },
     {
-      CustomIcon: EditIcon,
+      CustomIcon: EditOutline,
       onClick: () => {
         setEditLabelForm(true);
         setIsUpdating(true);
diff --git a/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx b/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx
index 3cc5ef6140e..4c2ecf17ee0 100644
--- a/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx
+++ b/apps/web/core/components/license/modal/card/base-paid-plan-card.tsx
@@ -6,7 +6,7 @@
 
 import { useState, Fragment } from "react";
 import { observer } from "mobx-react";
-import { CheckCircle } from "lucide-react";
+import { TickCircleOutline } from "@makeplane/propel/icons";
 import { Tab } from "@headlessui/react";
 // plane imports
 // helpers
@@ -81,7 +81,7 @@ export const BasePaidPlanCard = observer(function BasePaidPlanCard(props: TBaseP
                       })}
                     >
                       <p className="line-clamp-1 flex w-full items-center text-caption-md-medium leading-5">
-                        <CheckCircle className="mr-2 size-4 flex-shrink-0 text-tertiary" />
+                        <TickCircleOutline className="mr-2 size-4 flex-shrink-0 text-tertiary" />
                         <span className="truncate text-secondary">{feature}</span>
                       </p>
                     </li>
diff --git a/apps/web/core/components/license/modal/card/free-plan.tsx b/apps/web/core/components/license/modal/card/free-plan.tsx
index f07ff519ee9..380e214e34b 100644
--- a/apps/web/core/components/license/modal/card/free-plan.tsx
+++ b/apps/web/core/components/license/modal/card/free-plan.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { CircleX } from "lucide-react";
+import { CloseCircleOutline } from "@makeplane/propel/icons";
 // plane constants
 import { FREE_PLAN_UPGRADE_FEATURES } from "@plane/constants";
 // helpers
@@ -35,7 +35,7 @@ export const FreePlanCard = observer(function FreePlanCard(props: FreePlanCardPr
           {FREE_PLAN_UPGRADE_FEATURES.map((feature) => (
             <li key={feature} className={cn("relative col-span-12 flex rounded-md p-2")}>
               <p className="flex w-full items-center text-caption-md-medium leading-5">
-                <CircleX className="mr-2 size-4 flex-shrink-0 text-danger-secondary" />
+                <CloseCircleOutline className="mr-2 size-4 flex-shrink-0 text-danger-secondary" />
                 <span className="truncate text-secondary">{feature}</span>
               </p>
             </li>
diff --git a/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx b/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx
index 79b8df2c367..bbec9a47571 100644
--- a/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx
+++ b/apps/web/core/components/modules/analytics-sidebar/issue-progress.tsx
@@ -7,11 +7,10 @@
 import { Fragment, useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useSearchParams } from "next/navigation";
-import { AlertCircle } from "lucide-react";
+import { ChevronDownOutline, ChevronUpOutline, WarningCircleOutline } from "@makeplane/propel/icons";
 import { Disclosure, Transition } from "@headlessui/react";
 import { EEstimateSystem } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ChevronUpIcon, ChevronDownIcon } from "@plane/propel/icons";
 import type { TModulePlotType } from "@plane/types";
 import { EIssuesStoreType } from "@plane/types";
 import { CustomSelect, Spinner } from "@plane/ui";
@@ -157,9 +156,9 @@ export const ModuleAnalyticsProgress = observer(function ModuleAnalyticsProgress
                 )}
                 <Disclosure.Button className="ml-auto">
                   {open ? (
-                    <ChevronUpIcon className="h-3.5 w-3.5" aria-hidden="true" />
+                    <ChevronUpOutline className="h-3.5 w-3.5" aria-hidden="true" />
                   ) : (
-                    <ChevronDownIcon className="h-3.5 w-3.5" aria-hidden="true" />
+                    <ChevronDownOutline className="h-3.5 w-3.5" aria-hidden="true" />
                   )}
                 </Disclosure.Button>
               </div>
@@ -167,7 +166,7 @@ export const ModuleAnalyticsProgress = observer(function ModuleAnalyticsProgress
               <div className="relative flex w-full items-center justify-between gap-2">
                 <div className="text-13 font-medium text-secondary">Progress</div>
                 <div className="flex items-center gap-1">
-                  <AlertCircle height={14} width={14} className="text-secondary" />
+                  <WarningCircleOutline height={14} width={14} className="text-secondary" />
                   <span className="text-11 text-secondary italic">
                     {moduleDetails?.start_date && moduleDetails?.target_date
                       ? t("project_module.empty_state.sidebar.in_active")
diff --git a/apps/web/core/components/modules/analytics-sidebar/root.tsx b/apps/web/core/components/modules/analytics-sidebar/root.tsx
index bd4da3f1715..7c31983fa35 100644
--- a/apps/web/core/components/modules/analytics-sidebar/root.tsx
+++ b/apps/web/core/components/modules/analytics-sidebar/root.tsx
@@ -8,20 +8,21 @@ import { useEffect, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { Controller, useForm } from "react-hook-form";
-import { Info, SquareUser } from "lucide-react";
+import {
+  AddOutline,
+  ChevronDownOutline,
+  ChevronRightOutline,
+  InfoOutline,
+  MembersOutline,
+  StartDateOutline,
+  UserAltOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 import { Disclosure, Transition } from "@headlessui/react";
 import { MODULE_STATUS, EUserPermissions, EUserPermissionsLevel, EEstimateSystem } from "@plane/constants";
 // plane types
 import { useTranslation } from "@plane/i18n";
-import {
-  PlusIcon,
-  MembersPropertyIcon,
-  ModuleStatusIcon,
-  WorkItemsIcon,
-  StartDatePropertyIcon,
-  ChevronDownIcon,
-  ChevronRightIcon,
-} from "@plane/propel/icons";
+import { ModuleStatusIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { ILinkDetails, IModule, ModuleLink } from "@plane/types";
 // plane ui
@@ -189,7 +190,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
               className="flex h-5 w-5 items-center justify-center rounded-full bg-layer-3"
               onClick={() => handleClose()}
             >
-              <ChevronRightIcon className="h-3 w-3 stroke-2 text-on-color" />
+              <ChevronRightOutline className="h-3 w-3 text-on-color" />
             </button>
           </div>
         </div>
@@ -246,7 +247,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
         <div className="flex flex-col gap-5 pt-2.5 pb-6">
           <div className="flex items-center justify-start gap-1">
             <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-              <StartDatePropertyIcon className="h-4 w-4" />
+              <StartDateOutline className="h-4 w-4" />
               <span className="text-14">{t("date_range")}</span>
             </div>
             <div className="h-7">
@@ -288,7 +289,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
           </div>
           <div className="flex items-center justify-start gap-1">
             <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-              <SquareUser className="h-4 w-4" />
+              <UserAltOutline className="h-4 w-4" />
               <span className="text-14">{t("lead")}</span>
             </div>
             <Controller
@@ -306,7 +307,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
                     buttonVariant="background-with-text"
                     placeholder={t("lead")}
                     disabled={!isEditingAllowed || isArchived}
-                    icon={SquareUser}
+                    icon={UserAltOutline}
                   />
                 </div>
               )}
@@ -314,7 +315,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
           </div>
           <div className="flex items-center justify-start gap-1">
             <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-              <MembersPropertyIcon className="h-4 w-4" />
+              <MembersOutline className="h-4 w-4" />
               <span className="text-14">{t("members")}</span>
             </div>
             <Controller
@@ -339,7 +340,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
           </div>
           <div className="flex items-center justify-start gap-1">
             <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-              <WorkItemsIcon className="h-4 w-4" />
+              <WorkItemsOutline className="h-4 w-4" />
               <span className="text-14">{t("issues")}</span>
             </div>
             <div className="flex h-7 w-3/5 items-center">
@@ -353,7 +354,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
           {isEstimatePointValid && (
             <div className="flex items-center justify-start gap-1">
               <div className="flex w-2/5 items-center justify-start gap-2 text-tertiary">
-                <WorkItemsIcon className="h-4 w-4" />
+                <WorkItemsOutline className="h-4 w-4" />
                 <span className="text-14">{t("points")}</span>
               </div>
               <div className="flex h-7 w-3/5 items-center">
@@ -382,7 +383,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
                       <span className="font-medium text-secondary">{t("common.links")}</span>
                     </div>
                     <div className="flex items-center gap-2.5">
-                      <ChevronDownIcon
+                      <ChevronDownOutline
                         className={`h-3.5 w-3.5 ${open ? "rotate-180 transform" : ""}`}
                         aria-hidden="true"
                       />
@@ -399,7 +400,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
                                   className="flex items-center gap-1.5 text-13 font-medium text-accent-primary"
                                   onClick={() => setModuleLinkModal(true)}
                                 >
-                                  <PlusIcon className="h-3 w-3" />
+                                  <AddOutline className="h-3 w-3" />
                                   {t("add_link")}
                                 </button>
                               </div>
@@ -417,7 +418,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
                         ) : (
                           <div className="flex items-center justify-between gap-2">
                             <div className="flex items-center gap-2">
-                              <Info className="h-3.5 w-3.5 stroke-[1.5] text-tertiary" />
+                              <InfoOutline className="h-3.5 w-3.5 stroke-[1.5] text-tertiary" />
                               <span className="p-0.5 text-11 text-tertiary">{t("common.no_links_added_yet")}</span>
                             </div>
                             {isEditingAllowed && !isArchived && (
@@ -425,7 +426,7 @@ export const ModuleAnalyticsSidebar = observer(function ModuleAnalyticsSidebar(p
                                 className="flex items-center gap-1.5 text-13 font-medium text-accent-primary"
                                 onClick={() => setModuleLinkModal(true)}
                               >
-                                <PlusIcon className="h-3 w-3" />
+                                <AddOutline className="h-3 w-3" />
                                 {t("add_link")}
                               </button>
                             )}
diff --git a/apps/web/core/components/modules/applied-filters/date.tsx b/apps/web/core/components/modules/applied-filters/date.tsx
index 1169f2aeaf1..221a543bd29 100644
--- a/apps/web/core/components/modules/applied-filters/date.tsx
+++ b/apps/web/core/components/modules/applied-filters/date.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // icons
 import { DATE_AFTER_FILTER_OPTIONS } from "@plane/constants";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { renderFormattedDate, capitalizeFirstLetter } from "@plane/utils";
 // helpers
 // constants
@@ -51,7 +51,7 @@ export const AppliedDateFilters = observer(function AppliedDateFilters(props: Pr
               className="grid place-items-center text-tertiary hover:text-secondary"
               onClick={() => handleRemove(date)}
             >
-              <CloseIcon height={10} width={10} strokeWidth={2} />
+              <CloseOutline height={10} width={10} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/modules/applied-filters/members.tsx b/apps/web/core/components/modules/applied-filters/members.tsx
index 30c9615cf54..ad001cc489c 100644
--- a/apps/web/core/components/modules/applied-filters/members.tsx
+++ b/apps/web/core/components/modules/applied-filters/members.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Avatar } from "@makeplane/propel/components/avatar";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // helpers
 import { getFileURL } from "@plane/utils";
 // hooks
@@ -47,7 +47,7 @@ export const AppliedMembersFilters = observer(function AppliedMembersFilters(pro
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(memberId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/modules/applied-filters/root.tsx b/apps/web/core/components/modules/applied-filters/root.tsx
index 5852f4b6ecc..e2db827ad32 100644
--- a/apps/web/core/components/modules/applied-filters/root.tsx
+++ b/apps/web/core/components/modules/applied-filters/root.tsx
@@ -6,7 +6,7 @@
 
 import { useTranslation } from "@plane/i18n";
 import { PillButton } from "@makeplane/propel/components/pill";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TModuleDisplayFilters, TModuleFilters } from "@plane/types";
 // components
 import { Header, EHeaderVariant } from "@plane/ui";
@@ -88,7 +88,7 @@ export function ModuleAppliedFiltersList(props: Props) {
                     className="grid place-items-center text-tertiary hover:text-secondary"
                     onClick={() => handleRemoveFilter(filterKey, null)}
                   >
-                    <CloseIcon height={12} width={12} strokeWidth={2} />
+                    <CloseOutline height={12} width={12} />
                   </button>
                 )}
               </div>
@@ -115,7 +115,7 @@ export function ModuleAppliedFiltersList(props: Props) {
                       })
                     }
                   >
-                    <CloseIcon height={10} width={10} strokeWidth={2} />
+                    <CloseOutline height={10} width={10} />
                   </button>
                 )}
               </div>
@@ -128,7 +128,7 @@ export function ModuleAppliedFiltersList(props: Props) {
             size="md"
             variant="outline"
             label={t("common.clear_all")}
-            endIcon={<CloseIcon height={12} width={12} strokeWidth={2} />}
+            endIcon={<CloseOutline height={12} width={12} />}
             onClick={handleClearAllFilters}
           />
         )}
diff --git a/apps/web/core/components/modules/applied-filters/status.tsx b/apps/web/core/components/modules/applied-filters/status.tsx
index 582119fcc1f..7fdfa710e51 100644
--- a/apps/web/core/components/modules/applied-filters/status.tsx
+++ b/apps/web/core/components/modules/applied-filters/status.tsx
@@ -8,7 +8,8 @@ import { observer } from "mobx-react";
 // ui
 import { MODULE_STATUS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon, ModuleStatusIcon } from "@plane/propel/icons";
+import { ModuleStatusIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // constants
 
 type Props = {
@@ -37,7 +38,7 @@ export const AppliedStatusFilters = observer(function AppliedStatusFilters(props
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(status)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/modules/archived-modules/header.tsx b/apps/web/core/components/modules/archived-modules/header.tsx
index 06f52ef0e0c..134bfd4d5db 100644
--- a/apps/web/core/components/modules/archived-modules/header.tsx
+++ b/apps/web/core/components/modules/archived-modules/header.tsx
@@ -8,9 +8,8 @@ import { useCallback, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { ListFilter } from "lucide-react";
+import { CloseOutline, FilterOutline, SearchOutline } from "@makeplane/propel/icons";
 import { useOutsideClickDetector } from "@plane/hooks";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
 // plane helpers
 // types
 import type { TModuleFilters } from "@plane/types";
@@ -96,7 +95,7 @@ export const ArchivedModulesHeader = observer(function ArchivedModulesHeader() {
               inputRef.current?.focus();
             }}
           >
-            <SearchIcon className="h-3.5 w-3.5" />
+            <SearchOutline className="h-3.5 w-3.5" />
           </button>
         )}
         <div
@@ -107,7 +106,7 @@ export const ArchivedModulesHeader = observer(function ArchivedModulesHeader() {
             }
           )}
         >
-          <SearchIcon className="h-3.5 w-3.5" />
+          <SearchOutline className="h-3.5 w-3.5" />
           <input
             ref={inputRef}
             className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -125,7 +124,7 @@ export const ArchivedModulesHeader = observer(function ArchivedModulesHeader() {
                 setIsSearchOpen(false);
               }}
             >
-              <CloseIcon className="h-3 w-3" />
+              <CloseOutline className="h-3 w-3" />
             </button>
           )}
         </div>
@@ -139,7 +138,7 @@ export const ArchivedModulesHeader = observer(function ArchivedModulesHeader() {
           }}
         />
         <FiltersDropdown
-          icon={<ListFilter className="h-3 w-3" />}
+          icon={<FilterOutline className="h-3 w-3" />}
           title="Filters"
           placement="bottom-end"
           isFiltersApplied={isFiltersApplied}
diff --git a/apps/web/core/components/modules/dropdowns/filters/root.tsx b/apps/web/core/components/modules/dropdowns/filters/root.tsx
index d2169b7fa73..857ea730028 100644
--- a/apps/web/core/components/modules/dropdowns/filters/root.tsx
+++ b/apps/web/core/components/modules/dropdowns/filters/root.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import type { TModuleStatus } from "@plane/propel/icons";
 // plane imports
-import { CloseIcon, SearchIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import type { TModuleDisplayFilters, TModuleFilters } from "@plane/types";
 // components
 import { FilterOption } from "@/components/issues/issue-layouts/filters";
@@ -43,7 +43,7 @@ export const ModuleFiltersSelection = observer(function ModuleFiltersSelection(p
     <div className="flex h-full w-full flex-col overflow-hidden">
       <div className="bg-surface-1 p-2.5 pb-0">
         <div className="flex items-center gap-1.5 rounded-sm border-[0.5px] border-subtle bg-surface-2 px-1.5 py-1 text-11">
-          <SearchIcon className="text-placeholder" width={12} height={12} strokeWidth={2} />
+          <SearchOutline className="text-placeholder" width={12} height={12} />
           <input
             type="text"
             className="w-full bg-surface-2 outline-none placeholder:text-placeholder"
@@ -54,7 +54,7 @@ export const ModuleFiltersSelection = observer(function ModuleFiltersSelection(p
           />
           {filtersSearchQuery !== "" && (
             <button type="button" className="grid place-items-center" onClick={() => setFiltersSearchQuery("")}>
-              <CloseIcon className="text-tertiary" height={12} width={12} strokeWidth={2} />
+              <CloseOutline className="text-tertiary" height={12} width={12} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/modules/dropdowns/order-by.tsx b/apps/web/core/components/modules/dropdowns/order-by.tsx
index b33cf62cd37..cc64d76f25b 100644
--- a/apps/web/core/components/modules/dropdowns/order-by.tsx
+++ b/apps/web/core/components/modules/dropdowns/order-by.tsx
@@ -4,11 +4,10 @@
  * See the LICENSE file for details.
  */
 
-import { ArrowDownWideNarrow, ArrowUpWideNarrow } from "lucide-react";
+import { ChevronDownOutline, SortAscendingOutline, SortDescendingOutline, TickOutline } from "@makeplane/propel/icons";
 import { MODULE_ORDER_BY_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { getButtonStyling } from "@plane/propel/button";
-import { CheckIcon, ChevronDownIcon } from "@plane/propel/icons";
 import type { TModuleOrderByOptions } from "@plane/types";
 // ui
 import { CustomMenu } from "@plane/ui";
@@ -36,9 +35,9 @@ export function ModuleOrderByDropdown(props: Props) {
     <CustomMenu
       customButton={
         <div className={cn(getButtonStyling("secondary", "lg"), "px-2 text-tertiary")}>
-          {!isDescending ? <ArrowUpWideNarrow className="size-3" /> : <ArrowDownWideNarrow className="size-3" />}
+          {!isDescending ? <SortAscendingOutline className="size-3" /> : <SortDescendingOutline className="size-3" />}
           {orderByDetails && t(orderByDetails?.i18n_label)}
-          <ChevronDownIcon className="size-3" strokeWidth={2} />
+          <ChevronDownOutline className="size-3" />
         </div>
       }
       placement="bottom-end"
@@ -55,7 +54,7 @@ export function ModuleOrderByDropdown(props: Props) {
           }}
         >
           {t(option.i18n_label)}
-          {value?.includes(option.key) && <CheckIcon className="h-3 w-3" />}
+          {value?.includes(option.key) && <TickOutline className="h-3 w-3" />}
         </CustomMenu.MenuItem>
       ))}
       {!isManual && (
@@ -68,7 +67,7 @@ export function ModuleOrderByDropdown(props: Props) {
             }}
           >
             Ascending
-            {!isDescending && <CheckIcon className="h-3 w-3" />}
+            {!isDescending && <TickOutline className="h-3 w-3" />}
           </CustomMenu.MenuItem>
           <CustomMenu.MenuItem
             className="flex items-center justify-between gap-2"
@@ -77,7 +76,7 @@ export function ModuleOrderByDropdown(props: Props) {
             }}
           >
             Descending
-            {isDescending && <CheckIcon className="h-3 w-3" />}
+            {isDescending && <TickOutline className="h-3 w-3" />}
           </CustomMenu.MenuItem>
         </>
       )}
diff --git a/apps/web/core/components/modules/links/list-item.tsx b/apps/web/core/components/modules/links/list-item.tsx
index b2c4e908de6..3bf9367547f 100644
--- a/apps/web/core/components/modules/links/list-item.tsx
+++ b/apps/web/core/components/modules/links/list-item.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 
-import { CopyIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
+import { CopyOutline, DeleteOutline, EditOutline } from "@makeplane/propel/icons";
 // plane types
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -72,7 +72,7 @@ export const ModulesLinksListItem = observer(function ModulesLinksListItem(props
                 handleEditLink();
               }}
             >
-              <EditIcon className="size-3 stroke-[1.5]" />
+              <EditOutline className="size-3 stroke-[1.5]" />
             </button>
           )}
           <button
@@ -80,7 +80,7 @@ export const ModulesLinksListItem = observer(function ModulesLinksListItem(props
             onClick={() => copyToClipboard(link.url)}
             className="grid place-items-center rounded-sm p-1 text-secondary hover:bg-layer-transparent-hover"
           >
-            <CopyIcon className="size-3 stroke-[1.5]" />
+            <CopyOutline className="size-3 stroke-[1.5]" />
           </button>
           {isEditingAllowed && (
             <button
@@ -92,7 +92,7 @@ export const ModulesLinksListItem = observer(function ModulesLinksListItem(props
                 handleDeleteLink();
               }}
             >
-              <TrashIcon className="size-3 stroke-[1.5]" />
+              <DeleteOutline className="size-3 stroke-[1.5]" />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/modules/module-card-item.tsx b/apps/web/core/components/modules/module-card-item.tsx
index fa49471f530..f657d6645df 100644
--- a/apps/web/core/components/modules/module-card-item.tsx
+++ b/apps/web/core/components/modules/module-card-item.tsx
@@ -9,12 +9,11 @@ import React, { useRef } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
 import { useParams, usePathname, useSearchParams } from "next/navigation";
-import { Info, SquareUser } from "lucide-react";
+import { InfoOutline, UserAltOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 // plane package imports
 import { MODULE_STATUS, EUserPermissions, EUserPermissionsLevel, IS_FAVORITE_MENU_OPEN } from "@plane/constants";
 import { useLocalStorage } from "@plane/hooks";
 import { LinearProgress } from "@makeplane/propel/components/linear-progress";
-import { WorkItemsIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setPromiseToast, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IModule } from "@plane/types";
@@ -190,7 +189,7 @@ export const ModuleCardItem = observer(function ModuleCardItem(props: Props) {
                   />
                 )}
                 <button onClick={openModuleOverview}>
-                  <Info className="h-4 w-4 text-placeholder" />
+                  <InfoOutline className="h-4 w-4 text-placeholder" />
                 </button>
               </div>
             </div>
@@ -198,7 +197,7 @@ export const ModuleCardItem = observer(function ModuleCardItem(props: Props) {
           <div className="flex flex-col gap-3">
             <div className="flex items-center justify-between">
               <div className="flex items-center gap-1.5 text-secondary">
-                <WorkItemsIcon className="h-4 w-4 text-tertiary" />
+                <WorkItemsOutline className="h-4 w-4 text-tertiary" />
                 <span className="text-11 text-tertiary">{issueCount ?? "0 Work item"}</span>
               </div>
               {moduleLeadDetails ? (
@@ -207,7 +206,7 @@ export const ModuleCardItem = observer(function ModuleCardItem(props: Props) {
                 </span>
               ) : (
                 <Tooltip label="No lead">
-                  <SquareUser className="mx-1 h-4 w-4 text-tertiary" />
+                  <UserAltOutline className="mx-1 h-4 w-4 text-tertiary" />
                 </Tooltip>
               )}
             </div>
diff --git a/apps/web/core/components/modules/module-layout-icon.tsx b/apps/web/core/components/modules/module-layout-icon.tsx
index d7cbfef7614..498bfaeac37 100644
--- a/apps/web/core/components/modules/module-layout-icon.tsx
+++ b/apps/web/core/components/modules/module-layout-icon.tsx
@@ -5,7 +5,7 @@
  */
 
 import * as React from "react";
-import { TimelineLayoutIcon, GridLayoutIcon, ListLayoutIcon } from "@plane/propel/icons";
+import { GridOutline, ListOutline, TimelineOutline } from "@makeplane/propel/icons";
 import type { TModuleLayoutOptions } from "@plane/types";
 import { cn } from "@plane/utils";
 
@@ -22,9 +22,9 @@ export function ModuleLayoutIcon(props: ILayoutIcon) {
 
   // get Layout icon
   const icons = {
-    list: ListLayoutIcon,
-    board: GridLayoutIcon,
-    gantt: TimelineLayoutIcon,
+    list: ListOutline,
+    board: GridOutline,
+    gantt: TimelineOutline,
   };
   const Icon = icons[layoutType ?? "list"];
 
diff --git a/apps/web/core/components/modules/module-list-item-action.tsx b/apps/web/core/components/modules/module-list-item-action.tsx
index c4874385ebc..34c9f8db567 100644
--- a/apps/web/core/components/modules/module-list-item-action.tsx
+++ b/apps/web/core/components/modules/module-list-item-action.tsx
@@ -7,7 +7,7 @@
 import React from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { SquareUser } from "lucide-react";
+import { UserAltOutline } from "@makeplane/propel/icons";
 // Plane imports
 import { MODULE_STATUS, EUserPermissions, EUserPermissionsLevel, IS_FAVORITE_MENU_OPEN } from "@plane/constants";
 import { useLocalStorage } from "@plane/hooks";
@@ -167,7 +167,7 @@ export const ModuleListItemAction = observer(function ModuleListItemAction(props
         </span>
       ) : (
         <Tooltip label="No lead">
-          <SquareUser className="h-4 w-4 text-tertiary" />
+          <UserAltOutline className="h-4 w-4 text-tertiary" />
         </Tooltip>
       )}
 
diff --git a/apps/web/core/components/modules/module-list-item.tsx b/apps/web/core/components/modules/module-list-item.tsx
index 871abc73cc8..cf0e0c868bb 100644
--- a/apps/web/core/components/modules/module-list-item.tsx
+++ b/apps/web/core/components/modules/module-list-item.tsx
@@ -8,8 +8,7 @@ import React, { useRef } from "react";
 import { observer } from "mobx-react";
 import { useParams, usePathname, useSearchParams } from "next/navigation";
 // icons
-import { Info } from "lucide-react";
-import { CheckIcon } from "@plane/propel/icons";
+import { InfoOutline, TickOutline } from "@makeplane/propel/icons";
 // ui
 import { CircularProgress } from "@makeplane/propel/components/circular-progress";
 // components
@@ -88,12 +87,12 @@ export const ModuleListItem = observer(function ModuleListItem(props: Props) {
           <div className="pointer-events-none absolute inset-0 flex items-center justify-center">
             {completedModuleCheck ? (
               progress === 100 ? (
-                <CheckIcon className="h-3 w-3 stroke-[2] text-accent-primary" />
+                <TickOutline className="h-3 w-3 stroke-[2] text-accent-primary" />
               ) : (
                 <span className="text-13 text-accent-primary">{`!`}</span>
               )
             ) : progress === 100 ? (
-              <CheckIcon className="h-3 w-3 stroke-[2] text-accent-primary" />
+              <TickOutline className="h-3 w-3 stroke-[2] text-accent-primary" />
             ) : (
               <span className="text-9 text-tertiary">{`${progress}%`}</span>
             )}
@@ -105,7 +104,7 @@ export const ModuleListItem = observer(function ModuleListItem(props: Props) {
           onClick={openModuleOverview}
           className={`z-[5] flex-shrink-0 ${isMobile ? "flex" : "hidden group-hover:flex"}`}
         >
-          <Info className="h-4 w-4 text-placeholder" />
+          <InfoOutline className="h-4 w-4 text-placeholder" />
         </button>
       }
       actionableItems={<ModuleListItemAction moduleId={moduleId} moduleDetails={moduleDetails} parentRef={parentRef} />}
diff --git a/apps/web/core/components/modules/module-view-header.tsx b/apps/web/core/components/modules/module-view-header.tsx
index e911efc36b7..9f20e1efe90 100644
--- a/apps/web/core/components/modules/module-view-header.tsx
+++ b/apps/web/core/components/modules/module-view-header.tsx
@@ -7,13 +7,12 @@
 import React, { useCallback, useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ListFilter } from "lucide-react";
+import { CloseOutline, FilterOutline, SearchOutline } from "@makeplane/propel/icons";
 // plane helpers
 import { MODULE_VIEW_LAYOUTS } from "@plane/constants";
 import { useOutsideClickDetector } from "@plane/hooks";
 // types
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TModuleFilters } from "@plane/types";
 // ui
@@ -110,7 +109,7 @@ export const ModuleViewHeader = observer(function ModuleViewHeader() {
               setIsSearchOpen(true);
               inputRef.current?.focus();
             }}
-            icon={SearchIcon}
+            icon={SearchOutline}
           />
         )}
         <div
@@ -121,7 +120,7 @@ export const ModuleViewHeader = observer(function ModuleViewHeader() {
             }
           )}
         >
-          <SearchIcon className="h-3.5 w-3.5" />
+          <SearchOutline className="h-3.5 w-3.5" />
           <input
             ref={inputRef}
             className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -139,7 +138,7 @@ export const ModuleViewHeader = observer(function ModuleViewHeader() {
                 setIsSearchOpen(false);
               }}
             >
-              <CloseIcon className="h-3 w-3" />
+              <CloseOutline className="h-3 w-3" />
             </button>
           )}
         </div>
@@ -154,7 +153,7 @@ export const ModuleViewHeader = observer(function ModuleViewHeader() {
         }}
       />
       <FiltersDropdown
-        icon={<ListFilter className="h-3 w-3" />}
+        icon={<FilterOutline className="h-3 w-3" />}
         title="Filters"
         placement="bottom-end"
         isFiltersApplied={isFiltersApplied}
diff --git a/apps/web/core/components/modules/quick-actions.tsx b/apps/web/core/components/modules/quick-actions.tsx
index 8137d288e60..ae112bf7e50 100644
--- a/apps/web/core/components/modules/quick-actions.tsx
+++ b/apps/web/core/components/modules/quick-actions.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { MoreHorizontal } from "lucide-react";
+import { MoreHorizontalOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { IconButton } from "@plane/propel/icon-button";
@@ -135,7 +135,7 @@ export const ModuleQuickActions = observer(function ModuleQuickActions(props: Pr
       )}
       <ContextMenu parentRef={parentRef} items={CONTEXT_MENU_ITEMS} />
       <CustomMenu
-        customButton={<IconButton variant="tertiary" size="lg" icon={MoreHorizontal} />}
+        customButton={<IconButton variant="tertiary" size="lg" icon={MoreHorizontalOutline} />}
         placement="bottom-end"
         closeOnSelect
         buttonClassName={customClassName}
diff --git a/apps/web/core/components/modules/select/status.tsx b/apps/web/core/components/modules/select/status.tsx
index e62b59a73f7..8f5817e301a 100644
--- a/apps/web/core/components/modules/select/status.tsx
+++ b/apps/web/core/components/modules/select/status.tsx
@@ -11,7 +11,8 @@ import type { FieldError, Control } from "react-hook-form";
 import { Controller } from "react-hook-form";
 import { MODULE_STATUS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { StatePropertyIcon, ModuleStatusIcon } from "@plane/propel/icons";
+import { ModuleStatusIcon } from "@plane/propel/icons";
+import { StateOutline } from "@makeplane/propel/icons";
 import type { IModule } from "@plane/types";
 // ui
 import { CustomSelect } from "@plane/ui";
@@ -43,7 +44,7 @@ export function ModuleStatusSelect({ control, error, tabIndex }: Props) {
                 {value ? (
                   <ModuleStatusIcon status={value} />
                 ) : (
-                  <StatePropertyIcon className={`h-3 w-3 ${error ? "text-danger-primary" : "text-secondary"}`} />
+                  <StateOutline className={`h-3 w-3 ${error ? "text-danger-primary" : "text-secondary"}`} />
                 )}
                 {(selectedValue && t(selectedValue?.i18n_label)) ?? (
                   <span className={`${error ? "text-danger-primary" : "text-secondary"}`}>Status</span>
diff --git a/apps/web/core/components/modules/sidebar-select/select-status.tsx b/apps/web/core/components/modules/sidebar-select/select-status.tsx
index 541e31592aa..72e034931ee 100644
--- a/apps/web/core/components/modules/sidebar-select/select-status.tsx
+++ b/apps/web/core/components/modules/sidebar-select/select-status.tsx
@@ -11,7 +11,7 @@ import type { Control, UseFormWatch } from "react-hook-form";
 import { Controller } from "react-hook-form";
 import { MODULE_STATUS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { StatePropertyIcon } from "@plane/propel/icons";
+import { StateOutline } from "@makeplane/propel/icons";
 import type { IModule } from "@plane/types";
 // ui
 import { CustomSelect } from "@plane/ui";
@@ -30,7 +30,7 @@ export function SidebarStatusSelect({ control, submitChanges, watch }: Props) {
   return (
     <div className="flex flex-wrap items-center py-2">
       <div className="flex items-center gap-x-2 text-13 sm:basis-1/2">
-        <StatePropertyIcon className="h-4 w-4 flex-shrink-0" />
+        <StateOutline className="h-4 w-4 flex-shrink-0" />
         <p>Status</p>
       </div>
       <div className="sm:basis-1/2">
diff --git a/apps/web/core/components/navigation/app-rail-root.tsx b/apps/web/core/components/navigation/app-rail-root.tsx
index d37068e57f8..a7cd6199e22 100644
--- a/apps/web/core/components/navigation/app-rail-root.tsx
+++ b/apps/web/core/components/navigation/app-rail-root.tsx
@@ -7,9 +7,8 @@
 "use client";
 import { observer } from "mobx-react";
 import { useParams, usePathname } from "next/navigation";
-import { SettingsIcon } from "lucide-react";
+import { SettingsOutline, TickOutline } from "@makeplane/propel/icons";
 import { ContextMenu } from "@plane/propel/context-menu";
-import { CheckIcon } from "@plane/propel/icons";
 import { cn } from "@plane/utils";
 // components
 import { AppSidebarItem } from "@/components/sidebar/sidebar-item";
@@ -53,7 +52,7 @@ export const AppRailRoot = observer(() => {
               <AppSidebarItem
                 item={{
                   label: "Settings",
-                  icon: <SettingsIcon className="size-5" />,
+                  icon: <SettingsOutline className="size-5" />,
                   href: `/${workspaceSlug}/settings`,
                   isActive: isWorkspaceSettingsPath,
                   showLabel,
@@ -67,13 +66,13 @@ export const AppRailRoot = observer(() => {
             <ContextMenu.Item onClick={() => updateDisplayMode("icon_only")}>
               <div className="flex w-full items-center justify-between gap-2">
                 <span className="text-11">Icon only</span>
-                {preferences.displayMode === "icon_only" && <CheckIcon className="size-3.5" />}
+                {preferences.displayMode === "icon_only" && <TickOutline className="size-3.5" />}
               </div>
             </ContextMenu.Item>
             <ContextMenu.Item onClick={() => updateDisplayMode("icon_with_label")}>
               <div className="flex w-full items-center justify-between gap-2">
                 <span className="text-11">Icon with name</span>
-                {preferences.displayMode === "icon_with_label" && <CheckIcon className="size-3.5" />}
+                {preferences.displayMode === "icon_with_label" && <TickOutline className="size-3.5" />}
               </div>
             </ContextMenu.Item>
             <ContextMenu.Separator />
diff --git a/apps/web/core/components/navigation/customize-navigation-dialog.tsx b/apps/web/core/components/navigation/customize-navigation-dialog.tsx
index bb8751fad2c..2682023b337 100644
--- a/apps/web/core/components/navigation/customize-navigation-dialog.tsx
+++ b/apps/web/core/components/navigation/customize-navigation-dialog.tsx
@@ -7,7 +7,7 @@
 import { useCallback, useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { GripVertical, X } from "lucide-react";
+import { CloseOutline, DragDropOutline } from "@makeplane/propel/icons";
 // plane imports
 import { WORKSPACE_SIDEBAR_DYNAMIC_NAVIGATION_ITEMS_LINKS, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -198,7 +198,7 @@ export const CustomizeNavigationDialog = observer(function CustomizeNavigationDi
             className="flex size-5 flex-shrink-0 items-center justify-center rounded-sm text-placeholder hover:bg-layer-1"
             aria-label={t("close")}
           >
-            <X className="size-4" />
+            <CloseOutline className="size-4" />
           </button>
         </div>
 
@@ -215,7 +215,7 @@ export const CustomizeNavigationDialog = observer(function CustomizeNavigationDi
                 id="personal-enabled-items"
                 render={(item) => (
                   <div className="flex items-center gap-2 rounded-md px-2 py-1.5 transition-all duration-200 hover:bg-surface-2">
-                    <GripVertical className="size-4 cursor-grab text-placeholder transition-colors active:cursor-grabbing" />
+                    <DragDropOutline className="size-4 cursor-grab text-placeholder transition-colors active:cursor-grabbing" />
                     <Checkbox
                       checked={!!personalPreferences.items[item.key]?.enabled}
                       onCheckedChange={(checked) => togglePersonalItem(item.key, checked)}
@@ -247,7 +247,7 @@ export const CustomizeNavigationDialog = observer(function CustomizeNavigationDi
                   const icon = getSidebarNavigationItemIcon(item.key);
                   return (
                     <div className="group flex items-center gap-2 rounded-md px-2 py-1.5 transition-all duration-200 hover:bg-surface-2">
-                      <GripVertical className="size-4 cursor-grab text-placeholder transition-colors active:cursor-grabbing" />
+                      <DragDropOutline className="size-4 cursor-grab text-placeholder transition-colors active:cursor-grabbing" />
                       <Checkbox
                         checked={!!workspacePreferences.items[item.key]?.is_pinned}
                         onCheckedChange={(checked) => handleWorkspaceItemToggle(item.key, checked)}
diff --git a/apps/web/core/components/navigation/project-actions-menu.tsx b/apps/web/core/components/navigation/project-actions-menu.tsx
index 40e64d9447b..51b99f63077 100644
--- a/apps/web/core/components/navigation/project-actions-menu.tsx
+++ b/apps/web/core/components/navigation/project-actions-menu.tsx
@@ -6,10 +6,16 @@
 
 import { useState, useRef } from "react";
 import { useNavigate } from "react-router";
-import { LogOut, MoreHorizontal, Settings, Share2, ArchiveIcon } from "lucide-react";
+import {
+  ArchiveOutline,
+  LinkOutline,
+  LogOutOutline,
+  MoreHorizontalOutline,
+  SettingsOutline,
+  ShareAltOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon } from "@plane/propel/icons";
 import { CustomMenu } from "@plane/ui";
 
 type Props = {
@@ -50,7 +56,7 @@ export function ProjectActionsMenu({
           className="grid place-items-center rounded-sm p-0.5 text-placeholder hover:bg-layer-1"
           onClick={() => setIsMenuActive(!isMenuActive)}
         >
-          <MoreHorizontal className="size-4" />
+          <MoreHorizontalOutline className="size-4" />
         </span>
       }
       className="flex-shrink-0"
@@ -66,7 +72,7 @@ export function ProjectActionsMenu({
         <CustomMenu.MenuItem onClick={onPublishModal}>
           <div className="relative flex flex-shrink-0 items-center justify-start gap-2">
             <div className="flex h-4 w-4 cursor-pointer items-center justify-center rounded-sm text-secondary transition-all duration-300 hover:bg-layer-1">
-              <Share2 className="h-3.5 w-3.5 stroke-[1.5]" />
+              <ShareAltOutline className="h-3.5 w-3.5 stroke-[1.5]" />
             </div>
             <div>{t("publish_project")}</div>
           </div>
@@ -74,7 +80,7 @@ export function ProjectActionsMenu({
       )}
       <CustomMenu.MenuItem onClick={onCopyText}>
         <span className="flex items-center justify-start gap-2">
-          <LinkIcon className="h-3.5 w-3.5 stroke-[1.5]" />
+          <LinkOutline className="h-3.5 w-3.5 stroke-[1.5]" />
           <span>{t("copy_link")}</span>
         </span>
       </CustomMenu.MenuItem>
@@ -85,7 +91,7 @@ export function ProjectActionsMenu({
           }}
         >
           <div className="flex cursor-pointer items-center justify-start gap-2">
-            <ArchiveIcon className="h-3.5 w-3.5 stroke-[1.5]" />
+            <ArchiveOutline className="h-3.5 w-3.5 stroke-[1.5]" />
             <span>{t("archives")}</span>
           </div>
         </CustomMenu.MenuItem>
@@ -96,7 +102,7 @@ export function ProjectActionsMenu({
         }}
       >
         <div className="flex cursor-pointer items-center justify-start gap-2">
-          <Settings className="h-3.5 w-3.5 stroke-[1.5]" />
+          <SettingsOutline className="h-3.5 w-3.5 stroke-[1.5]" />
           <span>{t("settings")}</span>
         </div>
       </CustomMenu.MenuItem>
@@ -104,7 +110,7 @@ export function ProjectActionsMenu({
       {!isAuthorized && (
         <CustomMenu.MenuItem onClick={onLeaveProject}>
           <div className="flex items-center justify-start gap-2">
-            <LogOut className="h-3.5 w-3.5 stroke-[1.5]" />
+            <LogOutOutline className="h-3.5 w-3.5 stroke-[1.5]" />
             <span>{t("leave_project")}</span>
           </div>
         </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/navigation/project-header-button.tsx b/apps/web/core/components/navigation/project-header-button.tsx
index 48a78b8e650..bb9c87ba9e2 100644
--- a/apps/web/core/components/navigation/project-header-button.tsx
+++ b/apps/web/core/components/navigation/project-header-button.tsx
@@ -7,7 +7,7 @@
 import type { TPartialProject } from "@plane/types";
 // plane propel imports
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 
 type TProjectHeaderButtonProps = {
@@ -26,7 +26,7 @@ export function ProjectHeaderButton({ project }: TProjectHeaderButtonProps) {
           <div className="pointer-events-none absolute top-0 right-0 bottom-0 flex items-center justify-end opacity-0 transition-opacity duration-200 group-hover:opacity-100">
             <div className="relative flex h-full w-8 items-center justify-end">
               <div className="absolute inset-0 rounded-r bg-gradient-to-r from-transparent to-surface-2" />
-              <ChevronDownIcon className="relative z-10 size-4 text-tertiary" />
+              <ChevronDownOutline className="relative z-10 size-4 text-tertiary" />
             </div>
           </div>
         </div>
diff --git a/apps/web/core/components/navigation/project-header.tsx b/apps/web/core/components/navigation/project-header.tsx
index 172c10f1e6f..e7c7fd24e44 100644
--- a/apps/web/core/components/navigation/project-header.tsx
+++ b/apps/web/core/components/navigation/project-header.tsx
@@ -7,7 +7,7 @@
 import { useCallback, useMemo } from "react";
 import { observer } from "mobx-react";
 // plane imports
-import { ProjectIcon } from "@plane/propel/icons";
+import { ProjectsOutline } from "@makeplane/propel/icons";
 import type { ICustomSearchSelectOption } from "@plane/types";
 import { CustomSearchSelect } from "@plane/ui";
 // hooks
@@ -75,7 +75,7 @@ export const ProjectHeader = observer(function ProjectHeader(props: TProjectHead
               <SwitcherLabel
                 name={project.name}
                 logo_props={project.logo_props}
-                LabelIcon={ProjectIcon}
+                LabelIcon={ProjectsOutline}
                 type="material"
               />
             ),
diff --git a/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx b/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx
index 5b582d58f9e..4375deb72b3 100644
--- a/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx
+++ b/apps/web/core/components/navigation/tab-navigation-overflow-menu.tsx
@@ -6,10 +6,9 @@
 
 import React from "react";
 import { Link } from "react-router";
-import { MoreHorizontal, Pin } from "lucide-react";
+import { DefaultTabOutline, MoreHorizontalOutline, PinOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { SetAsDefaultIcon } from "@plane/propel/icons";
 import { Menu } from "@plane/propel/menu";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { cn } from "@plane/utils";
@@ -40,7 +39,7 @@ export function TabNavigationOverflowMenu({ overflowItems, isActive, tabPreferen
       optionsClassName="min-w-[200px] space-y-1"
       customButton={
         <div className="flex items-center justify-center rounded-md p-1 transition-colors hover:bg-layer-1">
-          <MoreHorizontal className="h-4 w-4 text-secondary" />
+          <MoreHorizontalOutline className="h-4 w-4 text-secondary" />
         </div>
       }
     >
@@ -69,7 +68,7 @@ export function TabNavigationOverflowMenu({ overflowItems, isActive, tabPreferen
                     className="invisible rounded-sm p-1 text-tertiary transition-colors group-hover/menu-item:visible hover:text-primary"
                     title="Show"
                   >
-                    <Pin className="size-3" />
+                    <PinOutline className="size-3" />
                   </button>
                 )}
                 <Tooltip label={isDefault ? "Clear default" : "Set as default"}>
@@ -87,7 +86,7 @@ export function TabNavigationOverflowMenu({ overflowItems, isActive, tabPreferen
                     )}
                     title={isDefault ? "Clear default" : "Set as default"}
                   >
-                    <SetAsDefaultIcon className="size-3" />
+                    <DefaultTabOutline className="size-3" />
                   </button>
                 </Tooltip>
               </div>
diff --git a/apps/web/core/components/navigation/tab-navigation-visible-item.tsx b/apps/web/core/components/navigation/tab-navigation-visible-item.tsx
index dc53b846cdc..3a32d49635a 100644
--- a/apps/web/core/components/navigation/tab-navigation-visible-item.tsx
+++ b/apps/web/core/components/navigation/tab-navigation-visible-item.tsx
@@ -5,11 +5,10 @@
  */
 
 import { Link } from "react-router";
-import { PinOff } from "lucide-react";
+import { DefaultTabOutline, UnpinOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { ContextMenu } from "@plane/propel/context-menu";
-import { SetAsDefaultIcon } from "@plane/propel/icons";
 import { TabNavigationItem } from "@plane/propel/tab-navigation";
 // local imports
 import type { TNavigationItem } from "./tab-navigation-root";
@@ -62,7 +61,7 @@ export function TabNavigationVisibleItem({
                 }}
                 className="flex cursor-pointer items-center gap-2 text-secondary transition-colors"
               >
-                <SetAsDefaultIcon className="size-3 shrink-0" />
+                <DefaultTabOutline className="size-3 shrink-0" />
                 <span className="text-11">{isDefault ? "Clear default" : "Set as default"}</span>
               </ContextMenu.Item>
               <ContextMenu.Item
@@ -72,7 +71,7 @@ export function TabNavigationVisibleItem({
                 }}
                 className="flex cursor-pointer items-center gap-2 text-secondary transition-colors"
               >
-                <PinOff className="size-3 shrink-0" />
+                <UnpinOutline className="size-3 shrink-0" />
                 <span className="text-11">Hide in more menu</span>
               </ContextMenu.Item>
             </ContextMenu.Content>
diff --git a/apps/web/core/components/navigation/top-nav-power-k.tsx b/apps/web/core/components/navigation/top-nav-power-k.tsx
index 22825d4b7e3..9c1a1178783 100644
--- a/apps/web/core/components/navigation/top-nav-power-k.tsx
+++ b/apps/web/core/components/navigation/top-nav-power-k.tsx
@@ -9,7 +9,7 @@ import { Command } from "cmdk";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // hooks
-import { CloseIcon, SearchIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 // power-k
 import type { TPowerKCommandConfig, TPowerKContext } from "@/components/power-k/core/types";
@@ -223,7 +223,7 @@ export const TopNavPowerK = observer(() => {
           onClick={() => inputRef.current?.focus()}
           role="button"
         >
-          <SearchIcon className="mr-2 size-3.5 shrink-0 text-placeholder" />
+          <SearchOutline className="mr-2 size-3.5 shrink-0 text-placeholder" />
           <input
             ref={inputRef}
             type="text"
@@ -240,7 +240,7 @@ export const TopNavPowerK = observer(() => {
           />
           {searchTerm && (
             <button type="button" onClick={handleClear} className="ml-2 shrink-0">
-              <CloseIcon className="size-3.5 text-placeholder hover:text-primary" />
+              <CloseOutline className="size-3.5 text-placeholder hover:text-primary" />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/navigation/top-navigation-root.tsx b/apps/web/core/components/navigation/top-navigation-root.tsx
index 68846c9c518..146977a576a 100644
--- a/apps/web/core/components/navigation/top-navigation-root.tsx
+++ b/apps/web/core/components/navigation/top-navigation-root.tsx
@@ -15,7 +15,7 @@ import { WorkspaceMenuRoot } from "@/components/workspace/sidebar/workspace-menu
 import { useAppRailPreferences } from "@/hooks/use-navigation-preferences";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { AppSidebarItem } from "@/components/sidebar/sidebar-item";
-import { InboxIcon } from "@plane/propel/icons";
+import { InboxOutline } from "@makeplane/propel/icons";
 import useSWR from "swr";
 import { useWorkspaceNotifications } from "@/hooks/store/notifications";
 // local imports
@@ -67,7 +67,7 @@ export const TopNavigationRoot = observer(function TopNavigationRoot() {
               href: `/${workspaceSlug?.toString()}/notifications/`,
               icon: (
                 <div className="relative">
-                  <InboxIcon className="size-5" />
+                  <InboxOutline className="size-5" />
                   {totalNotifications > 0 && (
                     <span className="absolute top-0 right-0 size-2 rounded-full bg-danger-primary" />
                   )}
diff --git a/apps/web/core/components/navigation/use-navigation-items.ts b/apps/web/core/components/navigation/use-navigation-items.ts
index 621d9e3a54f..669ed46be22 100644
--- a/apps/web/core/components/navigation/use-navigation-items.ts
+++ b/apps/web/core/components/navigation/use-navigation-items.ts
@@ -7,7 +7,14 @@
 import { useMemo, useCallback } from "react";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
-import { CycleIcon, IntakeIcon, ModuleIcon, PageIcon, ViewsIcon, WorkItemsIcon } from "@plane/propel/icons";
+import {
+  CyclesOutline,
+  IntakeOutline,
+  ModuleOutline,
+  PagesOutline,
+  ViewsOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 import type { EUserProjectRoles, IPartialProject } from "@plane/types";
 import type { TNavigationItem } from "@/components/navigation/tab-navigation-root";
 
@@ -38,7 +45,7 @@ export const useNavigationItems = ({
         key: "work_items",
         name: "Work items",
         href: `/${workspaceSlug}/projects/${projectId}/issues`,
-        icon: WorkItemsIcon,
+        icon: WorkItemsOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: true,
         sortOrder: 1,
@@ -48,7 +55,7 @@ export const useNavigationItems = ({
         key: "cycles",
         name: "Cycles",
         href: `/${workspaceSlug}/projects/${projectId}/cycles`,
-        icon: CycleIcon,
+        icon: CyclesOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
         shouldRender: !!project?.cycle_view,
         sortOrder: 2,
@@ -58,7 +65,7 @@ export const useNavigationItems = ({
         key: "modules",
         name: "Modules",
         href: `/${workspaceSlug}/projects/${projectId}/modules`,
-        icon: ModuleIcon,
+        icon: ModuleOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
         shouldRender: !!project?.module_view,
         sortOrder: 3,
@@ -68,7 +75,7 @@ export const useNavigationItems = ({
         key: "views",
         name: "Views",
         href: `/${workspaceSlug}/projects/${projectId}/views`,
-        icon: ViewsIcon,
+        icon: ViewsOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: !!project?.issue_views_view,
         sortOrder: 4,
@@ -78,7 +85,7 @@ export const useNavigationItems = ({
         key: "pages",
         name: "Pages",
         href: `/${workspaceSlug}/projects/${projectId}/pages`,
-        icon: PageIcon,
+        icon: PagesOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: !!project?.page_view,
         sortOrder: 5,
@@ -88,7 +95,7 @@ export const useNavigationItems = ({
         key: "intake",
         name: "Intake",
         href: `/${workspaceSlug}/projects/${projectId}/intake`,
-        icon: IntakeIcon,
+        icon: IntakeOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: !!project?.inbox_view,
         sortOrder: 6,
diff --git a/apps/web/core/components/onboarding/create-or-join-workspaces.tsx b/apps/web/core/components/onboarding/create-or-join-workspaces.tsx
index 3fad9e8db65..1f29b30faea 100644
--- a/apps/web/core/components/onboarding/create-or-join-workspaces.tsx
+++ b/apps/web/core/components/onboarding/create-or-join-workspaces.tsx
@@ -6,7 +6,7 @@
 
 import { useEffect, useState } from "react";
 import { observer } from "mobx-react";
-import { OctagonAlert } from "lucide-react";
+import { AlertOctagonOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { IWorkspaceMemberInvitation, TOnboardingSteps } from "@plane/types";
 // components
@@ -76,7 +76,7 @@ export const CreateOrJoinWorkspaces = observer(function CreateOrJoinWorkspaces(p
             ) : (
               <div className="flex h-96 w-full items-center justify-center">
                 <div className="mt-4 flex w-full items-start justify-center gap-2.5 rounded-sm border border-accent-strong/20 bg-accent-primary/10 px-6 py-4 text-13 leading-5 text-accent-secondary">
-                  <OctagonAlert className="mt-1 size-5 flex-shrink-0" />
+                  <AlertOctagonOutline className="mt-1 size-5 flex-shrink-0" />
                   <span>
                     You don&apos;t seem to have any invites to a workspace and your instance admin has restricted
                     creation of new workspaces. Please ask a workspace owner or admin to invite you to a workspace first
diff --git a/apps/web/core/components/onboarding/header.tsx b/apps/web/core/components/onboarding/header.tsx
index d5bea2949bc..4bb35e0be98 100644
--- a/apps/web/core/components/onboarding/header.tsx
+++ b/apps/web/core/components/onboarding/header.tsx
@@ -6,7 +6,8 @@
 
 import { observer } from "mobx-react";
 // plane imports
-import { PlaneLockup, ChevronLeftIcon } from "@plane/propel/icons";
+import { PlaneLockup } from "@plane/propel/icons";
+import { ChevronLeftOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TOnboardingStep } from "@plane/types";
 import { EOnboardingSteps } from "@plane/types";
@@ -80,7 +81,7 @@ export const OnboardingHeader = observer(function OnboardingHeader(props: Onboar
         <div className="flex items-center gap-2.5">
           {canGoBack && (
             <button onClick={handleStepBack} className="cursor-pointer" type="button" disabled={!canGoBack}>
-              <ChevronLeftIcon className="size-6 text-placeholder" />
+              <ChevronLeftOutline className="size-6 text-placeholder" />
             </button>
           )}
           <PlaneLockup height={20} width={95} className="text-primary" />
diff --git a/apps/web/core/components/onboarding/invite-members.tsx b/apps/web/core/components/onboarding/invite-members.tsx
index 3a4d03a78e8..e83e5606a1a 100644
--- a/apps/web/core/components/onboarding/invite-members.tsx
+++ b/apps/web/core/components/onboarding/invite-members.tsx
@@ -17,7 +17,7 @@ import type {
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 // icons
 import { usePopper } from "react-popper";
-import { XCircle } from "lucide-react";
+import { AddOutline, ChevronDownOutline, CloseCircleOutline, TickOutline } from "@makeplane/propel/icons";
 import { Listbox } from "@headlessui/react";
 // plane imports
 import { Field } from "@makeplane/propel/components/field";
@@ -27,7 +27,6 @@ import { ROLE, ROLE_DETAILS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // types
 import { Button } from "@plane/propel/button";
-import { PlusIcon, CheckIcon, ChevronDownIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { IUser, IWorkspace } from "@plane/types";
 // ui
@@ -204,9 +203,9 @@ const InviteMemberInput = observer(function InviteMemberInput(props: InviteMembe
                     {ROLE[value]}
                   </span>
 
-                  <ChevronDownIcon
+                  <ChevronDownOutline
                     className={`size-3 ${
-                      !getValues(`emails.${index}.role_active`) ? "stroke-placeholder" : "stroke-primary"
+                      !getValues(`emails.${index}.role_active`) ? "text-placeholder" : "text-primary"
                     }`}
                   />
                 </Listbox.Button>
@@ -235,7 +234,7 @@ const InviteMemberInput = observer(function InviteMemberInput(props: InviteMembe
                               <div className="text-13 font-medium">{t(value.i18n_title)}</div>
                               <div className="flex text-11 text-tertiary">{t(value.i18n_description)}</div>
                             </div>
-                            {selected && <CheckIcon className="h-4 w-4 shrink-0" />}
+                            {selected && <TickOutline className="h-4 w-4 shrink-0" />}
                           </div>
                         )}
                       </Listbox.Option>
@@ -252,7 +251,7 @@ const InviteMemberInput = observer(function InviteMemberInput(props: InviteMembe
             className="absolute right-0 hidden place-items-center self-center rounded-sm group-hover:grid"
             onClick={() => remove(index)}
           >
-            <XCircle className="h-5 w-5 pl-0.5 text-placeholder" />
+            <CloseCircleOutline className="h-5 w-5 pl-0.5 text-placeholder" />
           </button>
         )}
       </div>
@@ -383,7 +382,7 @@ export function InviteMembers(props: Props) {
                 className="mx-8 flex items-center gap-1.5 bg-transparent text-13 font-medium text-accent-primary outline-accent-strong"
                 onClick={appendField}
               >
-                <PlusIcon className="h-4 w-4" strokeWidth={2} />
+                <AddOutline className="h-4 w-4" />
                 Add another
               </button>
             </div>
diff --git a/apps/web/core/components/onboarding/profile-setup.tsx b/apps/web/core/components/onboarding/profile-setup.tsx
index e02f934be8b..d789d195ef9 100644
--- a/apps/web/core/components/onboarding/profile-setup.tsx
+++ b/apps/web/core/components/onboarding/profile-setup.tsx
@@ -7,7 +7,7 @@
 import { useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
-import { Eye, EyeOff } from "lucide-react";
+import { HideOutline, ShowOutline } from "@makeplane/propel/icons";
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { E_PASSWORD_STRENGTH } from "@plane/constants";
@@ -409,9 +409,9 @@ export const ProfileSetup = observer(function ProfileSetup(props: Props) {
                               onClick={() => handleShowPassword("password")}
                             >
                               {showPassword.password ? (
-                                <EyeOff className="size-4 stroke-placeholder" />
+                                <HideOutline className="size-4 text-placeholder" />
                               ) : (
-                                <Eye className="size-4 stroke-placeholder" />
+                                <ShowOutline className="size-4 text-placeholder" />
                               )}
                             </button>
                           </InputGroup>
@@ -452,9 +452,9 @@ export const ProfileSetup = observer(function ProfileSetup(props: Props) {
                               onClick={() => handleShowPassword("retypePassword")}
                             >
                               {showPassword.retypePassword ? (
-                                <EyeOff className="size-4 stroke-placeholder" />
+                                <HideOutline className="size-4 text-placeholder" />
                               ) : (
-                                <Eye className="size-4 stroke-placeholder" />
+                                <ShowOutline className="size-4 text-placeholder" />
                               )}
                             </button>
                           </InputGroup>
diff --git a/apps/web/core/components/onboarding/steps/profile/consent.tsx b/apps/web/core/components/onboarding/steps/profile/consent.tsx
index 18f42063c8f..d6483c780df 100644
--- a/apps/web/core/components/onboarding/steps/profile/consent.tsx
+++ b/apps/web/core/components/onboarding/steps/profile/consent.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 
 type Props = {
   isChecked: boolean;
@@ -21,7 +21,7 @@ export function MarketingConsent({ isChecked, handleChange }: Props) {
           isChecked ? "border-accent-strong bg-accent-primary" : "border-strong"
         }`}
       >
-        {isChecked && <CheckIcon className="h-3 w-3 text-on-color" />}
+        {isChecked && <TickOutline className="h-3 w-3 text-on-color" />}
       </button>
       <span className="text-13 text-tertiary">I agree to Plane marketing communications</span>
     </div>
diff --git a/apps/web/core/components/onboarding/steps/profile/root.tsx b/apps/web/core/components/onboarding/steps/profile/root.tsx
index 5e71c802f3b..1b165d40bdf 100644
--- a/apps/web/core/components/onboarding/steps/profile/root.tsx
+++ b/apps/web/core/components/onboarding/steps/profile/root.tsx
@@ -7,7 +7,7 @@
 import { useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
-import { ImageIcon } from "lucide-react";
+import { ImageOutline } from "@makeplane/propel/icons";
 // plane imports
 import { E_PASSWORD_STRENGTH } from "@plane/constants";
 import { Button } from "@plane/propel/button";
@@ -189,7 +189,7 @@ export const ProfileSetupStep = observer(function ProfileSetupStep({ handleStepC
           type="button"
           onClick={() => setIsImageUploadModalOpen(true)}
         >
-          <ImageIcon className="size-4" />
+          <ImageOutline className="size-4" />
           <span className="text-13">{userAvatar ? "Change image" : "Upload image"}</span>
         </button>
       </div>
diff --git a/apps/web/core/components/onboarding/steps/profile/set-password.tsx b/apps/web/core/components/onboarding/steps/profile/set-password.tsx
index 95421e2b391..3851f59f451 100644
--- a/apps/web/core/components/onboarding/steps/profile/set-password.tsx
+++ b/apps/web/core/components/onboarding/steps/profile/set-password.tsx
@@ -5,7 +5,7 @@
  */
 
 import React, { useState, useCallback, useMemo } from "react";
-import { LockIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, LockOutline } from "@makeplane/propel/icons";
 import { PasswordInput, PasswordStrengthIndicator } from "@plane/ui";
 import { cn } from "@plane/utils";
 
@@ -86,12 +86,12 @@ export function SetPasswordRoot({ onPasswordChange, onConfirmPasswordChange, dis
         onClick={handleToggleExpand}
       >
         <div className="flex items-center gap-1 text-tertiary">
-          <LockIcon className="size-3" />
+          <LockOutline className="size-3" />
           <span className="font-medium">Set a password</span>
           <span>{`(Optional)`}</span>
         </div>
         <div className="flex items-center gap-2 text-placeholder">
-          <ChevronDownIcon className={chevronIconClasses} />
+          <ChevronDownOutline className={chevronIconClasses} />
         </div>
       </div>
 
diff --git a/apps/web/core/components/onboarding/steps/role/root.tsx b/apps/web/core/components/onboarding/steps/role/root.tsx
index 43029d1cfdb..cf542f1782f 100644
--- a/apps/web/core/components/onboarding/steps/role/root.tsx
+++ b/apps/web/core/components/onboarding/steps/role/root.tsx
@@ -6,10 +6,17 @@
 
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
-import { Box, PenTool, Rocket, Monitor, RefreshCw } from "lucide-react";
+import { PenTool } from "lucide-react";
+import {
+  CubeOutline,
+  MonitorOutline,
+  RefreshOutline,
+  RocketOutline,
+  TickOutline,
+  ViewsOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { Button } from "@plane/propel/button";
-import { CheckIcon, ViewsIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TUserProfile } from "@plane/types";
 import { EOnboardingSteps } from "@plane/types";
@@ -24,13 +31,13 @@ type Props = {
 };
 
 const ROLES = [
-  { id: "product-manager", label: "Product Manager", icon: Box },
-  { id: "engineering-manager", label: "Engineering Manager", icon: ViewsIcon },
+  { id: "product-manager", label: "Product Manager", icon: CubeOutline },
+  { id: "engineering-manager", label: "Engineering Manager", icon: ViewsOutline },
   { id: "designer", label: "Designer", icon: PenTool },
-  { id: "developer", label: "Developer", icon: Monitor },
-  { id: "founder-executive", label: "Founder/Executive", icon: Rocket },
-  { id: "operations-manager", label: "Operations Manager", icon: RefreshCw },
-  { id: "others", label: "Others", icon: Box },
+  { id: "developer", label: "Developer", icon: MonitorOutline },
+  { id: "founder-executive", label: "Founder/Executive", icon: RocketOutline },
+  { id: "operations-manager", label: "Operations Manager", icon: RefreshOutline },
+  { id: "others", label: "Others", icon: CubeOutline },
 ];
 
 const defaultValues = {
@@ -131,7 +138,7 @@ export const RoleSetupStep = observer(function RoleSetupStep({ handleStepChange
                         <button
                           className={`border-blue-500 flex size-4 items-center justify-center rounded-sm border-2 bg-accent-primary`}
                         >
-                          <CheckIcon className="h-3 w-3 text-on-color" />
+                          <TickOutline className="h-3 w-3 text-on-color" />
                         </button>
                       </>
                     )}
diff --git a/apps/web/core/components/onboarding/steps/team/root.tsx b/apps/web/core/components/onboarding/steps/team/root.tsx
index b5fb4bd0b65..77b08093e0c 100644
--- a/apps/web/core/components/onboarding/steps/team/root.tsx
+++ b/apps/web/core/components/onboarding/steps/team/root.tsx
@@ -16,7 +16,7 @@ import type {
 } from "react-hook-form";
 import { Controller, useFieldArray, useForm } from "react-hook-form";
 import { usePopper } from "react-popper";
-import { XCircle } from "lucide-react";
+import { AddOutline, ChevronDownOutline, CloseCircleOutline, TickOutline } from "@makeplane/propel/icons";
 import { Listbox } from "@headlessui/react";
 // plane imports
 import { Field } from "@makeplane/propel/components/field";
@@ -25,7 +25,6 @@ import type { EUserPermissions } from "@plane/constants";
 import { ROLE, ROLE_DETAILS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { PlusIcon, CheckIcon, ChevronDownIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EOnboardingSteps } from "@plane/types";
 import { Spinner } from "@plane/ui";
@@ -200,9 +199,9 @@ const InviteMemberInput = observer(function InviteMemberInput(props: InviteMembe
                     {ROLE[value]}
                   </span>
 
-                  <ChevronDownIcon
+                  <ChevronDownOutline
                     className={`size-3 ${
-                      !getValues(`emails.${index}.role_active`) ? "stroke-placeholder" : "stroke-primary"
+                      !getValues(`emails.${index}.role_active`) ? "text-placeholder" : "text-primary"
                     }`}
                   />
                 </Listbox.Button>
@@ -231,7 +230,7 @@ const InviteMemberInput = observer(function InviteMemberInput(props: InviteMembe
                               <div className="text-13 font-medium">{t(value.i18n_title)}</div>
                               <div className="flex text-11 text-tertiary">{t(value.i18n_description)}</div>
                             </div>
-                            {selected && <CheckIcon className="h-4 w-4 shrink-0" />}
+                            {selected && <TickOutline className="h-4 w-4 shrink-0" />}
                           </div>
                         )}
                       </Listbox.Option>
@@ -248,7 +247,7 @@ const InviteMemberInput = observer(function InviteMemberInput(props: InviteMembe
             className="absolute right-0 hidden place-items-center self-center rounded-sm group-hover:grid"
             onClick={() => remove(index)}
           >
-            <XCircle className="h-5 w-5 pl-0.5 text-placeholder" />
+            <CloseCircleOutline className="h-5 w-5 pl-0.5 text-placeholder" />
           </button>
         )}
       </div>
@@ -378,7 +377,7 @@ export const InviteTeamStep = observer(function InviteTeamStep(props: Props) {
           className="mx-8 flex items-center gap-1.5 bg-transparent text-13 font-medium text-accent-primary outline-accent-strong"
           onClick={appendField}
         >
-          <PlusIcon className="h-4 w-4" strokeWidth={2} />
+          <AddOutline className="h-4 w-4" />
           Add another
         </button>
       </div>
diff --git a/apps/web/core/components/onboarding/steps/usecase/root.tsx b/apps/web/core/components/onboarding/steps/usecase/root.tsx
index 8908adaf3b4..4f4b2ef4aeb 100644
--- a/apps/web/core/components/onboarding/steps/usecase/root.tsx
+++ b/apps/web/core/components/onboarding/steps/usecase/root.tsx
@@ -9,7 +9,7 @@ import { Controller, useForm } from "react-hook-form";
 // plane imports
 import { USE_CASES } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TUserProfile } from "@plane/types";
 import { EOnboardingSteps } from "@plane/types";
@@ -130,7 +130,7 @@ export const UseCaseSetupStep = observer(function UseCaseSetupStep({ handleStepC
                         "border-strong": !isSelected,
                       })}
                     >
-                      <CheckIcon
+                      <TickOutline
                         className={cn("h-3 w-3 text-on-color", {
                           "opacity-100": isSelected,
                           "opacity-0": !isSelected,
diff --git a/apps/web/core/components/onboarding/steps/workspace/create.tsx b/apps/web/core/components/onboarding/steps/workspace/create.tsx
index f9c32a91f26..9d2bcf030ac 100644
--- a/apps/web/core/components/onboarding/steps/workspace/create.tsx
+++ b/apps/web/core/components/onboarding/steps/workspace/create.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
-import { CircleCheck } from "lucide-react";
+import { TickCircleOutline } from "@makeplane/propel/icons";
 // plane imports
 import { ORGANIZATION_SIZE, RESTRICTED_URLS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -274,7 +274,7 @@ export const WorkspaceCreateStep = observer(function WorkspaceCreateStep({
                             : "border-subtle text-tertiary hover:border-strong"
                         }`}
                       >
-                        <CircleCheck className={cn("size-4 text-placeholder", isSelected && "text-secondary")} />
+                        <TickCircleOutline className={cn("size-4 text-placeholder", isSelected && "text-secondary")} />
 
                         <span className="font-medium">{size}</span>
                       </button>
diff --git a/apps/web/core/components/onboarding/tour/root.tsx b/apps/web/core/components/onboarding/tour/root.tsx
index db87b7150b7..a5c3389fc68 100644
--- a/apps/web/core/components/onboarding/tour/root.tsx
+++ b/apps/web/core/components/onboarding/tour/root.tsx
@@ -8,7 +8,8 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { Button } from "@plane/propel/button";
-import { CloseIcon, PlaneLockup } from "@plane/propel/icons";
+import { PlaneLockup } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // assets
 import CyclesTour from "@/app/assets/onboarding/cycles.webp?url";
 import IssuesTour from "@/app/assets/onboarding/issues.webp?url";
@@ -136,7 +137,7 @@ export const TourRoot = observer(function TourRoot(props: TOnboardingTourProps)
             className="fixed top-[19%] right-[9%] z-10 translate-x-1/2 -translate-y-1/2 cursor-pointer rounded-full border border-strong bg-surface-1 p-1 sm:top-[11.5%] md:right-[24%] lg:right-[19%]"
             onClick={onComplete}
           >
-            <CloseIcon className="border-strong- h-3 w-3 text-primary" />
+            <CloseOutline className="border-strong- h-3 w-3 text-primary" />
           </button>
           <TourSidebar step={step} setStep={setStep} />
           <div className="col-span-10 h-full overflow-hidden lg:col-span-7">
diff --git a/apps/web/core/components/onboarding/tour/sidebar.tsx b/apps/web/core/components/onboarding/tour/sidebar.tsx
index 898159fd60f..8ba1848e4a2 100644
--- a/apps/web/core/components/onboarding/tour/sidebar.tsx
+++ b/apps/web/core/components/onboarding/tour/sidebar.tsx
@@ -5,7 +5,7 @@
  */
 
 // plane imports
-import { CycleIcon, ModuleIcon, PageIcon, ViewsIcon, WorkItemsIcon } from "@plane/propel/icons";
+import { CyclesOutline, ModuleOutline, PagesOutline, ViewsOutline, WorkItemsOutline } from "@makeplane/propel/icons";
 import type { ISvgIcons } from "@plane/propel/icons";
 // types
 import type { TTourSteps } from "./root";
@@ -18,27 +18,27 @@ const sidebarOptions: {
   {
     key: "work-items",
     label: "Work items",
-    Icon: WorkItemsIcon,
+    Icon: WorkItemsOutline,
   },
   {
     key: "cycles",
     label: "Cycles",
-    Icon: CycleIcon,
+    Icon: CyclesOutline,
   },
   {
     key: "modules",
     label: "Modules",
-    Icon: ModuleIcon,
+    Icon: ModuleOutline,
   },
   {
     key: "views",
     label: "Views",
-    Icon: ViewsIcon,
+    Icon: ViewsOutline,
   },
   {
     key: "pages",
     label: "Pages",
-    Icon: PageIcon,
+    Icon: PagesOutline,
   },
 ];
 
diff --git a/apps/web/core/components/pages/dropdowns/actions.tsx b/apps/web/core/components/pages/dropdowns/actions.tsx
index e344c21410f..e67f64f0299 100644
--- a/apps/web/core/components/pages/dropdowns/actions.tsx
+++ b/apps/web/core/components/pages/dropdowns/actions.tsx
@@ -7,11 +7,22 @@
 import { useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ArchiveRestoreIcon, FileOutput, LockKeyhole, LockKeyholeOpen } from "lucide-react";
+import {
+  ArchiveOutline,
+  CopyOutline,
+  DeleteOutline,
+  ExportOutline,
+  GlobeOutline,
+  LinkOutline,
+  LockOutline,
+  LockedOutline,
+  NewTabOutline,
+  RestoreOutline,
+  UnlockedOutline,
+} from "@makeplane/propel/icons";
 // constants
 import { EPageAccess } from "@plane/constants";
 // plane editor
-import { LinkIcon, CopyIcon, LockIcon, NewTabIcon, ArchiveIcon, TrashIcon, GlobeIcon } from "@plane/propel/icons";
 // plane ui
 import type { TContextMenuItem } from "@plane/ui";
 import { ContextMenu, CustomMenu } from "@plane/ui";
@@ -86,7 +97,7 @@ export const PageActions = observer(function PageActions(props: Props) {
             pageOperations.toggleLock();
           },
           title: is_locked ? "Unlock" : "Lock",
-          icon: is_locked ? LockKeyholeOpen : LockKeyhole,
+          icon: is_locked ? UnlockedOutline : LockedOutline,
           shouldRender: canCurrentUserLockPage,
         },
         {
@@ -95,21 +106,21 @@ export const PageActions = observer(function PageActions(props: Props) {
             pageOperations.toggleAccess();
           },
           title: access === EPageAccess.PUBLIC ? "Make private" : "Make public",
-          icon: access === EPageAccess.PUBLIC ? LockIcon : GlobeIcon,
+          icon: access === EPageAccess.PUBLIC ? LockOutline : GlobeOutline,
           shouldRender: canCurrentUserChangeAccess && !archived_at,
         },
         {
           key: "open-in-new-tab",
           action: pageOperations.openInNewTab,
           title: "Open in new tab",
-          icon: NewTabIcon,
+          icon: NewTabOutline,
           shouldRender: true,
         },
         {
           key: "copy-link",
           action: pageOperations.copyLink,
           title: "Copy link",
-          icon: LinkIcon,
+          icon: LinkOutline,
           shouldRender: true,
         },
         {
@@ -118,7 +129,7 @@ export const PageActions = observer(function PageActions(props: Props) {
             pageOperations.duplicate();
           },
           title: "Make a copy",
-          icon: CopyIcon,
+          icon: CopyOutline,
           shouldRender: canCurrentUserDuplicatePage,
         },
         {
@@ -127,7 +138,7 @@ export const PageActions = observer(function PageActions(props: Props) {
             pageOperations.toggleArchive();
           },
           title: archived_at ? "Restore" : "Archive",
-          icon: archived_at ? ArchiveRestoreIcon : ArchiveIcon,
+          icon: archived_at ? RestoreOutline : ArchiveOutline,
           shouldRender: canCurrentUserArchivePage,
         },
         {
@@ -136,14 +147,14 @@ export const PageActions = observer(function PageActions(props: Props) {
             setDeletePageModal(true);
           },
           title: "Delete",
-          icon: TrashIcon,
+          icon: DeleteOutline,
           shouldRender: canCurrentUserDeletePage && !!archived_at,
         },
         {
           key: "move",
           action: () => setMovePageModal(true),
           title: "Move",
-          icon: FileOutput,
+          icon: ExportOutline,
           shouldRender: canCurrentUserMovePage && isMovePageEnabled,
         },
       ];
diff --git a/apps/web/core/components/pages/editor/ai/ask-pi-menu.tsx b/apps/web/core/components/pages/editor/ai/ask-pi-menu.tsx
index a51930ee9f1..485e1ad4885 100644
--- a/apps/web/core/components/pages/editor/ai/ask-pi-menu.tsx
+++ b/apps/web/core/components/pages/editor/ai/ask-pi-menu.tsx
@@ -5,7 +5,8 @@
  */
 
 import { useState } from "react";
-import { CircleArrowUp, CornerDownRight, RefreshCcw, Sparkles } from "lucide-react";
+import { CircleArrowUp } from "lucide-react";
+import { AiStar1Outline, CornerRightDownOutline, RefreshOutline } from "@makeplane/propel/icons";
 // ui
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 // components
@@ -40,7 +41,7 @@ export function AskPiMenu(props: Props) {
         })}
       >
         <span className="grid size-7 flex-shrink-0 place-items-center rounded-full border border-subtle text-secondary">
-          <Sparkles className="size-3" />
+          <AiStar1Outline className="size-3" />
         </span>
         {response ? (
           <div>
@@ -70,7 +71,7 @@ export function AskPiMenu(props: Props) {
                   className="grid size-6 flex-shrink-0 place-items-center rounded-sm outline-none hover:bg-layer-1"
                   onClick={() => handleInsertText(true)}
                 >
-                  <CornerDownRight className="size-4 text-tertiary" />
+                  <CornerRightDownOutline className="size-4 text-tertiary" />
                 </button>
               </Tooltip>
               <Tooltip label="Re-generate response">
@@ -84,7 +85,7 @@ export function AskPiMenu(props: Props) {
                   }}
                   disabled={isRegenerating}
                 >
-                  <RefreshCcw
+                  <RefreshOutline
                     className={cn("size-4 text-tertiary", {
                       "animate-spin": isRegenerating,
                     })}
@@ -100,7 +101,7 @@ export function AskPiMenu(props: Props) {
       <div className="px-4 py-3">
         <div className="flex items-center gap-2 rounded-md border border-subtle p-2">
           <span className="grid size-3 flex-shrink-0 place-items-center">
-            <Sparkles className="size-3 text-secondary" />
+            <AiStar1Outline className="size-3 text-secondary" />
           </span>
           <input
             type="text"
diff --git a/apps/web/core/components/pages/editor/ai/menu.tsx b/apps/web/core/components/pages/editor/ai/menu.tsx
index aed8e806927..f3828192164 100644
--- a/apps/web/core/components/pages/editor/ai/menu.tsx
+++ b/apps/web/core/components/pages/editor/ai/menu.tsx
@@ -5,11 +5,15 @@
  */
 
 import React, { useEffect, useRef, useState } from "react";
-import type { LucideIcon } from "lucide-react";
-import { CornerDownRight, RefreshCcw, Sparkles, TriangleAlert } from "lucide-react";
+import {
+  AiStar1Outline,
+  ChevronRightOutline,
+  CornerRightDownOutline,
+  RefreshOutline,
+  WarningTriangleOutline,
+} from "@makeplane/propel/icons";
 // plane editor
 import type { EditorRefApi } from "@plane/editor";
-import { ChevronRightIcon } from "@plane/propel/icons";
 // plane ui
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 // components
@@ -32,13 +36,13 @@ type Props = {
 };
 
 const MENU_ITEMS: {
-  icon: LucideIcon;
+  icon: React.ComponentType<React.SVGProps<SVGSVGElement>>;
   key: AI_EDITOR_TASKS;
   label: string;
 }[] = [
   {
     key: AI_EDITOR_TASKS.ASK_ANYTHING,
-    icon: Sparkles,
+    icon: AiStar1Outline,
     label: "Ask Pi",
   },
 ];
@@ -179,7 +183,7 @@ export function EditorAIMenu(props: Props) {
                   <item.icon className="size-3 flex-shrink-0" />
                   {item.label}
                 </span>
-                <ChevronRightIcon
+                <ChevronRightOutline
                   className={cn("pointer-events-none size-3 flex-shrink-0 opacity-0 transition-opacity", {
                     "pointer-events-auto opacity-100": isActiveTask,
                   })}
@@ -210,7 +214,7 @@ export function EditorAIMenu(props: Props) {
                 })}
               >
                 <span className="grid size-7 flex-shrink-0 place-items-center rounded-full border border-subtle text-secondary">
-                  <Sparkles className="size-3" />
+                  <AiStar1Outline className="size-3" />
                 </span>
                 {response ? (
                   <div>
@@ -240,7 +244,7 @@ export function EditorAIMenu(props: Props) {
                           className="grid size-6 flex-shrink-0 place-items-center rounded-sm outline-none hover:bg-layer-1"
                           onClick={() => handleInsertText(true)}
                         >
-                          <CornerDownRight className="size-4 text-tertiary" />
+                          <CornerRightDownOutline className="size-4 text-tertiary" />
                         </button>
                       </Tooltip>
                       <Tooltip label="Re-generate response">
@@ -254,7 +258,7 @@ export function EditorAIMenu(props: Props) {
                           }}
                           disabled={isRegenerating}
                         >
-                          <RefreshCcw
+                          <RefreshOutline
                             className={cn("size-4 text-tertiary", {
                               "animate-spin": isRegenerating,
                             })}
@@ -297,7 +301,7 @@ export function EditorAIMenu(props: Props) {
       {activeTask && (
         <div className="flex items-center gap-2 rounded-b-md border-t border-subtle bg-surface-2 px-4 py-2 text-tertiary">
           <span className="grid size-4 flex-shrink-0 place-items-center">
-            <TriangleAlert className="size-3" />
+            <WarningTriangleOutline className="size-3" />
           </span>
           <p className="flex-shrink-0 text-11 font-medium">
             By using this feature, you consent to sharing the message with a 3rd party service.
diff --git a/apps/web/core/components/pages/editor/content-limit-banner.tsx b/apps/web/core/components/pages/editor/content-limit-banner.tsx
index 52fba7e4e60..efc630bbfe2 100644
--- a/apps/web/core/components/pages/editor/content-limit-banner.tsx
+++ b/apps/web/core/components/pages/editor/content-limit-banner.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { TriangleAlert } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 type Props = {
@@ -17,7 +17,7 @@ export function ContentLimitBanner({ className, onDismiss }: Props) {
     <div className={cn("text-sm flex items-center gap-2 border-b border-subtle-1 bg-layer-2 px-4 py-2.5", className)}>
       <div className="mx-auto flex items-center gap-2 text-secondary">
         <span className="text-amber-500">
-          <TriangleAlert />
+          <WarningTriangleOutline />
         </span>
         <span className="font-medium">
           Content limit reached and live sync is off. Create a new page or use nested pages to continue syncing.
diff --git a/apps/web/core/components/pages/editor/header/root.tsx b/apps/web/core/components/pages/editor/header/root.tsx
index f70e7b32cac..05296b79478 100644
--- a/apps/web/core/components/pages/editor/header/root.tsx
+++ b/apps/web/core/components/pages/editor/header/root.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { SmilePlus } from "lucide-react";
+import { ReactionOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EmojiPicker, EmojiIconPickerTypes } from "@plane/propel/emoji-icon-picker";
 import { cn } from "@plane/utils";
@@ -53,7 +53,7 @@ export const PageEditorHeaderRoot = observer(function PageEditorHeaderRoot(props
                     }
                   )}
                 >
-                  <SmilePlus className="size-4 flex-shrink-0" />
+                  <ReactionOutline className="size-4 flex-shrink-0" />
                   Icon
                 </button>
               }
diff --git a/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx b/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx
index 817c7995081..93cdc45297b 100644
--- a/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/color-dropdown.tsx
@@ -5,7 +5,8 @@
  */
 
 import { memo } from "react";
-import { ALargeSmall, Ban } from "lucide-react";
+import { Ban } from "lucide-react";
+import { TextOutline } from "@makeplane/propel/icons";
 import { Popover } from "@headlessui/react";
 // plane editor
 import { COLORS_LIST } from "@plane/editor";
@@ -53,7 +54,7 @@ export const ColorDropdown = memo(function ColorDropdown(props: Props) {
                 backgroundColor: activeBackgroundColor ? activeBackgroundColor.backgroundColor : "transparent",
               }}
             >
-              <ALargeSmall
+              <TextOutline
                 className={cn("size-3.5", {
                   "text-primary": !activeTextColor,
                 })}
diff --git a/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx b/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx
index 0244c5e8ff4..cafe0421e62 100644
--- a/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/options-dropdown.tsx
@@ -6,7 +6,7 @@
 
 import { useMemo, useState } from "react";
 import { observer } from "mobx-react";
-import { ArrowUpToLine, Clipboard, History } from "lucide-react";
+import { ClipboardOutline, ExportOutline, HistoryOutline } from "@makeplane/propel/icons";
 // plane imports
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Switch } from "@makeplane/propel/components/switch";
@@ -89,7 +89,7 @@ export const PageOptionsDropdown = observer(function PageOptionsDropdown(props:
             });
           },
           title: "Copy markdown",
-          icon: Clipboard,
+          icon: ClipboardOutline,
           shouldRender: true,
         },
         {
@@ -104,14 +104,14 @@ export const PageOptionsDropdown = observer(function PageOptionsDropdown(props:
             router.push(updatedRoute);
           },
           title: "Version history",
-          icon: History,
+          icon: HistoryOutline,
           shouldRender: true,
         },
         {
           key: "export",
           action: () => setIsExportModalOpen(true),
           title: "Export",
-          icon: ArrowUpToLine,
+          icon: ExportOutline,
           shouldRender: true,
         },
       ];
diff --git a/apps/web/core/components/pages/editor/toolbar/root.tsx b/apps/web/core/components/pages/editor/toolbar/root.tsx
index a2a4ed86988..f10dd51732e 100644
--- a/apps/web/core/components/pages/editor/toolbar/root.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/root.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { PanelRight } from "lucide-react";
+import { RightSidePaneOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -62,7 +62,7 @@ export const PageEditorToolbarRoot = observer(function PageEditorToolbarRoot(pro
                   className="grid size-6 shrink-0 place-items-center rounded-sm text-secondary transition-colors hover:bg-layer-transparent-hover hover:text-primary"
                   onClick={handleOpenNavigationPane}
                 >
-                  <PanelRight className="size-3.5" />
+                  <RightSidePaneOutline className="size-3.5" />
                 </button>
               )}
             </div>
@@ -79,7 +79,7 @@ export const PageEditorToolbarRoot = observer(function PageEditorToolbarRoot(pro
                 onClick={handleOpenNavigationPane}
                 aria-label={t("page_navigation_pane.open_button")}
               >
-                <PanelRight className="size-3.5" />
+                <RightSidePaneOutline className="size-3.5" />
               </button>
             </Tooltip>
           )}
diff --git a/apps/web/core/components/pages/editor/toolbar/toolbar.tsx b/apps/web/core/components/pages/editor/toolbar/toolbar.tsx
index 42594c434f4..92a0371c522 100644
--- a/apps/web/core/components/pages/editor/toolbar/toolbar.tsx
+++ b/apps/web/core/components/pages/editor/toolbar/toolbar.tsx
@@ -7,7 +7,7 @@
 import React, { useEffect, useState, useCallback } from "react";
 import type { EditorRefApi } from "@plane/editor";
 // plane imports
-import { CheckIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, TickOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { CustomMenu } from "@plane/ui";
 import { cn } from "@plane/utils";
@@ -122,7 +122,7 @@ export function PageToolbar(props: Props) {
             )}
           >
             {activeTypography?.name || "Text"}
-            <ChevronDownIcon className="size-3 shrink-0" />
+            <ChevronDownOutline className="size-3 shrink-0" />
           </span>
         }
         className="pr-2"
@@ -152,7 +152,7 @@ export function PageToolbar(props: Props) {
               <item.icon className="size-3" />
               {item.name}
             </span>
-            {activeTypography?.itemKey === item.itemKey && <CheckIcon className="size-3 shrink-0 text-tertiary" />}
+            {activeTypography?.itemKey === item.itemKey && <TickOutline className="size-3 shrink-0 text-tertiary" />}
           </CustomMenu.MenuItem>
         ))}
       </CustomMenu>
diff --git a/apps/web/core/components/pages/header/archived-badge.tsx b/apps/web/core/components/pages/header/archived-badge.tsx
index 4e6d014aebc..ba77f4fcf74 100644
--- a/apps/web/core/components/pages/header/archived-badge.tsx
+++ b/apps/web/core/components/pages/header/archived-badge.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 // plane imports
-import { ArchiveIcon } from "@plane/propel/icons";
+import { ArchiveOutline } from "@makeplane/propel/icons";
 import { renderFormattedDate } from "@plane/utils";
 // store
 import type { TPageInstance } from "@/store/pages/base-page";
@@ -20,7 +20,7 @@ export const PageArchivedBadge = observer(function PageArchivedBadge({ page }: P
 
   return (
     <div className="flex h-6 flex-shrink-0 items-center gap-1 rounded-sm bg-accent-primary/20 px-2 text-accent-primary">
-      <ArchiveIcon className="size-3.5 flex-shrink-0" />
+      <ArchiveOutline className="size-3.5 flex-shrink-0" />
       <span className="text-11 font-medium">Archived at {renderFormattedDate(page.archived_at)}</span>
     </div>
   );
diff --git a/apps/web/core/components/pages/header/copy-link-control.tsx b/apps/web/core/components/pages/header/copy-link-control.tsx
index cfbadeae0b8..4773d9b418c 100644
--- a/apps/web/core/components/pages/header/copy-link-control.tsx
+++ b/apps/web/core/components/pages/header/copy-link-control.tsx
@@ -7,7 +7,7 @@
 import { useState, useRef, useEffect, useCallback } from "react";
 import { observer } from "mobx-react";
 
-import { LinkIcon, CheckIcon } from "@plane/propel/icons";
+import { LinkOutline, TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { IconButton } from "@plane/propel/icon-button";
@@ -61,7 +61,7 @@ export const PageCopyLinkControl = observer(function PageCopyLinkControl({ page
       <IconButton
         variant="ghost"
         size="lg"
-        icon={isCopied ? CheckIcon : LinkIcon}
+        icon={isCopied ? TickOutline : LinkOutline}
         onClick={handleCopy}
         aria-label={isCopied ? "Copied link" : "Copy link"}
         className={cn(isCopied && "text-success-primary")}
diff --git a/apps/web/core/components/pages/header/favorite-control.tsx b/apps/web/core/components/pages/header/favorite-control.tsx
index 38c982d4875..e87886e4ca4 100644
--- a/apps/web/core/components/pages/header/favorite-control.tsx
+++ b/apps/web/core/components/pages/header/favorite-control.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { Star } from "lucide-react";
+import { StarOutline } from "@makeplane/propel/icons";
 // ui
 import { IconButton } from "@plane/propel/icon-button";
 // hooks
@@ -31,7 +31,7 @@ export const PageFavoriteControl = observer(function PageFavoriteControl({ page
     <IconButton
       variant="ghost"
       size="lg"
-      icon={Star}
+      icon={StarOutline}
       onClick={() => {
         pageOperations.toggleFavorite();
       }}
diff --git a/apps/web/core/components/pages/header/lock-control.tsx b/apps/web/core/components/pages/header/lock-control.tsx
index 63364990c18..bc368a53ff7 100644
--- a/apps/web/core/components/pages/header/lock-control.tsx
+++ b/apps/web/core/components/pages/header/lock-control.tsx
@@ -6,7 +6,7 @@
 
 import { useState, useEffect, useRef } from "react";
 import { observer } from "mobx-react";
-import { LockKeyhole, LockKeyholeOpen } from "lucide-react";
+import { LockedOutline, UnlockedOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 // hooks
@@ -85,7 +85,7 @@ export const PageLockControl = observer(function PageLockControl({ page }: Props
             className="grid size-6 flex-shrink-0 place-items-center rounded-sm text-secondary transition-colors hover:bg-layer-1 hover:text-primary"
             aria-label="Lock"
           >
-            <LockKeyhole className="size-3.5" />
+            <LockedOutline className="size-3.5" />
           </button>
         </Tooltip>
       )}
@@ -97,7 +97,7 @@ export const PageLockControl = observer(function PageLockControl({ page }: Props
           className="flex h-6 items-center gap-1 rounded-sm bg-accent-primary/20 px-2 text-accent-primary transition-colors hover:bg-accent-primary/30"
           aria-label="Locked"
         >
-          <LockKeyhole className="animate-lock-icon size-3.5 flex-shrink-0" />
+          <LockedOutline className="animate-lock-icon size-3.5 flex-shrink-0" />
           <span className="animate-text-slide-in overflow-hidden text-11 font-medium whitespace-nowrap transition-all duration-500 ease-out">
             Locked
           </span>
@@ -109,7 +109,7 @@ export const PageLockControl = observer(function PageLockControl({ page }: Props
           className="flex h-6 animate-fade-out items-center gap-1 rounded-sm px-2 text-secondary"
           aria-label="Unlocked"
         >
-          <LockKeyholeOpen className="animate-unlock-icon size-3.5 flex-shrink-0" />
+          <UnlockedOutline className="animate-unlock-icon size-3.5 flex-shrink-0" />
           <span className="animate-text-slide-in animate-text-fade-out overflow-hidden text-11 font-medium whitespace-nowrap transition-all duration-500 ease-out">
             Unlocked
           </span>
diff --git a/apps/web/core/components/pages/header/root.tsx b/apps/web/core/components/pages/header/root.tsx
index e86053289fb..200add7efeb 100644
--- a/apps/web/core/components/pages/header/root.tsx
+++ b/apps/web/core/components/pages/header/root.tsx
@@ -6,7 +6,7 @@
 
 import { useCallback } from "react";
 import { observer } from "mobx-react";
-import { ListFilter } from "lucide-react";
+import { FilterOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import type { TPageFilterProps, TPageNavigationTabs } from "@plane/types";
@@ -78,7 +78,7 @@ export const PagesListHeaderRoot = observer(function PagesListHeaderRoot(props:
             }}
           />
           <FiltersDropdown
-            icon={<ListFilter className="h-3 w-3" />}
+            icon={<FilterOutline className="h-3 w-3" />}
             title={t("common.filters")}
             placement="bottom-end"
             isFiltersApplied={isFiltersApplied}
diff --git a/apps/web/core/components/pages/list/applied-filters/root.tsx b/apps/web/core/components/pages/list/applied-filters/root.tsx
index cacadc7693d..62a1609ca87 100644
--- a/apps/web/core/components/pages/list/applied-filters/root.tsx
+++ b/apps/web/core/components/pages/list/applied-filters/root.tsx
@@ -6,7 +6,7 @@
 
 import { useTranslation } from "@plane/i18n";
 import { PillButton } from "@makeplane/propel/components/pill";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TPageFilterProps } from "@plane/types";
 import { replaceUnderscoreIfSnakeCase } from "@plane/utils";
@@ -68,7 +68,7 @@ export function PageAppliedFiltersList(props: Props) {
                   className="grid place-items-center text-tertiary hover:text-secondary"
                   onClick={() => handleRemoveFilter(filterKey, null)}
                 >
-                  <CloseIcon height={12} width={12} strokeWidth={2} />
+                  <CloseOutline height={12} width={12} />
                 </button>
               )}
             </div>
@@ -81,7 +81,7 @@ export function PageAppliedFiltersList(props: Props) {
           size="md"
           variant="outline"
           label={t("common.clear_all")}
-          endIcon={<CloseIcon height={12} strokeWidth={2} />}
+          endIcon={<CloseOutline height={12} />}
           onClick={handleClearAllFilters}
         />
       )}
diff --git a/apps/web/core/components/pages/list/block-item-action.tsx b/apps/web/core/components/pages/list/block-item-action.tsx
index d5a2af29c91..5de1af132b2 100644
--- a/apps/web/core/components/pages/list/block-item-action.tsx
+++ b/apps/web/core/components/pages/list/block-item-action.tsx
@@ -5,10 +5,9 @@
  */
 
 import { observer } from "mobx-react";
-import { Earth, Info, Minus } from "lucide-react";
+import { GlobeOutline, InfoOutline, LockOutline, MinusOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Avatar } from "@makeplane/propel/components/avatar";
-import { LockIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { FavoriteStar } from "@plane/ui";
 import { renderFormattedDate, getFileURL } from "@plane/utils";
@@ -55,16 +54,16 @@ export const BlockItemAction = observer(function BlockItemAction(props: Props) {
       </div>
       <div className="cursor-default text-tertiary">
         <Tooltip label={access === 0 ? "Public" : "Private"}>
-          {access === 0 ? <Earth className="h-4 w-4" /> : <LockIcon className="h-4 w-4" />}
+          {access === 0 ? <GlobeOutline className="h-4 w-4" /> : <LockOutline className="h-4 w-4" />}
         </Tooltip>
       </div>
       {/* vertical divider */}
-      <Minus className="-mx-3 h-5 w-5 rotate-90 text-placeholder" strokeWidth={1} />
+      <MinusOutline className="-mx-3 h-5 w-5 rotate-90 text-placeholder" />
 
       {/* page info */}
       <Tooltip label={`Created on ${renderFormattedDate(created_at)}`} layout="stacked">
         <span className="grid h-4 w-4 cursor-default place-items-center">
-          <Info className="h-4 w-4 text-tertiary" />
+          <InfoOutline className="h-4 w-4 text-tertiary" />
         </span>
       </Tooltip>
 
diff --git a/apps/web/core/components/pages/list/block.tsx b/apps/web/core/components/pages/list/block.tsx
index 8ceec0d6a10..622569dda58 100644
--- a/apps/web/core/components/pages/list/block.tsx
+++ b/apps/web/core/components/pages/list/block.tsx
@@ -7,7 +7,7 @@
 import { useRef } from "react";
 import { observer } from "mobx-react";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { PageIcon } from "@plane/propel/icons";
+import { PagesOutline } from "@makeplane/propel/icons";
 // plane imports
 import { getPageName } from "@plane/utils";
 // components
@@ -46,7 +46,7 @@ export const PageListBlock = observer(function PageListBlock(props: TPageListBlo
           {logo_props?.in_use ? (
             <Logo logo={logo_props} size={16} type="lucide" />
           ) : (
-            <PageIcon className="h-4 w-4 text-tertiary" />
+            <PagesOutline className="h-4 w-4 text-tertiary" />
           )}
         </>
       }
diff --git a/apps/web/core/components/pages/list/filters/root.tsx b/apps/web/core/components/pages/list/filters/root.tsx
index 7c009046816..f42ec93ee92 100644
--- a/apps/web/core/components/pages/list/filters/root.tsx
+++ b/apps/web/core/components/pages/list/filters/root.tsx
@@ -6,7 +6,7 @@
 
 import { useState, useRef, useEffect } from "react";
 import { observer } from "mobx-react";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import type { TPageFilterProps, TPageFilters } from "@plane/types";
 // components
 import { FilterCreatedDate } from "@/components/common/filters/created-at";
@@ -60,7 +60,7 @@ export const PageFiltersSelection = observer(function PageFiltersSelection(props
     <div className="flex h-full w-full flex-col overflow-hidden">
       <div className="bg-layer-transparent p-2.5 pb-0">
         <div className="flex items-center gap-1.5 rounded-sm border-[0.5px] border-subtle bg-surface-2 px-1.5 py-1 text-11">
-          <SearchIcon className="text-placeholder" width={12} height={12} strokeWidth={2} />
+          <SearchOutline className="text-placeholder" width={12} height={12} />
           <input
             ref={inputRef}
             type="text"
@@ -71,7 +71,7 @@ export const PageFiltersSelection = observer(function PageFiltersSelection(props
           />
           {filtersSearchQuery !== "" && (
             <button type="button" className="grid place-items-center" onClick={() => setFiltersSearchQuery("")}>
-              <CloseIcon className="text-tertiary" height={12} width={12} strokeWidth={2} />
+              <CloseOutline className="text-tertiary" height={12} width={12} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/pages/list/order-by.tsx b/apps/web/core/components/pages/list/order-by.tsx
index 2e9f22f0ad7..be5a3b7d408 100644
--- a/apps/web/core/components/pages/list/order-by.tsx
+++ b/apps/web/core/components/pages/list/order-by.tsx
@@ -4,11 +4,10 @@
  * See the LICENSE file for details.
  */
 
-import { ArrowDownWideNarrow, ArrowUpWideNarrow } from "lucide-react";
+import { SortAscendingOutline, SortDescendingOutline, TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import { getButtonStyling } from "@plane/propel/button";
 // types
-import { CheckIcon } from "@plane/propel/icons";
 import type { TPageFiltersSortBy, TPageFiltersSortKey } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 
@@ -37,7 +36,7 @@ export function PageOrderByDropdown(props: Props) {
     <CustomMenu
       customButton={
         <div className={getButtonStyling("secondary", "lg")}>
-          {!isDescending ? <ArrowUpWideNarrow className="size-3" /> : <ArrowDownWideNarrow className="size-3" />}
+          {!isDescending ? <SortAscendingOutline className="size-3" /> : <SortDescendingOutline className="size-3" />}
           {orderByDetails?.label}
         </div>
       }
@@ -56,7 +55,7 @@ export function PageOrderByDropdown(props: Props) {
           }
         >
           {option.label}
-          {sortKey === option.key && <CheckIcon className="h-3 w-3" />}
+          {sortKey === option.key && <TickOutline className="h-3 w-3" />}
         </CustomMenu.MenuItem>
       ))}
       <hr className="my-2 border-subtle" />
@@ -70,7 +69,7 @@ export function PageOrderByDropdown(props: Props) {
         }}
       >
         Ascending
-        {!isDescending && <CheckIcon className="h-3 w-3" />}
+        {!isDescending && <TickOutline className="h-3 w-3" />}
       </CustomMenu.MenuItem>
       <CustomMenu.MenuItem
         className="flex items-center justify-between gap-2"
@@ -82,7 +81,7 @@ export function PageOrderByDropdown(props: Props) {
         }}
       >
         Descending
-        {isDescending && <CheckIcon className="h-3 w-3" />}
+        {isDescending && <TickOutline className="h-3 w-3" />}
       </CustomMenu.MenuItem>
     </CustomMenu>
   );
diff --git a/apps/web/core/components/pages/list/search-input.tsx b/apps/web/core/components/pages/list/search-input.tsx
index 36ab492ca5e..e90d67f3bc2 100644
--- a/apps/web/core/components/pages/list/search-input.tsx
+++ b/apps/web/core/components/pages/list/search-input.tsx
@@ -8,7 +8,7 @@ import { useRef, useState } from "react";
 // plane imports
 import { useOutsideClickDetector } from "@plane/hooks";
 import { IconButton } from "@plane/propel/icon-button";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 type Props = {
@@ -49,7 +49,7 @@ export function PageSearchInput(props: Props) {
             setIsSearchOpen(true);
             inputRef.current?.focus();
           }}
-          icon={SearchIcon}
+          icon={SearchOutline}
         />
       )}
       <div
@@ -60,7 +60,7 @@ export function PageSearchInput(props: Props) {
           }
         )}
       >
-        <SearchIcon className="h-3.5 w-3.5" />
+        <SearchOutline className="h-3.5 w-3.5" />
         <input
           ref={inputRef}
           className="ml-2 w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -78,7 +78,7 @@ export function PageSearchInput(props: Props) {
               setIsSearchOpen(false);
             }}
           >
-            <CloseIcon className="h-3 w-3" />
+            <CloseOutline className="h-3 w-3" />
           </button>
         )}
       </div>
diff --git a/apps/web/core/components/pages/modals/page-form.tsx b/apps/web/core/components/pages/modals/page-form.tsx
index 84ba42750e8..c234e91d41d 100644
--- a/apps/web/core/components/pages/modals/page-form.tsx
+++ b/apps/web/core/components/pages/modals/page-form.tsx
@@ -14,7 +14,7 @@ import { ETabIndices, EPageAccess } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { EmojiPicker, EmojiIconPickerTypes, Logo } from "@plane/propel/emoji-icon-picker";
-import { GlobeIcon, LockIcon, PageIcon } from "@plane/propel/icons";
+import { GlobeOutline, LockOutline, PagesOutline } from "@makeplane/propel/icons";
 import type { ISvgIcons } from "@plane/propel/icons";
 import type { TPage } from "@plane/types";
 
@@ -36,8 +36,8 @@ const PAGE_ACCESS_SPECIFIERS: {
   i18n_label: string;
   icon: LucideIcon | React.FC<ISvgIcons>;
 }[] = [
-  { key: EPageAccess.PUBLIC, i18n_label: "common.access.public", icon: GlobeIcon },
-  { key: EPageAccess.PRIVATE, i18n_label: "common.access.private", icon: LockIcon },
+  { key: EPageAccess.PUBLIC, i18n_label: "common.access.public", icon: GlobeOutline },
+  { key: EPageAccess.PRIVATE, i18n_label: "common.access.private", icon: LockOutline },
 ];
 
 export function PageForm(props: Props) {
@@ -82,7 +82,7 @@ export function PageForm(props: Props) {
                   {formData?.logo_props?.in_use ? (
                     <Logo logo={formData?.logo_props} size={18} type="lucide" />
                   ) : (
-                    <PageIcon className="h-4 w-4 text-tertiary" />
+                    <PagesOutline className="h-4 w-4 text-tertiary" />
                   )}
                 </>
               </span>
diff --git a/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx b/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx
index 42e156112b1..16a0196cd74 100644
--- a/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx
+++ b/apps/web/core/components/pages/navigation-pane/tab-panels/assets.tsx
@@ -7,7 +7,7 @@
 import { useMemo } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { Download } from "lucide-react";
+import { DownloadOutline } from "@makeplane/propel/icons";
 // plane imports
 import { CORE_EXTENSIONS } from "@plane/editor";
 import type { TEditorAsset } from "@plane/editor";
@@ -88,7 +88,7 @@ const AssetItem = observer(function AssetItem(props: AssetItemProps) {
               rel="noreferrer noopener"
               className="pointer-events-none flex shrink-0 items-center gap-1 rounded-sm px-1 py-0.5 text-secondary opacity-0 transition-opacity group-hover/asset-item:pointer-events-auto group-hover/asset-item:opacity-100 hover:text-primary"
             >
-              <Download className="size-3 shrink-0" />
+              <DownloadOutline className="size-3 shrink-0" />
               <span className="text-11 font-medium">{t("page_navigation_pane.tabs.assets.download_button")}</span>
             </a>
           </div>
diff --git a/apps/web/core/components/pages/version/main-content.tsx b/apps/web/core/components/pages/version/main-content.tsx
index 5cd3b76794e..bd978efd1ed 100644
--- a/apps/web/core/components/pages/version/main-content.tsx
+++ b/apps/web/core/components/pages/version/main-content.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import useSWR from "swr";
-import { EyeIcon, TriangleAlert } from "lucide-react";
+import { ShowOutline, WarningTriangleOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Button } from "@plane/propel/button";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
@@ -87,7 +87,7 @@ export const PageVersionsMainContent = observer(function PageVersionsMainContent
         <div className="grid flex-grow place-items-center">
           <div className="flex flex-col items-center gap-4 text-center">
             <span className="grid size-11 flex-shrink-0 place-items-center text-tertiary">
-              <TriangleAlert className="size-10" />
+              <WarningTriangleOutline className="size-10" />
             </span>
             <div>
               <h6 className="text-16 font-semibold">Something went wrong!</h6>
@@ -108,7 +108,7 @@ export const PageVersionsMainContent = observer(function PageVersionsMainContent
                   : "Loading version details"}
               </h6>
               <span className="flex flex-shrink-0 items-center gap-1 rounded-sm bg-accent-primary/20 px-1.5 py-1 text-11 font-medium text-accent-primary">
-                <EyeIcon className="size-3 flex-shrink-0" />
+                <ShowOutline className="size-3 flex-shrink-0" />
                 View only
               </span>
             </div>
diff --git a/apps/web/core/components/power-k/config/account-commands.ts b/apps/web/core/components/power-k/config/account-commands.ts
index a12d7b78111..e726a30a87d 100644
--- a/apps/web/core/components/power-k/config/account-commands.ts
+++ b/apps/web/core/components/power-k/config/account-commands.ts
@@ -5,7 +5,7 @@
  */
 
 import { useCallback } from "react";
-import { LogOut, Mails } from "lucide-react";
+import { LogOutOutline, MailOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
@@ -43,7 +43,7 @@ export const usePowerKAccountCommands = (): TPowerKCommandConfig[] => {
       type: "action",
       group: "account",
       i18n_title: "power_k.account_actions.workspace_invites",
-      icon: Mails,
+      icon: MailOutline,
       action: () => router.push("/invitations"),
       isEnabled: () => true,
       isVisible: () => true,
@@ -54,7 +54,7 @@ export const usePowerKAccountCommands = (): TPowerKCommandConfig[] => {
       type: "action",
       group: "account",
       i18n_title: "power_k.account_actions.sign_out",
-      icon: LogOut,
+      icon: LogOutOutline,
       action: handleSignOut,
       isEnabled: () => true,
       isVisible: () => true,
diff --git a/apps/web/core/components/power-k/config/creation/command.ts b/apps/web/core/components/power-k/config/creation/command.ts
index f63baa929a6..a6fb8153b19 100644
--- a/apps/web/core/components/power-k/config/creation/command.ts
+++ b/apps/web/core/components/power-k/config/creation/command.ts
@@ -4,10 +4,16 @@
  * See the LICENSE file for details.
  */
 
-import { FileText, FolderPlus, Layers, SquarePlus } from "lucide-react";
+import { SquarePlus } from "lucide-react";
+import {
+  CreateFolderOutline,
+  CyclesOutline,
+  DocumentationOutline,
+  ModuleOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
-import { ContrastIcon, DiceIcon, LayersIcon } from "@plane/propel/icons";
 // components
 import { EUserProjectRoles } from "@plane/types";
 import type { TPowerKCommandConfig, TPowerKContext } from "@/components/power-k/core/types";
@@ -69,7 +75,7 @@ export const usePowerKCreationCommandsRecord = (): Record<TPowerKCreationCommand
       type: "action",
       group: "create",
       i18n_title: "power_k.creation_actions.create_work_item",
-      icon: LayersIcon,
+      icon: WorkItemsOutline,
       keySequence: "ni",
       action: () => toggleCreateIssueModal(true),
       isEnabled: () => Boolean(canCreateWorkItem),
@@ -81,7 +87,7 @@ export const usePowerKCreationCommandsRecord = (): Record<TPowerKCreationCommand
       type: "action",
       group: "create",
       i18n_title: "power_k.creation_actions.create_page",
-      icon: FileText,
+      icon: DocumentationOutline,
       keySequence: "nd",
       action: () => toggleCreatePageModal({ isOpen: true }),
       isEnabled: (ctx) => Boolean(getProjectDetails(ctx)?.page_view && hasProjectMemberLevelPermissions(ctx)),
@@ -94,7 +100,7 @@ export const usePowerKCreationCommandsRecord = (): Record<TPowerKCreationCommand
       type: "action",
       group: "create",
       i18n_title: "power_k.creation_actions.create_view",
-      icon: Layers,
+      icon: WorkItemsOutline,
       keySequence: "nv",
       action: () => toggleCreateViewModal(true),
       isEnabled: (ctx) => Boolean(getProjectDetails(ctx)?.issue_views_view && hasProjectMemberLevelPermissions(ctx)),
@@ -109,7 +115,7 @@ export const usePowerKCreationCommandsRecord = (): Record<TPowerKCreationCommand
       type: "action",
       group: "create",
       i18n_title: "power_k.creation_actions.create_cycle",
-      icon: ContrastIcon,
+      icon: CyclesOutline,
       keySequence: "nc",
       action: () => toggleCreateCycleModal(true),
       isEnabled: (ctx) => Boolean(getProjectDetails(ctx)?.cycle_view && hasProjectMemberLevelPermissions(ctx)),
@@ -122,7 +128,7 @@ export const usePowerKCreationCommandsRecord = (): Record<TPowerKCreationCommand
       type: "action",
       group: "create",
       i18n_title: "power_k.creation_actions.create_module",
-      icon: DiceIcon,
+      icon: ModuleOutline,
       keySequence: "nm",
       action: () => toggleCreateModuleModal(true),
       isEnabled: (ctx) => Boolean(getProjectDetails(ctx)?.module_view && hasProjectMemberLevelPermissions(ctx)),
@@ -135,7 +141,7 @@ export const usePowerKCreationCommandsRecord = (): Record<TPowerKCreationCommand
       type: "action",
       group: "create",
       i18n_title: "power_k.creation_actions.create_project",
-      icon: FolderPlus,
+      icon: CreateFolderOutline,
       keySequence: "np",
       action: () => toggleCreateProjectModal(true),
       isEnabled: () => Boolean(canCreateProject),
diff --git a/apps/web/core/components/power-k/config/help-commands.ts b/apps/web/core/components/power-k/config/help-commands.ts
index 79e47354d56..3481b9f1769 100644
--- a/apps/web/core/components/power-k/config/help-commands.ts
+++ b/apps/web/core/components/power-k/config/help-commands.ts
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { FileText, GithubIcon, MessageSquare, Rocket } from "lucide-react";
+import { ChatOutline, DocumentationOutline, Github, RocketOutline } from "@makeplane/propel/icons";
 // components
 import type { TPowerKCommandConfig } from "@/components/power-k/core/types";
 // hooks
@@ -23,7 +23,7 @@ export const usePowerKHelpCommands = (): TPowerKCommandConfig[] => {
       type: "action",
       group: "help",
       i18n_title: "power_k.help_actions.open_keyboard_shortcuts",
-      icon: Rocket,
+      icon: RocketOutline,
       modifierShortcut: "cmd+/",
       action: () => toggleShortcutsListModal(true),
       isEnabled: () => true,
@@ -35,7 +35,7 @@ export const usePowerKHelpCommands = (): TPowerKCommandConfig[] => {
       type: "action",
       group: "help",
       i18n_title: "power_k.help_actions.open_plane_documentation",
-      icon: FileText,
+      icon: DocumentationOutline,
       action: () => {
         window.open("https://docs.plane.so/", "_blank", "noopener,noreferrer");
       },
@@ -48,7 +48,7 @@ export const usePowerKHelpCommands = (): TPowerKCommandConfig[] => {
       type: "action",
       group: "help",
       i18n_title: "power_k.help_actions.join_forum",
-      icon: MessageSquare,
+      icon: ChatOutline,
       action: () => {
         window.open("https://forum.plane.so", "_blank", "noopener,noreferrer");
       },
@@ -61,7 +61,7 @@ export const usePowerKHelpCommands = (): TPowerKCommandConfig[] => {
       type: "action",
       group: "help",
       i18n_title: "power_k.help_actions.report_bug",
-      icon: GithubIcon,
+      icon: Github,
       action: () => {
         window.open("https://github.com/makeplane/plane/issues/new/choose", "_blank", "noopener,noreferrer");
       },
diff --git a/apps/web/core/components/power-k/config/miscellaneous-commands.ts b/apps/web/core/components/power-k/config/miscellaneous-commands.ts
index de1d617cf08..2432a4b0599 100644
--- a/apps/web/core/components/power-k/config/miscellaneous-commands.ts
+++ b/apps/web/core/components/power-k/config/miscellaneous-commands.ts
@@ -5,9 +5,8 @@
  */
 
 import { useCallback } from "react";
-import { PanelLeft } from "lucide-react";
+import { LeftSidePaneOutline, LinkOutline, SearchOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, SearchIcon } from "@plane/propel/icons";
 // plane imports
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { copyTextToClipboard } from "@plane/utils";
@@ -57,7 +56,7 @@ export const usePowerKMiscellaneousCommands = (): TPowerKCommandConfig[] => {
       group: "miscellaneous",
       type: "action",
       i18n_title: "power_k.miscellaneous_actions.toggle_app_sidebar",
-      icon: PanelLeft,
+      icon: LeftSidePaneOutline,
       action: () => toggleSidebar(),
       modifierShortcut: "cmd+b",
       isEnabled: () => true,
@@ -69,7 +68,7 @@ export const usePowerKMiscellaneousCommands = (): TPowerKCommandConfig[] => {
       group: "miscellaneous",
       type: "action",
       i18n_title: "power_k.miscellaneous_actions.copy_current_page_url",
-      icon: LinkIcon,
+      icon: LinkOutline,
       action: copyCurrentPageUrlToClipboard,
       modifierShortcut: "cmd+shift+c",
       isEnabled: () => true,
@@ -81,7 +80,7 @@ export const usePowerKMiscellaneousCommands = (): TPowerKCommandConfig[] => {
       group: "miscellaneous",
       type: "action",
       i18n_title: "power_k.miscellaneous_actions.focus_top_nav_search",
-      icon: SearchIcon,
+      icon: SearchOutline,
       action: focusTopNavSearch,
       modifierShortcut: "cmd+f",
       isEnabled: () => true,
diff --git a/apps/web/core/components/power-k/config/navigation/commands.ts b/apps/web/core/components/power-k/config/navigation/commands.ts
index aecd31b7863..22e1558e8b4 100644
--- a/apps/web/core/components/power-k/config/navigation/commands.ts
+++ b/apps/web/core/components/power-k/config/navigation/commands.ts
@@ -4,10 +4,23 @@
  * See the LICENSE file for details.
  */
 
-import { BarChart2, Briefcase, FileText, Home, Inbox, Layers, PenSquare, Settings } from "lucide-react";
+import {
+  ActivityOutline,
+  ArchiveOutline,
+  BarOutline,
+  CyclesOutline,
+  DocumentationOutline,
+  EditOutline,
+  HomeOutline,
+  InboxOutline,
+  IntakeOutline,
+  ModuleOutline,
+  ProjectsOutline,
+  SettingsOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
-import { ArchiveIcon, UserActivityIcon, LayersIcon, ContrastIcon, DiceIcon, Intake } from "@plane/propel/icons";
 import type { ICycle, IModule, IPartialProject, IProjectView, IWorkspace } from "@plane/types";
 import { EUserProjectRoles, EUserWorkspaceRoles } from "@plane/types";
 // components
@@ -82,7 +95,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "change-page",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.open_workspace",
-      icon: Briefcase,
+      icon: ProjectsOutline,
       keySequence: "ow",
       page: "open-workspace",
       onSelect: (data, ctx) => {
@@ -98,7 +111,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_home",
-      icon: Home,
+      icon: HomeOutline,
       keySequence: "gh",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString()]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
@@ -110,7 +123,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_inbox",
-      icon: Inbox,
+      icon: InboxOutline,
       keySequence: "gx",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "notifications"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
@@ -122,7 +135,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_your_work",
-      icon: UserActivityIcon,
+      icon: ActivityOutline,
       keySequence: "gy",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "profile", currentUser?.id]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx) && hasWorkspaceMemberLevelPermissions(ctx),
@@ -134,7 +147,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_account_settings",
-      icon: Settings,
+      icon: SettingsOutline,
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "settings", "account"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
       isVisible: (ctx) => baseWorkspaceConditions(ctx),
@@ -145,7 +158,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "change-page",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.open_project",
-      icon: Briefcase,
+      icon: ProjectsOutline,
       keySequence: "op",
       page: "open-project",
       onSelect: (data, ctx) => {
@@ -161,7 +174,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_projects_list",
-      icon: Briefcase,
+      icon: ProjectsOutline,
       keySequence: "gp",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "projects"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
@@ -173,7 +186,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_all_workspace_work_items",
-      icon: Layers,
+      icon: WorkItemsOutline,
       action: (ctx) =>
         handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "workspace-views", "all-issues"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
@@ -185,7 +198,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_assigned_workspace_work_items",
-      icon: Layers,
+      icon: WorkItemsOutline,
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "workspace-views", "assigned"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
       isVisible: (ctx) => baseWorkspaceConditions(ctx),
@@ -196,7 +209,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_created_workspace_work_items",
-      icon: Layers,
+      icon: WorkItemsOutline,
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "workspace-views", "created"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
       isVisible: (ctx) => baseWorkspaceConditions(ctx),
@@ -207,7 +220,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_subscribed_workspace_work_items",
-      icon: Layers,
+      icon: WorkItemsOutline,
       action: (ctx) =>
         handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "workspace-views", "subscribed"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx),
@@ -219,7 +232,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_workspace_analytics",
-      icon: BarChart2,
+      icon: BarOutline,
       keySequence: "ga",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "analytics", "overview"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx) && hasWorkspaceMemberLevelPermissions(ctx),
@@ -231,7 +244,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_workspace_drafts",
-      icon: PenSquare,
+      icon: EditOutline,
       keySequence: "gj",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "drafts"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx) && hasWorkspaceMemberLevelPermissions(ctx),
@@ -243,7 +256,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_workspace_archives",
-      icon: ArchiveIcon,
+      icon: ArchiveOutline,
       keySequence: "gr",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "projects", "archives"]),
       isEnabled: (ctx) =>
@@ -257,7 +270,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "change-page",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.open_workspace_setting",
-      icon: Settings,
+      icon: SettingsOutline,
       keySequence: "os",
       page: "open-workspace-setting",
       onSelect: (data, ctx) => {
@@ -273,7 +286,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_workspace_settings",
-      icon: Settings,
+      icon: SettingsOutline,
       keySequence: "gs",
       action: (ctx) => handlePowerKNavigate(ctx, [ctx.params.workspaceSlug?.toString(), "settings"]),
       isEnabled: (ctx) => baseWorkspaceConditions(ctx) && !baseProjectConditions(ctx),
@@ -285,7 +298,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_work_items",
-      icon: LayersIcon,
+      icon: WorkItemsOutline,
       keySequence: "gi",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
@@ -303,7 +316,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "change-page",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.open_project_cycle",
-      icon: ContrastIcon,
+      icon: CyclesOutline,
       keySequence: "oc",
       page: "open-project-cycle",
       onSelect: (data, ctx) => {
@@ -327,7 +340,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_cycles",
-      icon: ContrastIcon,
+      icon: CyclesOutline,
       keySequence: "gc",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
@@ -347,7 +360,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "change-page",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.open_project_module",
-      icon: DiceIcon,
+      icon: ModuleOutline,
       keySequence: "om",
       page: "open-project-module",
       onSelect: (data, ctx) => {
@@ -371,7 +384,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_modules",
-      icon: DiceIcon,
+      icon: ModuleOutline,
       keySequence: "gm",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
@@ -391,7 +404,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "change-page",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.open_project_view",
-      icon: Layers,
+      icon: WorkItemsOutline,
       keySequence: "ov",
       page: "open-project-view",
       onSelect: (data, ctx) => {
@@ -413,7 +426,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_views",
-      icon: Layers,
+      icon: WorkItemsOutline,
       keySequence: "gv",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
@@ -431,7 +444,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_pages",
-      icon: FileText,
+      icon: DocumentationOutline,
       keySequence: "gd",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
@@ -449,7 +462,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_intake",
-      icon: Intake,
+      icon: IntakeOutline,
       keySequence: "gk",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
@@ -467,7 +480,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_archives",
-      icon: ArchiveIcon,
+      icon: ArchiveOutline,
       keySequence: "gr",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
@@ -486,7 +499,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "change-page",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.open_project_setting",
-      icon: Settings,
+      icon: SettingsOutline,
       keySequence: "os",
       page: "open-project-setting",
       onSelect: (data, ctx) => {
@@ -508,7 +521,7 @@ export const usePowerKNavigationCommandsRecord = (): Record<TPowerKNavigationCom
       type: "action",
       group: "navigation",
       i18n_title: "power_k.navigation_actions.nav_project_settings",
-      icon: Settings,
+      icon: SettingsOutline,
       keySequence: "gs",
       action: (ctx) =>
         handlePowerKNavigate(ctx, [
diff --git a/apps/web/core/components/power-k/config/preferences-commands.ts b/apps/web/core/components/power-k/config/preferences-commands.ts
index b1a9e971883..499db1cd6e8 100644
--- a/apps/web/core/components/power-k/config/preferences-commands.ts
+++ b/apps/web/core/components/power-k/config/preferences-commands.ts
@@ -6,7 +6,8 @@
 
 import { useCallback } from "react";
 import { useTheme } from "next-themes";
-import { Calendar, Earth, Languages, Palette } from "lucide-react";
+import { Languages } from "lucide-react";
+import { CalendarOutline, GlobeOutline, PaletteOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
@@ -109,7 +110,7 @@ export const usePowerKPreferencesCommands = (): TPowerKCommandConfig[] => {
       type: "change-page",
       page: "update-theme",
       i18n_title: "power_k.preferences_actions.update_theme",
-      icon: Palette,
+      icon: PaletteOutline,
       onSelect: (data) => {
         const theme = data as string;
         void handleUpdateTheme(theme);
@@ -124,7 +125,7 @@ export const usePowerKPreferencesCommands = (): TPowerKCommandConfig[] => {
       page: "update-timezone",
       type: "change-page",
       i18n_title: "power_k.preferences_actions.update_timezone",
-      icon: Earth,
+      icon: GlobeOutline,
       onSelect: (data) => {
         const timezone = data as string;
         handleUpdateTimezone(timezone);
@@ -139,7 +140,7 @@ export const usePowerKPreferencesCommands = (): TPowerKCommandConfig[] => {
       page: "update-start-of-week",
       type: "change-page",
       i18n_title: "power_k.preferences_actions.update_start_of_week",
-      icon: Calendar,
+      icon: CalendarOutline,
       onSelect: (data) => {
         const startOfWeek = data as EStartOfTheWeek;
         handleUpdateUserProfile({ start_of_the_week: startOfWeek });
diff --git a/apps/web/core/components/power-k/menus/cycles.tsx b/apps/web/core/components/power-k/menus/cycles.tsx
index 4714b26f261..b44107550a6 100644
--- a/apps/web/core/components/power-k/menus/cycles.tsx
+++ b/apps/web/core/components/power-k/menus/cycles.tsx
@@ -7,7 +7,7 @@
 import React from "react";
 import { observer } from "mobx-react";
 // plane imports
-import { ContrastIcon } from "@plane/propel/icons";
+import { CyclesOutline } from "@makeplane/propel/icons";
 import type { ICycle } from "@plane/types";
 // local imports
 import { PowerKMenuBuilder } from "./builder";
@@ -22,7 +22,7 @@ export const PowerKCyclesMenu = observer(function PowerKCyclesMenu({ cycles, onS
   return (
     <PowerKMenuBuilder
       items={cycles}
-      getIcon={() => ContrastIcon}
+      getIcon={() => CyclesOutline}
       getKey={(cycle) => cycle.id}
       getValue={(cycle) => cycle.name}
       getLabel={(cycle) => cycle.name}
diff --git a/apps/web/core/components/power-k/menus/views.tsx b/apps/web/core/components/power-k/menus/views.tsx
index 4404d851383..e56cff716d2 100644
--- a/apps/web/core/components/power-k/menus/views.tsx
+++ b/apps/web/core/components/power-k/menus/views.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { Layers } from "lucide-react";
+import { WorkItemsOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { IProjectView } from "@plane/types";
 // local imports
@@ -22,7 +22,7 @@ export const PowerKViewsMenu = observer(function PowerKViewsMenu({ views, onSele
     <PowerKMenuBuilder
       items={views}
       getKey={(view) => view.id}
-      getIcon={() => Layers}
+      getIcon={() => WorkItemsOutline}
       getValue={(view) => view.name}
       getLabel={(view) => view.name}
       onSelect={onSelect}
diff --git a/apps/web/core/components/power-k/ui/modal/command-item.tsx b/apps/web/core/components/power-k/ui/modal/command-item.tsx
index 18fdbd5bc4a..17f794b265c 100644
--- a/apps/web/core/components/power-k/ui/modal/command-item.tsx
+++ b/apps/web/core/components/power-k/ui/modal/command-item.tsx
@@ -7,7 +7,7 @@
 import React from "react";
 import { Command } from "cmdk";
 
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import { cn } from "@plane/utils";
 // local imports
@@ -40,7 +40,7 @@ export function PowerKModalCommandItem(props: Props) {
         {label}
       </div>
       <div className="flex shrink-0 items-center gap-2">
-        {isSelected && <CheckIcon className="size-3 shrink-0 text-secondary" />}
+        {isSelected && <TickOutline className="size-3 shrink-0 text-secondary" />}
         {keySequence && <KeySequenceBadge sequence={keySequence} />}
         {shortcut && <ShortcutBadge shortcut={shortcut} />}
       </div>
diff --git a/apps/web/core/components/power-k/ui/modal/context-indicator.tsx b/apps/web/core/components/power-k/ui/modal/context-indicator.tsx
index 3c0f1ac7543..d678054a6f8 100644
--- a/apps/web/core/components/power-k/ui/modal/context-indicator.tsx
+++ b/apps/web/core/components/power-k/ui/modal/context-indicator.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { X } from "lucide-react";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 // local imports
@@ -44,7 +44,7 @@ export function PowerKModalContextIndicator(props: Props) {
           aria-label="Clear context (Backspace)"
           tabIndex={-1}
         >
-          <X className="size-2.5" />
+          <CloseOutline className="size-2.5" />
         </button>
       </div>
     </div>
diff --git a/apps/web/core/components/power-k/ui/modal/header.tsx b/apps/web/core/components/power-k/ui/modal/header.tsx
index 4b567b733e9..f86c6f143d5 100644
--- a/apps/web/core/components/power-k/ui/modal/header.tsx
+++ b/apps/web/core/components/power-k/ui/modal/header.tsx
@@ -6,10 +6,9 @@
 
 import React from "react";
 import { Command } from "cmdk";
-import { X } from "lucide-react";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 // plane imports
-import { SearchIcon } from "@plane/propel/icons";
 // local imports
 import type { TPowerKContext, TPowerKPageType } from "../../core/types";
 import { POWER_K_MODAL_PAGE_DETAILS } from "./constants";
@@ -43,7 +42,7 @@ export function PowerKModalHeader(props: Props) {
 
       {/* Search Input */}
       <div className="flex items-center gap-2 px-4 py-3">
-        <SearchIcon className="size-4 shrink-0 text-placeholder" />
+        <SearchOutline className="size-4 shrink-0 text-placeholder" />
         <Command.Input
           value={searchTerm}
           onValueChange={onSearchChange}
@@ -56,7 +55,7 @@ export function PowerKModalHeader(props: Props) {
             onClick={() => onSearchChange("")}
             className="flex-shrink-0 rounded-sm p-1 text-placeholder hover:bg-layer-1 hover:text-secondary"
           >
-            <X className="h-3 w-3" />
+            <CloseOutline className="h-3 w-3" />
           </button>
         )}
       </div>
diff --git a/apps/web/core/components/power-k/ui/modal/no-results-command.tsx b/apps/web/core/components/power-k/ui/modal/no-results-command.tsx
index a926df09e07..528af77450c 100644
--- a/apps/web/core/components/power-k/ui/modal/no-results-command.tsx
+++ b/apps/web/core/components/power-k/ui/modal/no-results-command.tsx
@@ -6,7 +6,7 @@
 
 import { Command } from "cmdk";
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon } from "@plane/propel/icons";
+import { SearchOutline } from "@makeplane/propel/icons";
 // components
 import type { TPowerKContext } from "@/components/power-k/core/types";
 import { PowerKModalCommandItem } from "@/components/power-k/ui/modal/command-item";
@@ -25,7 +25,7 @@ export function PowerKModalNoSearchResultsCommand(props: TPowerKModalNoSearchRes
   return (
     <Command.Group>
       <PowerKModalCommandItem
-        icon={SearchIcon}
+        icon={SearchOutline}
         value="no-results"
         label={
           <p className="flex items-center gap-2">
diff --git a/apps/web/core/components/power-k/ui/modal/search-results-map.tsx b/apps/web/core/components/power-k/ui/modal/search-results-map.tsx
index 2ce27313f6d..e337258b7e4 100644
--- a/apps/web/core/components/power-k/ui/modal/search-results-map.tsx
+++ b/apps/web/core/components/power-k/ui/modal/search-results-map.tsx
@@ -4,9 +4,15 @@
  * See the LICENSE file for details.
  */
 
-import { Briefcase, FileText, Layers, LayoutGrid } from "lucide-react";
+import {
+  CyclesOutline,
+  DocumentationOutline,
+  GridOutline,
+  ModuleOutline,
+  ProjectsOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 // plane imports
-import { ContrastIcon, DiceIcon } from "@plane/propel/icons";
 import type {
   IWorkspaceDefaultSearchResult,
   IWorkspaceIssueSearchResult,
@@ -28,7 +34,7 @@ export type TPowerKSearchResultGroupDetails = {
 
 export const POWER_K_SEARCH_RESULTS_GROUPS_MAP: Record<TPowerKSearchResultsKeys, TPowerKSearchResultGroupDetails> = {
   cycle: {
-    icon: ContrastIcon,
+    icon: CyclesOutline,
     itemName: (cycle: IWorkspaceDefaultSearchResult) => (
       <p>
         <span className="text-11 text-tertiary">{cycle.project__identifier}</span> {cycle.name}
@@ -62,7 +68,7 @@ export const POWER_K_SEARCH_RESULTS_GROUPS_MAP: Record<TPowerKSearchResultsKeys,
     title: "Work items",
   },
   issue_view: {
-    icon: Layers,
+    icon: WorkItemsOutline,
     itemName: (view: IWorkspaceDefaultSearchResult) => (
       <p>
         <span className="text-11 text-tertiary">{view.project__identifier}</span> {view.name}
@@ -73,7 +79,7 @@ export const POWER_K_SEARCH_RESULTS_GROUPS_MAP: Record<TPowerKSearchResultsKeys,
     title: "Views",
   },
   module: {
-    icon: DiceIcon,
+    icon: ModuleOutline,
     itemName: (module: IWorkspaceDefaultSearchResult) => (
       <p>
         <span className="text-11 text-tertiary">{module.project__identifier}</span> {module.name}
@@ -84,7 +90,7 @@ export const POWER_K_SEARCH_RESULTS_GROUPS_MAP: Record<TPowerKSearchResultsKeys,
     title: "Modules",
   },
   page: {
-    icon: FileText,
+    icon: DocumentationOutline,
     itemName: (page: IWorkspacePageSearchResult) => (
       <p>
         <span className="text-11 text-tertiary">{page.project__identifiers?.[0]}</span> {page.name}
@@ -100,13 +106,13 @@ export const POWER_K_SEARCH_RESULTS_GROUPS_MAP: Record<TPowerKSearchResultsKeys,
     title: "Pages",
   },
   project: {
-    icon: Briefcase,
+    icon: ProjectsOutline,
     itemName: (project: IWorkspaceProjectSearchResult) => project?.name,
     path: (project: IWorkspaceProjectSearchResult) => `/${project?.workspace__slug}/projects/${project?.id}/issues/`,
     title: "Projects",
   },
   workspace: {
-    icon: LayoutGrid,
+    icon: GridOutline,
     itemName: (workspace: IWorkspaceSearchResult) => workspace?.name,
     path: (workspace: IWorkspaceSearchResult) => `/${workspace?.slug}/`,
     title: "Workspaces",
diff --git a/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx b/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx
index 2f9be5add2a..97971429a24 100644
--- a/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx
+++ b/apps/web/core/components/power-k/ui/modal/shortcuts-root.tsx
@@ -8,7 +8,7 @@ import { useState, Fragment } from "react";
 import { Dialog, Transition } from "@headlessui/react";
 // plane imports
 import { Input, InputGroup } from "@makeplane/propel/components/input";
-import { CloseIcon, SearchIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import { ScrollArea } from "@plane/propel/scrollarea";
 
 // hooks
@@ -67,12 +67,12 @@ export function ShortcutsModal(props: Props) {
                   <Dialog.Title as="h3" className="flex justify-between px-5">
                     <span className="text-16 font-medium">Keyboard shortcuts</span>
                     <button type="button" onClick={handleClose}>
-                      <CloseIcon className="h-4 w-4 text-secondary hover:text-primary" aria-hidden="true" />
+                      <CloseOutline className="h-4 w-4 text-secondary hover:text-primary" aria-hidden="true" />
                     </button>
                   </Dialog.Title>
                   <div className="px-5">
                     <InputGroup size="2xl">
-                      <SearchIcon className="h-3.5 w-3.5 text-secondary" />
+                      <SearchOutline className="h-3.5 w-3.5 text-secondary" />
                       <Input
                         size="2xl"
                         id="search"
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/cycle/commands.ts b/apps/web/core/components/power-k/ui/pages/context-based/cycle/commands.ts
index 26dce16558c..a86c79f6c6b 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/cycle/commands.ts
+++ b/apps/web/core/components/power-k/ui/pages/context-based/cycle/commands.ts
@@ -6,11 +6,11 @@
 
 import { useCallback } from "react";
 import { useParams } from "next/navigation";
-import { Star, StarOff } from "lucide-react";
+import { StarOff } from "lucide-react";
+import { LinkOutline, StarOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon } from "@plane/propel/icons";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { copyTextToClipboard } from "@plane/utils";
 // components
@@ -74,7 +74,7 @@ export const usePowerKCycleContextBasedActions = (): TPowerKCommandConfig[] => {
       i18n_title: isFavorite
         ? "power_k.contextual_actions.cycle.remove_from_favorites"
         : "power_k.contextual_actions.cycle.add_to_favorites",
-      icon: isFavorite ? StarOff : Star,
+      icon: isFavorite ? StarOff : StarOutline,
       group: "contextual",
       contextType: "cycle",
       type: "action",
@@ -87,7 +87,7 @@ export const usePowerKCycleContextBasedActions = (): TPowerKCommandConfig[] => {
     {
       id: "copy_cycle_url",
       i18n_title: "power_k.contextual_actions.cycle.copy_url",
-      icon: LinkIcon,
+      icon: LinkOutline,
       group: "contextual",
       contextType: "cycle",
       type: "action",
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/module/commands.tsx b/apps/web/core/components/power-k/ui/pages/context-based/module/commands.tsx
index 891197be827..28a910219e1 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/module/commands.tsx
+++ b/apps/web/core/components/power-k/ui/pages/context-based/module/commands.tsx
@@ -6,11 +6,12 @@
 
 import { useCallback } from "react";
 import { useParams } from "next/navigation";
-import { Star, StarOff, Users } from "lucide-react";
+import { StarOff } from "lucide-react";
+import { LinkOutline, MembersOutline, StarOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, ModuleStatusIcon } from "@plane/propel/icons";
+import { ModuleStatusIcon } from "@plane/propel/icons";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import type { IModule, TModuleStatus } from "@plane/types";
 import { EUserPermissions } from "@plane/types";
@@ -103,7 +104,7 @@ export const usePowerKModuleContextBasedActions = (): TPowerKCommandConfig[] =>
     {
       id: "add_remove_module_members",
       i18n_title: "power_k.contextual_actions.module.add_remove_members",
-      icon: Users,
+      icon: MembersOutline,
       group: "contextual",
       contextType: "module",
       type: "change-page",
@@ -139,7 +140,7 @@ export const usePowerKModuleContextBasedActions = (): TPowerKCommandConfig[] =>
       i18n_title: isFavorite
         ? "power_k.contextual_actions.module.remove_from_favorites"
         : "power_k.contextual_actions.module.add_to_favorites",
-      icon: isFavorite ? StarOff : Star,
+      icon: isFavorite ? StarOff : StarOutline,
       group: "contextual",
       contextType: "module",
       type: "action",
@@ -152,7 +153,7 @@ export const usePowerKModuleContextBasedActions = (): TPowerKCommandConfig[] =>
     {
       id: "copy_module_url",
       i18n_title: "power_k.contextual_actions.module.copy_url",
-      icon: LinkIcon,
+      icon: LinkOutline,
       group: "contextual",
       contextType: "module",
       type: "action",
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/page/commands.ts b/apps/web/core/components/power-k/ui/pages/context-based/page/commands.ts
index 7bbea537826..ecede47deb1 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/page/commands.ts
+++ b/apps/web/core/components/power-k/ui/pages/context-based/page/commands.ts
@@ -6,10 +6,19 @@
 
 import { useCallback } from "react";
 import { useParams } from "next/navigation";
-import { ArchiveIcon, ArchiveRestoreIcon, LockKeyhole, LockKeyholeOpen, Star, StarOff } from "lucide-react";
+import { StarOff } from "lucide-react";
+import {
+  ArchiveOutline,
+  GlobeOutline,
+  LinkOutline,
+  LockOutline,
+  LockedOutline,
+  RestoreOutline,
+  StarOutline,
+  UnlockedOutline,
+} from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 // plane imports
-import { LinkIcon, GlobeIcon, LockIcon } from "@plane/propel/icons";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EPageAccess } from "@plane/types";
 import { copyTextToClipboard } from "@plane/utils";
@@ -80,7 +89,7 @@ export const usePowerKPageContextBasedActions = (): TPowerKCommandConfig[] => {
     {
       id: "toggle_page_lock",
       i18n_title: isLocked ? "power_k.contextual_actions.page.unlock" : "power_k.contextual_actions.page.lock",
-      icon: isLocked ? LockKeyholeOpen : LockKeyhole,
+      icon: isLocked ? UnlockedOutline : LockedOutline,
       group: "contextual",
       contextType: "page",
       type: "action",
@@ -107,7 +116,7 @@ export const usePowerKPageContextBasedActions = (): TPowerKCommandConfig[] => {
         access === EPageAccess.PUBLIC
           ? "power_k.contextual_actions.page.make_private"
           : "power_k.contextual_actions.page.make_public",
-      icon: access === EPageAccess.PUBLIC ? LockIcon : GlobeIcon,
+      icon: access === EPageAccess.PUBLIC ? LockOutline : GlobeOutline,
       group: "contextual",
       contextType: "page",
       type: "action",
@@ -129,7 +138,7 @@ export const usePowerKPageContextBasedActions = (): TPowerKCommandConfig[] => {
     {
       id: "toggle_page_archive",
       i18n_title: archived_at ? "power_k.contextual_actions.page.restore" : "power_k.contextual_actions.page.archive",
-      icon: archived_at ? ArchiveRestoreIcon : ArchiveIcon,
+      icon: archived_at ? RestoreOutline : ArchiveOutline,
       group: "contextual",
       contextType: "page",
       type: "action",
@@ -153,7 +162,7 @@ export const usePowerKPageContextBasedActions = (): TPowerKCommandConfig[] => {
       i18n_title: isFavorite
         ? "power_k.contextual_actions.page.remove_from_favorites"
         : "power_k.contextual_actions.page.add_to_favorites",
-      icon: isFavorite ? StarOff : Star,
+      icon: isFavorite ? StarOff : StarOutline,
       group: "contextual",
       contextType: "page",
       type: "action",
@@ -166,7 +175,7 @@ export const usePowerKPageContextBasedActions = (): TPowerKCommandConfig[] => {
     {
       id: "copy_page_url",
       i18n_title: "power_k.contextual_actions.page.copy_url",
-      icon: LinkIcon,
+      icon: LinkOutline,
       group: "contextual",
       contextType: "page",
       type: "action",
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/commands.ts b/apps/web/core/components/power-k/ui/pages/context-based/work-item/commands.ts
index 888260c9a28..4c7e58a22ef 100644
--- a/apps/web/core/components/power-k/ui/pages/context-based/work-item/commands.ts
+++ b/apps/web/core/components/power-k/ui/pages/context-based/work-item/commands.ts
@@ -6,22 +6,24 @@
 
 import { useCallback } from "react";
 import { useParams } from "next/navigation";
+import { Signal, TicketCheck, Triangle } from "lucide-react";
 import {
-  Bell,
-  BellOff,
-  Signal,
-  TagIcon,
-  TicketCheck,
-  Triangle,
-  Type,
-  UserMinus2,
-  UserPlus2,
-  Users,
-} from "lucide-react";
+  CyclesOutline,
+  DeleteOutline,
+  LabelsOutline,
+  LinkOutline,
+  MembersOutline,
+  ModuleOutline,
+  StateOutline,
+  SubscribeOutline,
+  TextOutline,
+  UnsubscribeOutline,
+  UserMinusOutline,
+  UserPlusOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, TrashIcon, ContrastIcon, DiceIcon, DoubleCircleIcon } from "@plane/propel/icons";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import type { ICycle, IIssueLabel, IModule, TIssue, TIssuePriorities } from "@plane/types";
 import { EIssueServiceType, EUserPermissions } from "@plane/types";
@@ -199,7 +201,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "change_work_item_state",
       i18n_title: "power_k.contextual_actions.work_item.change_state",
-      icon: DoubleCircleIcon,
+      icon: StateOutline,
       group: "contextual",
       contextType: "work-item",
       type: "change-page",
@@ -239,7 +241,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "change_work_item_assignees",
       i18n_title: "power_k.contextual_actions.work_item.change_assignees",
-      icon: Users,
+      icon: MembersOutline,
       group: "contextual",
       contextType: "work-item",
       type: "change-page",
@@ -258,7 +260,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
       i18n_title: isCurrentUserAssigned
         ? "power_k.contextual_actions.work_item.unassign_from_me"
         : "power_k.contextual_actions.work_item.assign_to_me",
-      icon: isCurrentUserAssigned ? UserMinus2 : UserPlus2,
+      icon: isCurrentUserAssigned ? UserMinusOutline : UserPlusOutline,
       group: "contextual",
       contextType: "work-item",
       type: "action",
@@ -294,7 +296,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "add_work_item_to_cycle",
       i18n_title: "power_k.contextual_actions.work_item.add_to_cycle",
-      icon: ContrastIcon,
+      icon: CyclesOutline,
       group: "contextual",
       contextType: "work-item",
       type: "change-page",
@@ -334,7 +336,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "add_work_item_to_modules",
       i18n_title: "power_k.contextual_actions.work_item.add_to_modules",
-      icon: DiceIcon,
+      icon: ModuleOutline,
       group: "contextual",
       contextType: "work-item",
       type: "change-page",
@@ -366,7 +368,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "add_work_item_labels",
       i18n_title: "power_k.contextual_actions.work_item.add_labels",
-      icon: TagIcon,
+      icon: LabelsOutline,
       group: "contextual",
       contextType: "work-item",
       type: "change-page",
@@ -391,7 +393,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
       i18n_title: isSubscribed
         ? "power_k.contextual_actions.work_item.unsubscribe"
         : "power_k.contextual_actions.work_item.subscribe",
-      icon: isSubscribed ? BellOff : Bell,
+      icon: isSubscribed ? UnsubscribeOutline : SubscribeOutline,
       group: "contextual",
       contextType: "work-item",
       type: "action",
@@ -404,7 +406,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "delete_work_item",
       i18n_title: "power_k.contextual_actions.work_item.delete",
-      icon: TrashIcon,
+      icon: DeleteOutline,
       group: "contextual",
       contextType: "work-item",
       type: "action",
@@ -430,7 +432,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "copy_work_item_title",
       i18n_title: "power_k.contextual_actions.work_item.copy_title",
-      icon: Type,
+      icon: TextOutline,
       group: "contextual",
       contextType: "work-item",
       type: "action",
@@ -443,7 +445,7 @@ export const usePowerKWorkItemContextBasedCommands = (): TPowerKCommandConfig[]
     {
       id: "copy_work_item_url",
       i18n_title: "power_k.contextual_actions.work_item.copy_url",
-      icon: LinkIcon,
+      icon: LinkOutline,
       group: "contextual",
       contextType: "work-item",
       type: "action",
diff --git a/apps/web/core/components/profile/activity/activity-list.tsx b/apps/web/core/components/profile/activity/activity-list.tsx
index 064270bcc6b..dbdb43aba26 100644
--- a/apps/web/core/components/profile/activity/activity-list.tsx
+++ b/apps/web/core/components/profile/activity/activity-list.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 import Link from "next/link";
 import { useParams } from "next/navigation";
-import { History, MessageSquare } from "lucide-react";
+import { ChatOutline, HistoryOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { IUserActivityResponse } from "@plane/types";
 import { calculateTimeAgo, getFileURL } from "@plane/utils";
@@ -45,7 +45,9 @@ export const ActivityList = observer(function ActivityList(props: Props) {
                   <div className="relative flex items-start space-x-3">
                     <div className="relative px-1">
                       {activityItem.field ? (
-                        activityItem.new_value === "restore" && <History className="h-3.5 w-3.5 text-secondary" />
+                        activityItem.new_value === "restore" && (
+                          <HistoryOutline className="h-3.5 w-3.5 text-secondary" />
+                        )
                       ) : activityItem.actor_detail.avatar_url && activityItem.actor_detail.avatar_url !== "" ? (
                         <img
                           src={getFileURL(activityItem.actor_detail.avatar_url)}
@@ -61,7 +63,7 @@ export const ActivityList = observer(function ActivityList(props: Props) {
                       )}
 
                       <span className="flex h-6 w-6 items-center justify-center rounded-full bg-layer-1 text-secondary ring-6 ring-white">
-                        <MessageSquare className="h-6 w-6 !text-20 text-secondary" aria-hidden="true" />
+                        <ChatOutline className="h-6 w-6 !text-20 text-secondary" aria-hidden="true" />
                       </span>
                     </div>
                     <div className="min-w-0 flex-1">
@@ -120,7 +122,7 @@ export const ActivityList = observer(function ActivityList(props: Props) {
                               <div className="flex h-6 w-6 items-center justify-center">
                                 {activityItem.field ? (
                                   activityItem.new_value === "restore" ? (
-                                    <History className="h-5 w-5 text-secondary" />
+                                    <HistoryOutline className="h-5 w-5 text-secondary" />
                                   ) : (
                                     <ActivityIcon activity={activityItem} />
                                   )
diff --git a/apps/web/core/components/profile/overview/stats.tsx b/apps/web/core/components/profile/overview/stats.tsx
index 9431cc8115b..c4ac86ecc2d 100644
--- a/apps/web/core/components/profile/overview/stats.tsx
+++ b/apps/web/core/components/profile/overview/stats.tsx
@@ -9,7 +9,8 @@ import { useParams } from "next/navigation";
 
 // ui
 import { useTranslation } from "@plane/i18n";
-import { UserCirclePropertyIcon, CreateIcon, LayerStackIcon } from "@plane/propel/icons";
+import { LayerStackIcon } from "@plane/propel/icons";
+import { AddOutline, UserOutline } from "@makeplane/propel/icons";
 import type { IUserProfileData } from "@plane/types";
 import { Loader, Card, ECardSpacing, ECardDirection } from "@plane/ui";
 // types
@@ -25,13 +26,13 @@ export function ProfileStats({ userProfile }: Props) {
 
   const overviewCards = [
     {
-      icon: CreateIcon,
+      icon: AddOutline,
       route: "created",
       i18n_title: "profile.stats.created",
       value: userProfile?.created_issues ?? "...",
     },
     {
-      icon: UserCirclePropertyIcon,
+      icon: UserOutline,
       route: "assigned",
       i18n_title: "profile.stats.assigned",
       value: userProfile?.assigned_issues ?? "...",
diff --git a/apps/web/core/components/profile/sidebar.tsx b/apps/web/core/components/profile/sidebar.tsx
index 0fec7dd8a35..4bb2cbed6c0 100644
--- a/apps/web/core/components/profile/sidebar.tsx
+++ b/apps/web/core/components/profile/sidebar.tsx
@@ -13,7 +13,7 @@ import { useOutsideClickDetector } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
 import { Logo } from "@plane/propel/emoji-icon-picker";
 import { IconButton } from "@plane/propel/icon-button";
-import { EditIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, EditOutline } from "@makeplane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IUserProfileProjectSegregation } from "@plane/types";
 import { Loader } from "@plane/ui";
@@ -99,7 +99,7 @@ export const ProfileSidebar = observer(function ProfileSidebar(props: TProfileSi
               <div className="absolute top-3.5 right-3.5">
                 <IconButton
                   variant="secondary"
-                  icon={EditIcon}
+                  icon={EditOutline}
                   onClick={() =>
                     toggleProfileSettingsModal({
                       activeTab: "general",
@@ -185,7 +185,7 @@ export const ProfileSidebar = observer(function ProfileSidebar(props: TProfileSi
                                 </div>
                               </Tooltip>
                             )}
-                            <ChevronDownIcon className="h-4 w-4" />
+                            <ChevronDownOutline className="h-4 w-4" />
                           </div>
                         </Disclosure.Button>
                         <Transition
diff --git a/apps/web/core/components/project-states/group-item.tsx b/apps/web/core/components/project-states/group-item.tsx
index ad3013ca123..ca8bca366d9 100644
--- a/apps/web/core/components/project-states/group-item.tsx
+++ b/apps/web/core/components/project-states/group-item.tsx
@@ -10,7 +10,8 @@ import { observer } from "mobx-react";
 // plane imports
 import { EIconSize } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon, StateGroupIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { StateGroupIcon } from "@plane/propel/icons";
+import { AddOutline, ChevronDownOutline } from "@makeplane/propel/icons";
 import type { IState, TStateGroups, TStateOperationsCallbacks } from "@plane/types";
 import { cn } from "@plane/utils";
 // components
@@ -71,7 +72,7 @@ export const GroupItem = observer(function GroupItem(props: TGroupItem) {
               }
             )}
           >
-            <ChevronDownIcon className="h-4 w-4" />
+            <ChevronDownOutline className="h-4 w-4" />
           </div>
           <div className="flex h-6 w-6 flex-shrink-0 items-center justify-center overflow-hidden rounded-sm">
             <StateGroupIcon stateGroup={groupKey} size={EIconSize.XL} />
@@ -92,7 +93,7 @@ export const GroupItem = observer(function GroupItem(props: TGroupItem) {
           }}
           disabled={!isEditable || createState}
         >
-          <PlusIcon className="h-4 w-4" />
+          <AddOutline className="h-4 w-4" />
         </button>
       </div>
 
diff --git a/apps/web/core/components/project-states/options/delete.tsx b/apps/web/core/components/project-states/options/delete.tsx
index 32cd487dc99..44747afaf32 100644
--- a/apps/web/core/components/project-states/options/delete.tsx
+++ b/apps/web/core/components/project-states/options/delete.tsx
@@ -6,8 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { Loader } from "lucide-react";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, LoadingOutline } from "@makeplane/propel/icons";
 // plane imports
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -93,7 +92,11 @@ export const StateDelete = observer(function StateDelete(props: TStateDelete) {
           layout="stacked"
           disabled={!isDeleteDisabled || isMobile}
         >
-          {isDelete ? <Loader className="h-3.5 w-3.5 text-secondary" /> : <CloseIcon className="h-3.5 w-3.5" />}
+          {isDelete ? (
+            <LoadingOutline className="h-3.5 w-3.5 text-secondary" />
+          ) : (
+            <CloseOutline className="h-3.5 w-3.5" />
+          )}
         </Tooltip>
       </button>
     </>
diff --git a/apps/web/core/components/project-states/state-item-title.tsx b/apps/web/core/components/project-states/state-item-title.tsx
index be0ae5fb044..da953ffff0e 100644
--- a/apps/web/core/components/project-states/state-item-title.tsx
+++ b/apps/web/core/components/project-states/state-item-title.tsx
@@ -6,10 +6,10 @@
 
 import type { SetStateAction } from "react";
 import { observer } from "mobx-react";
-import { GripVertical } from "lucide-react";
+import { DragDropOutline, EditOutline } from "@makeplane/propel/icons";
 import { EIconSize } from "@plane/constants";
 // plane imports
-import { EditIcon, StateGroupIcon } from "@plane/propel/icons";
+import { StateGroupIcon } from "@plane/propel/icons";
 import type { IState, TStateOperationsCallbacks } from "@plane/types";
 // local imports
 import { useProjectState } from "@/hooks/store/use-project-state";
@@ -47,7 +47,7 @@ export const StateItemTitle = observer(function StateItemTitle(props: TStateItem
         {/* draggable indicator */}
         {!disabled && stateCount != 1 && (
           <div className="absolute -left-1.5 hidden h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center rounded-xs bg-surface-2 text-secondary transition-colors group-hover:flex hover:text-primary">
-            <GripVertical className="h-3 w-3" />
+            <DragDropOutline className="h-3 w-3" />
           </div>
         )}
         {/* state icon */}
@@ -76,7 +76,7 @@ export const StateItemTitle = observer(function StateItemTitle(props: TStateItem
               className="flex h-5 w-5 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden rounded-sm text-secondary transition-colors hover:bg-layer-1 hover:text-primary"
               onClick={() => setUpdateStateModal(true)}
             >
-              <EditIcon className="h-3 w-3" />
+              <EditOutline className="h-3 w-3" />
             </button>
             <StateDelete
               totalStates={stateCount}
diff --git a/apps/web/core/components/project/applied-filters/access.tsx b/apps/web/core/components/project/applied-filters/access.tsx
index 15f5b59ccf5..ddeccb3b5e7 100644
--- a/apps/web/core/components/project/applied-filters/access.tsx
+++ b/apps/web/core/components/project/applied-filters/access.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 // constants
 import { NETWORK_CHOICES } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 
 type Props = {
   handleRemove: (val: string) => void;
@@ -33,7 +33,7 @@ export const AppliedAccessFilters = observer(function AppliedAccessFilters(props
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(status)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/project/applied-filters/date.tsx b/apps/web/core/components/project/applied-filters/date.tsx
index ec7610548f3..15acbf2cb40 100644
--- a/apps/web/core/components/project/applied-filters/date.tsx
+++ b/apps/web/core/components/project/applied-filters/date.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { PROJECT_CREATED_AT_FILTER_OPTIONS } from "@plane/constants";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // helpers
 import { renderFormattedDate, capitalizeFirstLetter } from "@plane/utils";
 // constants
@@ -50,7 +50,7 @@ export const AppliedDateFilters = observer(function AppliedDateFilters(props: Pr
               className="grid place-items-center text-tertiary hover:text-secondary"
               onClick={() => handleRemove(date)}
             >
-              <CloseIcon height={10} width={10} strokeWidth={2} />
+              <CloseOutline height={10} width={10} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/project/applied-filters/members.tsx b/apps/web/core/components/project/applied-filters/members.tsx
index 35344a7e8b5..c5e356de65b 100644
--- a/apps/web/core/components/project/applied-filters/members.tsx
+++ b/apps/web/core/components/project/applied-filters/members.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Avatar } from "@makeplane/propel/components/avatar";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // helpers
 import { getFileURL } from "@plane/utils";
 // types
@@ -47,7 +47,7 @@ export const AppliedMembersFilters = observer(function AppliedMembersFilters(pro
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(memberId)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/project/applied-filters/project-display-filters.tsx b/apps/web/core/components/project/applied-filters/project-display-filters.tsx
index 2ca36c807f3..70c30262577 100644
--- a/apps/web/core/components/project/applied-filters/project-display-filters.tsx
+++ b/apps/web/core/components/project/applied-filters/project-display-filters.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 // types
 import { PROJECT_DISPLAY_FILTER_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { TProjectAppliedDisplayFilterKeys } from "@plane/types";
 // constants
 
@@ -36,7 +36,7 @@ export const AppliedProjectDisplayFilters = observer(function AppliedProjectDisp
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(key)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/project/applied-filters/root.tsx b/apps/web/core/components/project/applied-filters/root.tsx
index 7e418cc9d15..330058e08aa 100644
--- a/apps/web/core/components/project/applied-filters/root.tsx
+++ b/apps/web/core/components/project/applied-filters/root.tsx
@@ -6,7 +6,7 @@
 
 import { useTranslation } from "@plane/i18n";
 import { PillButton } from "@makeplane/propel/components/pill";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { TProjectAppliedDisplayFilterKeys, TProjectFilters } from "@plane/types";
@@ -93,7 +93,7 @@ export function ProjectAppliedFiltersList(props: Props) {
                   className="grid place-items-center text-tertiary hover:text-secondary"
                   onClick={() => handleRemoveFilter(filterKey, null)}
                 >
-                  <CloseIcon height={12} width={12} strokeWidth={2} />
+                  <CloseOutline height={12} width={12} />
                 </button>
               )}
             </div>
@@ -119,7 +119,7 @@ export function ProjectAppliedFiltersList(props: Props) {
             size="md"
             variant="outline"
             label={t("common.clear_all")}
-            endIcon={<CloseIcon height={12} width={12} strokeWidth={2} />}
+            endIcon={<CloseOutline height={12} width={12} />}
             onClick={handleClearAllFilters}
           />
         )}
diff --git a/apps/web/core/components/project/card.tsx b/apps/web/core/components/project/card.tsx
index 0a038b193bb..45dbcb1ae86 100644
--- a/apps/web/core/components/project/card.tsx
+++ b/apps/web/core/components/project/card.tsx
@@ -8,14 +8,22 @@ import React, { useRef, useState } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
 import { useParams } from "next/navigation";
-import { ArchiveRestoreIcon, Settings, UserPlus } from "lucide-react";
+import {
+  DeleteOutline,
+  LinkOutline,
+  LockOutline,
+  NewTabOutline,
+  RestoreOutline,
+  SettingsOutline,
+  TickOutline,
+  UserPlusOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel, IS_FAVORITE_MENU_OPEN } from "@plane/constants";
 import { useLocalStorage } from "@plane/hooks";
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { Button } from "@plane/propel/button";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { LinkIcon, LockIcon, NewTabIcon, TrashIcon, CheckIcon } from "@plane/propel/icons";
 import { setPromiseToast, setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IProject } from "@plane/types";
@@ -129,42 +137,42 @@ export const ProjectCard = observer(function ProjectCard(props: Props) {
       key: "settings",
       action: () => router.push(`/${workspaceSlug}/settings/projects/${project.id}`),
       title: "Settings",
-      icon: Settings,
+      icon: SettingsOutline,
       shouldRender: !isArchived && (hasAdminRole || hasMemberRole),
     },
     {
       key: "join",
       action: () => setJoinProjectModal(true),
       title: "Join",
-      icon: UserPlus,
+      icon: UserPlusOutline,
       shouldRender: !isMemberOfProject && !isArchived,
     },
     {
       key: "open-new-tab",
       action: handleOpenInNewTab,
       title: "Open in new tab",
-      icon: NewTabIcon,
+      icon: NewTabOutline,
       shouldRender: !isMemberOfProject && !isArchived,
     },
     {
       key: "copy-link",
       action: handleCopyText,
       title: "Copy link",
-      icon: LinkIcon,
+      icon: LinkOutline,
       shouldRender: !isArchived,
     },
     {
       key: "restore",
       action: () => setRestoreProject(true),
       title: "Restore",
-      icon: ArchiveRestoreIcon,
+      icon: RestoreOutline,
       shouldRender: isArchived && hasAdminRole,
     },
     {
       key: "delete",
       action: () => setDeleteProjectModal(true),
       title: "Delete",
-      icon: TrashIcon,
+      icon: DeleteOutline,
       shouldRender: isArchived && hasAdminRole,
     },
   ];
@@ -231,7 +239,7 @@ export const ProjectCard = observer(function ProjectCard(props: Props) {
                 <h3 className="truncate font-semibold text-on-color">{project.name}</h3>
                 <span className="flex items-center gap-1.5">
                   <p className="text-11 font-medium text-on-color">{project.identifier} </p>
-                  {project.network === 0 && <LockIcon className="h-2.5 w-2.5 text-on-color" />}
+                  {project.network === 0 && <LockOutline className="h-2.5 w-2.5 text-on-color" />}
                 </span>
               </div>
             </div>
@@ -246,7 +254,7 @@ export const ProjectCard = observer(function ProjectCard(props: Props) {
                     handleCopyText();
                   }}
                 >
-                  <LinkIcon className="h-3 w-3 text-on-color" />
+                  <LinkOutline className="h-3 w-3 text-on-color" />
                 </button>
                 {shouldRenderFavorite && (
                   <FavoriteStar
@@ -320,7 +328,7 @@ export const ProjectCard = observer(function ProjectCard(props: Props) {
                     }}
                   >
                     <div className="flex items-center gap-1.5">
-                      <ArchiveRestoreIcon className="h-3.5 w-3.5" />
+                      <RestoreOutline className="h-3.5 w-3.5" />
                       Restore
                     </div>
                   </div>
@@ -332,7 +340,7 @@ export const ProjectCard = observer(function ProjectCard(props: Props) {
                       setDeleteProjectModal(true);
                     }}
                   >
-                    <TrashIcon className="h-3.5 w-3.5" />
+                    <DeleteOutline className="h-3.5 w-3.5" />
                   </div>
                 </div>
               )
@@ -347,11 +355,11 @@ export const ProjectCard = observer(function ProjectCard(props: Props) {
                       }}
                       href={`/${workspaceSlug}/settings/projects/${project.id}`}
                     >
-                      <Settings className="h-3.5 w-3.5" />
+                      <SettingsOutline className="h-3.5 w-3.5" />
                     </Link>
                   ) : (
                     <span className="flex items-center gap-1 text-13 text-placeholder">
-                      <CheckIcon className="h-3.5 w-3.5" />
+                      <TickOutline className="h-3.5 w-3.5" />
                       Joined
                     </span>
                   ))}
diff --git a/apps/web/core/components/project/confirm-project-member-remove.tsx b/apps/web/core/components/project/confirm-project-member-remove.tsx
index 52a7c30600e..04145f1a87e 100644
--- a/apps/web/core/components/project/confirm-project-member-remove.tsx
+++ b/apps/web/core/components/project/confirm-project-member-remove.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { AlertTriangle } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 // types
 import { Button } from "@plane/propel/button";
 import type { IUserLite } from "@plane/types";
@@ -57,7 +57,7 @@ export const ConfirmProjectMemberRemove = observer(function ConfirmProjectMember
       <div className="bg-surface-1 px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
         <div className="sm:flex sm:items-start">
           <div className="mx-auto flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-danger-subtle sm:mx-0 sm:h-10 sm:w-10">
-            <AlertTriangle className="h-6 w-6 text-danger-primary" aria-hidden="true" />
+            <WarningTriangleOutline className="h-6 w-6 text-danger-primary" aria-hidden="true" />
           </div>
           <div className="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
             <h3 className="text-16 leading-6 font-medium text-primary">
diff --git a/apps/web/core/components/project/create/common-attributes.tsx b/apps/web/core/components/project/create/common-attributes.tsx
index 7bb72d90481..949faaa22d7 100644
--- a/apps/web/core/components/project/create/common-attributes.tsx
+++ b/apps/web/core/components/project/create/common-attributes.tsx
@@ -9,7 +9,7 @@ import type { UseFormSetValue } from "react-hook-form";
 import { Controller, useFormContext } from "react-hook-form";
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
-import { InfoIcon } from "@plane/propel/icons";
+import { InfoOutline } from "@makeplane/propel/icons";
 // plane imports
 import { ETabIndices } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -130,7 +130,7 @@ function ProjectCommonAttributes(props: Props) {
           align="start"
           disabled={isMobile}
         >
-          <InfoIcon className="absolute top-2.5 right-2 h-3 w-3 text-placeholder" />
+          <InfoOutline className="absolute top-2.5 right-2 h-3 w-3 text-placeholder" />
         </Tooltip>
         <span className="text-11 text-danger-primary">{errors?.identifier?.message}</span>
       </div>
diff --git a/apps/web/core/components/project/create/header.tsx b/apps/web/core/components/project/create/header.tsx
index 03b0943d5eb..356ec1c56e2 100644
--- a/apps/web/core/components/project/create/header.tsx
+++ b/apps/web/core/components/project/create/header.tsx
@@ -10,7 +10,7 @@ import { Controller, useFormContext } from "react-hook-form";
 import { ETabIndices } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { EmojiPicker, EmojiIconPickerTypes, Logo } from "@plane/propel/emoji-icon-picker";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane types
 import type { IProject } from "@plane/types";
 // plane ui
@@ -48,7 +48,7 @@ function ProjectCreateHeader(props: Props) {
       {isClosable && (
         <div className="absolute top-2 right-2 p-2">
           <button type="button" onClick={handleClose} tabIndex={getIndex("close")}>
-            <CloseIcon className="h-5 w-5 text-on-color" />
+            <CloseOutline className="h-5 w-5 text-on-color" />
           </button>
         </div>
       )}
diff --git a/apps/web/core/components/project/delete-project-modal.tsx b/apps/web/core/components/project/delete-project-modal.tsx
index dbdf0a38259..b4ee30a64da 100644
--- a/apps/web/core/components/project/delete-project-modal.tsx
+++ b/apps/web/core/components/project/delete-project-modal.tsx
@@ -6,7 +6,7 @@
 
 import { useParams } from "next/navigation";
 import { Controller, useForm } from "react-hook-form";
-import { AlertTriangle } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 // Plane imports
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -82,7 +82,7 @@ export function DeleteProjectModal(props: DeleteProjectModal) {
       <form onSubmit={handleSubmit(onSubmit)} className="flex flex-col gap-6 p-6">
         <div className="flex w-full items-center justify-start gap-6">
           <span className="place-items-center rounded-full bg-danger-subtle p-4">
-            <AlertTriangle className="h-6 w-6 text-danger-primary" aria-hidden="true" />
+            <WarningTriangleOutline className="h-6 w-6 text-danger-primary" aria-hidden="true" />
           </span>
           <span className="flex items-center justify-start">
             <h3 className="text-18 font-medium 2xl:text-20">Delete project</h3>
diff --git a/apps/web/core/components/project/dropdowns/filters/member-list.tsx b/apps/web/core/components/project/dropdowns/filters/member-list.tsx
index bb8acd15ecc..5489554a3b4 100644
--- a/apps/web/core/components/project/dropdowns/filters/member-list.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/member-list.tsx
@@ -8,7 +8,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { Button } from "@plane/propel/button";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import { EUserProjectRoles, EUserWorkspaceRoles } from "@plane/types";
 // plane ui
 import { CustomMenu } from "@plane/ui";
@@ -103,7 +103,7 @@ export const MemberListFiltersDropdown = observer(function MemberListFiltersDrop
         <div className="relative">
           <Button variant="secondary" size="lg" className="flex items-center gap-2">
             <span>Filters</span>
-            <ChevronDownIcon className="h-3 w-3" />
+            <ChevronDownOutline className="h-3 w-3" />
           </Button>
           {appliedFiltersCount > 0 && (
             <div className="absolute -top-1 -right-1 h-2 w-2 rounded-full bg-accent-primary" />
diff --git a/apps/web/core/components/project/dropdowns/filters/root.tsx b/apps/web/core/components/project/dropdowns/filters/root.tsx
index 10071cfc85f..858dac61876 100644
--- a/apps/web/core/components/project/dropdowns/filters/root.tsx
+++ b/apps/web/core/components/project/dropdowns/filters/root.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TProjectDisplayFilters, TProjectFilters } from "@plane/types";
 // components
@@ -38,7 +38,7 @@ export const ProjectFiltersSelection = observer(function ProjectFiltersSelection
     <div className="flex h-full w-full flex-col overflow-hidden">
       <div className="bg-surface-1 p-2.5 pb-0">
         <div className="flex items-center gap-1.5 rounded-sm border-[0.5px] border-subtle bg-surface-2 px-1.5 py-1 text-11">
-          <SearchIcon className="text-placeholder" width={12} height={12} strokeWidth={2} />
+          <SearchOutline className="text-placeholder" width={12} height={12} />
           <input
             type="text"
             className="w-full bg-surface-2 outline-none placeholder:text-placeholder"
@@ -49,7 +49,7 @@ export const ProjectFiltersSelection = observer(function ProjectFiltersSelection
           />
           {filtersSearchQuery !== "" && (
             <button type="button" className="grid place-items-center" onClick={() => setFiltersSearchQuery("")}>
-              <CloseIcon className="text-tertiary" height={12} width={12} strokeWidth={2} />
+              <CloseOutline className="text-tertiary" height={12} width={12} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/project/dropdowns/order-by.tsx b/apps/web/core/components/project/dropdowns/order-by.tsx
index 5b83e0c2879..1a363d1230c 100644
--- a/apps/web/core/components/project/dropdowns/order-by.tsx
+++ b/apps/web/core/components/project/dropdowns/order-by.tsx
@@ -4,12 +4,11 @@
  * See the LICENSE file for details.
  */
 
-import { ArrowDownWideNarrow } from "lucide-react";
+import { SortDescendingOutline, TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import { PROJECT_ORDER_BY_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { getButtonStyling } from "@plane/propel/button";
-import { CheckIcon } from "@plane/propel/icons";
 import type { TProjectOrderByOptions } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 
@@ -37,12 +36,12 @@ export function ProjectOrderByDropdown(props: Props) {
         <>
           {isMobile ? (
             <div className={getButtonStyling("secondary", "lg")}>
-              <ArrowDownWideNarrow className="size-3.5 shrink-0" strokeWidth={2} />
+              <SortDescendingOutline className="size-3.5 shrink-0" />
               {orderByDetails && t(orderByDetails?.i18n_label)}
             </div>
           ) : (
             <div className={getButtonStyling("secondary", "lg")}>
-              <ArrowDownWideNarrow className="size-3.5 shrink-0" strokeWidth={2} />
+              <SortDescendingOutline className="size-3.5 shrink-0" />
               {orderByDetails && t(orderByDetails?.i18n_label)}
             </div>
           )}
@@ -62,7 +61,7 @@ export function ProjectOrderByDropdown(props: Props) {
           }}
         >
           {option && t(option?.i18n_label)}
-          {value?.includes(option.key) && <CheckIcon className="h-3 w-3" />}
+          {value?.includes(option.key) && <TickOutline className="h-3 w-3" />}
         </CustomMenu.MenuItem>
       ))}
       <hr className="my-2 border-subtle" />
@@ -74,7 +73,7 @@ export function ProjectOrderByDropdown(props: Props) {
         disabled={isOrderingDisabled}
       >
         Ascending
-        {!isOrderingDisabled && !isDescending && <CheckIcon className="h-3 w-3" />}
+        {!isOrderingDisabled && !isDescending && <TickOutline className="h-3 w-3" />}
       </CustomMenu.MenuItem>
       <CustomMenu.MenuItem
         className="flex items-center justify-between gap-2"
@@ -84,7 +83,7 @@ export function ProjectOrderByDropdown(props: Props) {
         disabled={isOrderingDisabled}
       >
         Descending
-        {!isOrderingDisabled && isDescending && <CheckIcon className="h-3 w-3" />}
+        {!isOrderingDisabled && isDescending && <TickOutline className="h-3 w-3" />}
       </CustomMenu.MenuItem>
     </CustomMenu>
   );
diff --git a/apps/web/core/components/project/filters.tsx b/apps/web/core/components/project/filters.tsx
index 5f7215bc4a7..b03ad47e75e 100644
--- a/apps/web/core/components/project/filters.tsx
+++ b/apps/web/core/components/project/filters.tsx
@@ -7,7 +7,7 @@
 import { useCallback } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ListFilter } from "lucide-react";
+import { FilterOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import type { TProjectFilters } from "@plane/types";
@@ -85,7 +85,7 @@ const HeaderFilters = observer(function HeaderFilters({
       />
       <div className={cn(filterClassname)}>
         <FiltersDropdown
-          icon={<ListFilter className="h-3 w-3" />}
+          icon={<FilterOutline className="h-3 w-3" />}
           title={t("common.filters")}
           placement="bottom-end"
           isFiltersApplied={isFiltersApplied}
diff --git a/apps/web/core/components/project/form.tsx b/apps/web/core/components/project/form.tsx
index d31d4d59487..b863594a36a 100644
--- a/apps/web/core/components/project/form.tsx
+++ b/apps/web/core/components/project/form.tsx
@@ -6,7 +6,7 @@
 
 import { useEffect, useState } from "react";
 import { Controller, useForm } from "react-hook-form";
-import { Info } from "lucide-react";
+import { InfoOutline, LockOutline } from "@makeplane/propel/icons";
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { NETWORK_CHOICES } from "@plane/constants";
@@ -14,7 +14,6 @@ import { useTranslation } from "@plane/i18n";
 // plane imports
 import { Button } from "@plane/propel/button";
 import { EmojiPicker, EmojiIconPickerTypes, Logo } from "@plane/propel/emoji-icon-picker";
-import { LockIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { EFileAssetType } from "@plane/types";
@@ -249,7 +248,7 @@ export function ProjectDetailsForm(props: IProjectDetailsForm) {
               <span className="flex items-center gap-2 text-13">
                 <span>{watch("identifier")} .</span>
                 <span className="flex items-center gap-1.5">
-                  {project.network === 0 && <LockIcon className="h-2.5 w-2.5 text-on-color" />}
+                  {project.network === 0 && <LockOutline className="h-2.5 w-2.5 text-on-color" />}
                   {currentNetwork && t(currentNetwork?.i18n_label)}
                 </span>
               </span>
@@ -371,7 +370,7 @@ export function ProjectDetailsForm(props: IProjectDetailsForm) {
                 align="start"
                 disabled={isMobile}
               >
-                <Info className="absolute top-2.5 right-2 h-4 w-4 text-placeholder" />
+                <InfoOutline className="absolute top-2.5 right-2 h-4 w-4 text-placeholder" />
               </Tooltip>
             </div>
             <span className="text-11 text-danger-primary">
diff --git a/apps/web/core/components/project/header.tsx b/apps/web/core/components/project/header.tsx
index e554ab2d199..15503bda5b3 100644
--- a/apps/web/core/components/project/header.tsx
+++ b/apps/web/core/components/project/header.tsx
@@ -11,7 +11,7 @@ import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
 import { Button } from "@plane/propel/button";
-import { ProjectIcon } from "@plane/propel/icons";
+import { ProjectsOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -46,7 +46,7 @@ export const ProjectsBaseHeader = observer(function ProjectsBaseHeader() {
             component={
               <BreadcrumbLink
                 label={t("workspace_projects.label", { count: 2 })}
-                icon={<ProjectIcon className="h-4 w-4 text-tertiary" />}
+                icon={<ProjectsOutline className="h-4 w-4 text-tertiary" />}
               />
             }
           />
diff --git a/apps/web/core/components/project/leave-project-modal.tsx b/apps/web/core/components/project/leave-project-modal.tsx
index c6e019d78d8..addd3c3d2bb 100644
--- a/apps/web/core/components/project/leave-project-modal.tsx
+++ b/apps/web/core/components/project/leave-project-modal.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { Controller, useForm } from "react-hook-form";
-import { AlertTriangleIcon } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 // Plane imports
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -101,7 +101,7 @@ export const LeaveProjectModal = observer(function LeaveProjectModal(props: ILea
       <form onSubmit={handleSubmit(onSubmit)} className="flex flex-col gap-6 p-6">
         <div className="flex w-full items-center justify-start gap-6">
           <span className="place-items-center rounded-full bg-danger-subtle p-4">
-            <AlertTriangleIcon className="h-6 w-6 text-danger-primary" aria-hidden="true" />
+            <WarningTriangleOutline className="h-6 w-6 text-danger-primary" aria-hidden="true" />
           </span>
           <span className="flex items-center justify-start">
             <h3 className="text-18 font-medium 2xl:text-20">Leave Project</h3>
diff --git a/apps/web/core/components/project/member-header-column.tsx b/apps/web/core/components/project/member-header-column.tsx
index 6dd57bea222..d333fe8c701 100644
--- a/apps/web/core/components/project/member-header-column.tsx
+++ b/apps/web/core/components/project/member-header-column.tsx
@@ -6,7 +6,14 @@
 
 // ui
 import { observer } from "mobx-react";
-import { ArrowDownWideNarrow, ArrowUpNarrowWide, CheckIcon, ChevronDownIcon, Eraser, MoveRight } from "lucide-react";
+import { Eraser } from "lucide-react";
+import {
+  ArrowNarrowRightOutline,
+  ChevronDownOutline,
+  SortAscendingOutline,
+  SortDescendingOutline,
+  TickOutline,
+} from "@makeplane/propel/icons";
 // constants
 import type { IProjectMemberDisplayProperties, TMemberOrderByOptions } from "@plane/constants";
 import { MEMBER_PROPERTY_DETAILS } from "@plane/constants";
@@ -54,13 +61,13 @@ export const MemberHeaderColumn = observer(function MemberHeaderColumn(props: Pr
               activeSortingProperty === propertyDetails.descendingOrderKey) && (
               <div className="flex h-3.5 w-3.5 items-center justify-center rounded-full">
                 {propertyDetails.ascendingOrderKey === activeSortingProperty ? (
-                  <ArrowDownWideNarrow className="h-3 w-3" />
+                  <SortDescendingOutline className="h-3 w-3" />
                 ) : (
-                  <ArrowUpNarrowWide className="h-3 w-3" />
+                  <SortAscendingOutline className="h-3 w-3" />
                 )}
               </div>
             )}
-            <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
+            <ChevronDownOutline className="h-3 w-3" aria-hidden="true" />
           </div>
         </div>
       }
@@ -78,12 +85,12 @@ export const MemberHeaderColumn = observer(function MemberHeaderColumn(props: Pr
               }`}
             >
               <div className="flex items-center gap-2">
-                <ArrowDownWideNarrow className="h-3 w-3 stroke-[1.5]" />
+                <SortDescendingOutline className="h-3 w-3 stroke-[1.5]" />
                 <span>{propertyDetails.ascendingOrderTitle}</span>
-                <MoveRight className="h-3 w-3" />
+                <ArrowNarrowRightOutline className="h-3 w-3" />
                 <span>{propertyDetails.descendingOrderTitle}</span>
               </div>
-              {activeSortingProperty === propertyDetails.ascendingOrderKey && <CheckIcon className="h-3 w-3" />}
+              {activeSortingProperty === propertyDetails.ascendingOrderKey && <TickOutline className="h-3 w-3" />}
             </div>
           </CustomMenu.MenuItem>
 
@@ -96,12 +103,12 @@ export const MemberHeaderColumn = observer(function MemberHeaderColumn(props: Pr
               }`}
             >
               <div className="flex items-center gap-2">
-                <ArrowUpNarrowWide className="h-3 w-3 stroke-[1.5]" />
+                <SortAscendingOutline className="h-3 w-3 stroke-[1.5]" />
                 <span>{propertyDetails.descendingOrderTitle}</span>
-                <MoveRight className="h-3 w-3" />
+                <ArrowNarrowRightOutline className="h-3 w-3" />
                 <span>{propertyDetails.ascendingOrderTitle}</span>
               </div>
-              {activeSortingProperty === propertyDetails.descendingOrderKey && <CheckIcon className="h-3 w-3" />}
+              {activeSortingProperty === propertyDetails.descendingOrderKey && <TickOutline className="h-3 w-3" />}
             </div>
           </CustomMenu.MenuItem>
 
diff --git a/apps/web/core/components/project/member-list.tsx b/apps/web/core/components/project/member-list.tsx
index e5d2122110c..d6c04a1a0d5 100644
--- a/apps/web/core/components/project/member-list.tsx
+++ b/apps/web/core/components/project/member-list.tsx
@@ -10,7 +10,7 @@ import { observer } from "mobx-react";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { SearchIcon } from "@plane/propel/icons";
+import { SearchOutline } from "@makeplane/propel/icons";
 // components
 import { MembersSettingsLoader } from "@/components/ui/loader/settings/members";
 // hooks
@@ -85,7 +85,7 @@ export const ProjectMemberList = observer(function ProjectMemberList(props: TPro
         <div className="text-14 font-semibold">{t("common.members")}</div>
         <div className="flex items-center gap-2">
           <div className="flex items-center justify-start gap-1.5 rounded-md border border-subtle bg-surface-1 px-2 py-1">
-            <SearchIcon className="h-3.5 w-3.5" />
+            <SearchOutline className="h-3.5 w-3.5" />
             <input
               className="w-full max-w-[234px] border-none bg-transparent text-13 placeholder:text-placeholder focus:outline-none"
               placeholder="Search"
diff --git a/apps/web/core/components/project/multi-select-modal.tsx b/apps/web/core/components/project/multi-select-modal.tsx
index 8f7952c5ff8..ca0eeee0e93 100644
--- a/apps/web/core/components/project/multi-select-modal.tsx
+++ b/apps/web/core/components/project/multi-select-modal.tsx
@@ -13,7 +13,7 @@ import { Combobox } from "@headlessui/react";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import { Checkbox } from "@makeplane/propel/components/checkbox";
 import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
 import { cn } from "@plane/utils";
@@ -91,7 +91,7 @@ export const ProjectMultiSelectModal = observer(function ProjectMultiSelectModal
     <ModalCore isOpen={isOpen} width={EModalWidth.LG} position={EModalPosition.TOP} handleClose={handleClose}>
       <Combobox as="div" multiple value={selectedProjectIds} onChange={handleSelectedProjectChange}>
         <div className="flex items-center gap-2 border-b border-subtle px-4">
-          <SearchIcon className="size-4 flex-shrink-0 text-placeholder" aria-hidden="true" />
+          <SearchOutline className="size-4 flex-shrink-0 text-placeholder" aria-hidden="true" />
           <Combobox.Input
             className="h-12 w-full border-0 bg-transparent text-13 text-primary outline-none placeholder:text-placeholder focus:ring-0"
             placeholder="Search for projects"
@@ -117,7 +117,7 @@ export const ProjectMultiSelectModal = observer(function ProjectMultiSelectModal
                   <p className="truncate text-11 text-tertiary transition-colors group-hover:text-secondary">
                     {projectDetails.identifier}
                   </p>
-                  <CloseIcon className="size-3 flex-shrink-0 text-placeholder transition-colors group-hover:text-secondary" />
+                  <CloseOutline className="size-3 flex-shrink-0 text-placeholder transition-colors group-hover:text-secondary" />
                 </div>
               );
             })}
diff --git a/apps/web/core/components/project/project-network-icon.tsx b/apps/web/core/components/project/project-network-icon.tsx
index d48dae932cd..a44ccbc19cc 100644
--- a/apps/web/core/components/project/project-network-icon.tsx
+++ b/apps/web/core/components/project/project-network-icon.tsx
@@ -6,7 +6,7 @@
 
 import type { TNetworkChoiceIconKey } from "@plane/constants";
 // plane imports
-import { GlobeIcon, LockIcon } from "@plane/propel/icons";
+import { GlobeOutline, LockOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 type Props = {
@@ -20,9 +20,9 @@ export function ProjectNetworkIcon(props: Props) {
   const getProjectNetworkIcon = () => {
     switch (iconKey) {
       case "Lock":
-        return LockIcon;
+        return LockOutline;
       case "Globe2":
-        return GlobeIcon;
+        return GlobeOutline;
       default:
         return null;
     }
diff --git a/apps/web/core/components/project/publish-project/modal.tsx b/apps/web/core/components/project/publish-project/modal.tsx
index 7bbd38a2c78..c0674da21be 100644
--- a/apps/web/core/components/project/publish-project/modal.tsx
+++ b/apps/web/core/components/project/publish-project/modal.tsx
@@ -12,7 +12,7 @@ import { Controller, useForm } from "react-hook-form";
 // types
 import { SPACE_BASE_PATH, SPACE_BASE_URL } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { GlobeIcon, NewTabIcon, CheckIcon } from "@plane/propel/icons";
+import { GlobeOutline, NewTabOutline, TickOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TProjectPublishLayouts, TProjectPublishSettings } from "@plane/types";
 // ui
@@ -222,7 +222,7 @@ export const PublishProjectModal = observer(function PublishProjectModal(props:
                       target="_blank"
                       rel="noopener noreferrer"
                     >
-                      <NewTabIcon className="size-4" />
+                      <NewTabOutline className="size-4" />
                     </a>
                     <button
                       type="button"
@@ -271,7 +271,7 @@ export const PublishProjectModal = observer(function PublishProjectModal(props:
                           className="flex items-center justify-between gap-2"
                         >
                           {option.label}
-                          {selectedLayouts.includes(option.key) && <CheckIcon className="size-3.5 flex-shrink-0" />}
+                          {selectedLayouts.includes(option.key) && <TickOutline className="size-3.5 flex-shrink-0" />}
                         </CustomSelect.Option>
                       ))}
                     </CustomSelect>
@@ -315,7 +315,7 @@ export const PublishProjectModal = observer(function PublishProjectModal(props:
         {/* modal handlers */}
         <div className="relative mt-4 flex items-center justify-between border-t border-subtle px-5 py-4">
           <div className="flex items-center gap-1 text-13 text-placeholder">
-            <GlobeIcon className="size-3.5" />
+            <GlobeOutline className="size-3.5" />
             <div className="text-13">Anyone with the link can access</div>
           </div>
           {!fetchSettingsLoader && (
diff --git a/apps/web/core/components/project/search-projects.tsx b/apps/web/core/components/project/search-projects.tsx
index 96b08c32a3f..402f88b20d8 100644
--- a/apps/web/core/components/project/search-projects.tsx
+++ b/apps/web/core/components/project/search-projects.tsx
@@ -10,7 +10,7 @@ import { observer } from "mobx-react";
 import { useOutsideClickDetector } from "@plane/hooks";
 // i18n
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 // helpers
 import { cn } from "@plane/utils";
 // hooks
@@ -49,7 +49,7 @@ export const ProjectSearch = observer(function ProjectSearch() {
             setIsSearchOpen(true);
             inputRef.current?.focus();
           }}
-          icon={SearchIcon}
+          icon={SearchOutline}
         />
       )}
       <div
@@ -60,7 +60,7 @@ export const ProjectSearch = observer(function ProjectSearch() {
           }
         )}
       >
-        <SearchIcon className="h-3.5 w-3.5" />
+        <SearchOutline className="h-3.5 w-3.5" />
         <input
           ref={inputRef}
           className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -78,7 +78,7 @@ export const ProjectSearch = observer(function ProjectSearch() {
               setIsSearchOpen(false);
             }}
           >
-            <CloseIcon className="h-3 w-3" />
+            <CloseOutline className="h-3 w-3" />
           </button>
         )}
       </div>
diff --git a/apps/web/core/components/project/send-project-invitation-modal.tsx b/apps/web/core/components/project/send-project-invitation-modal.tsx
index 96092daf2da..e2906fb10b1 100644
--- a/apps/web/core/components/project/send-project-invitation-modal.tsx
+++ b/apps/web/core/components/project/send-project-invitation-modal.tsx
@@ -12,7 +12,7 @@ import { Avatar } from "@makeplane/propel/components/avatar";
 import { ROLE, EUserPermissions } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { PlusIcon, CloseIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { AddOutline, ChevronDownOutline, CloseOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { CustomSelect, CustomSearchSelect, EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
 // helpers
@@ -216,7 +216,7 @@ export const SendProjectInvitationModal = observer(function SendProjectInvitatio
                               ) : (
                                 <div className="flex items-center gap-2 py-0.5">Select co-worker</div>
                               )}
-                              <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
+                              <ChevronDownOutline className="h-3 w-3" aria-hidden="true" />
                             </button>
                           }
                           onChange={(val: string) => {
@@ -255,7 +255,7 @@ export const SendProjectInvitationModal = observer(function SendProjectInvitatio
                           customButton={
                             <div className="shadow-sm flex w-24 items-center justify-between gap-1 rounded-md border border-subtle px-3 py-2.5 text-left text-13 text-secondary duration-300 hover:bg-layer-1 hover:text-primary focus:outline-none">
                               <span className="capitalize">{field.value ? ROLE[field.value] : "Select role"}</span>
-                              <ChevronDownIcon className="h-3 w-3" aria-hidden="true" />
+                              <ChevronDownOutline className="h-3 w-3" aria-hidden="true" />
                             </div>
                           }
                           input
@@ -286,7 +286,7 @@ export const SendProjectInvitationModal = observer(function SendProjectInvitatio
                         className="place-items-center self-center rounded-sm"
                         onClick={() => remove(index)}
                       >
-                        <CloseIcon className="h-4 w-4 text-secondary" />
+                        <CloseOutline className="h-4 w-4 text-secondary" />
                       </button>
                     </div>
                   )}
@@ -301,7 +301,7 @@ export const SendProjectInvitationModal = observer(function SendProjectInvitatio
             className="flex items-center gap-2 bg-transparent py-2 pr-3 text-13 font-medium text-accent-primary outline-accent-strong"
             onClick={appendField}
           >
-            <PlusIcon className="h-4 w-4" />
+            <AddOutline className="h-4 w-4" />
             {t("common.add_more")}
           </button>
           <div className="flex items-center gap-2">
diff --git a/apps/web/core/components/project/settings/features-list.tsx b/apps/web/core/components/project/settings/features-list.tsx
index 32ab55ffcef..f4411c2b05d 100644
--- a/apps/web/core/components/project/settings/features-list.tsx
+++ b/apps/web/core/components/project/settings/features-list.tsx
@@ -10,7 +10,7 @@ import { useTranslation } from "@plane/i18n";
 import { setPromiseToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IProject } from "@plane/types";
-import { CycleIcon, IntakeIcon, ModuleIcon, PageIcon, ViewsIcon } from "@plane/propel/icons";
+import { CyclesOutline, IntakeOutline, ModuleOutline, PagesOutline, ViewsOutline } from "@makeplane/propel/icons";
 // components
 import { SettingsBoxedControlItem } from "@/components/settings/boxed-control-item";
 import { SettingsHeading } from "@/components/settings/heading";
@@ -33,7 +33,7 @@ const PROJECT_FEATURES_LIST = {
     property: "cycle_view",
     title: "Cycles",
     description: "Timebox work as you see fit per project and change frequency from one period to the next.",
-    icon: <CycleIcon className="h-5 w-5 flex-shrink-0 rotate-180 text-tertiary" />,
+    icon: <CyclesOutline className="h-5 w-5 flex-shrink-0 rotate-180 text-tertiary" />,
     isPro: false,
     isEnabled: true,
   },
@@ -42,7 +42,7 @@ const PROJECT_FEATURES_LIST = {
     property: "module_view",
     title: "Modules",
     description: "Group work into sub-project-like set-ups with their own leads and assignees.",
-    icon: <ModuleIcon width={20} height={20} className="flex-shrink-0 text-tertiary" />,
+    icon: <ModuleOutline width={20} height={20} className="flex-shrink-0 text-tertiary" />,
     isPro: false,
     isEnabled: true,
   },
@@ -51,7 +51,7 @@ const PROJECT_FEATURES_LIST = {
     property: "issue_views_view",
     title: "Views",
     description: "Save sorts, filters, and display options for later or share them.",
-    icon: <ViewsIcon className="h-5 w-5 flex-shrink-0 text-tertiary" />,
+    icon: <ViewsOutline className="h-5 w-5 flex-shrink-0 text-tertiary" />,
     isPro: false,
     isEnabled: true,
   },
@@ -60,7 +60,7 @@ const PROJECT_FEATURES_LIST = {
     property: "page_view",
     title: "Pages",
     description: "Write anything like you write anything.",
-    icon: <PageIcon className="h-5 w-5 flex-shrink-0 text-tertiary" />,
+    icon: <PagesOutline className="h-5 w-5 flex-shrink-0 text-tertiary" />,
     isPro: false,
     isEnabled: true,
   },
@@ -69,7 +69,7 @@ const PROJECT_FEATURES_LIST = {
     property: "inbox_view",
     title: "Intake",
     description: "Consider and discuss work items before you add them to your project.",
-    icon: <IntakeIcon className="h-5 w-5 flex-shrink-0 text-tertiary" />,
+    icon: <IntakeOutline className="h-5 w-5 flex-shrink-0 text-tertiary" />,
     isPro: false,
     isEnabled: true,
   },
diff --git a/apps/web/core/components/project/settings/helper.tsx b/apps/web/core/components/project/settings/helper.tsx
index 136e752298a..06714115547 100644
--- a/apps/web/core/components/project/settings/helper.tsx
+++ b/apps/web/core/components/project/settings/helper.tsx
@@ -5,7 +5,7 @@
  */
 
 import Link from "next/link";
-import { ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline } from "@makeplane/propel/icons";
 import { EPillVariant, Pill, EPillSize } from "@plane/propel/pill";
 import { Switch } from "@makeplane/propel/components/switch";
 import { joinUrlPath } from "@plane/utils";
@@ -31,7 +31,7 @@ export function ProjectFeatureToggle(props: Props) {
         >
           {value ? "Enabled" : "Disabled"}
         </Pill>
-        <ChevronRightIcon className="h-4 w-4 text-tertiary" />
+        <ChevronRightOutline className="h-4 w-4 text-tertiary" />
       </div>
     </Link>
   ) : (
diff --git a/apps/web/core/components/projects/mobile-header.tsx b/apps/web/core/components/projects/mobile-header.tsx
index d2bf83f25ea..175f9cd0d3d 100644
--- a/apps/web/core/components/projects/mobile-header.tsx
+++ b/apps/web/core/components/projects/mobile-header.tsx
@@ -7,10 +7,9 @@
 import { useCallback } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { ListFilter } from "lucide-react";
+import { ChevronDownOutline, FilterOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { ChevronDownIcon } from "@plane/propel/icons";
 import type { TProjectFilters } from "@plane/types";
 import { calculateTotalFilters } from "@plane/utils";
 // components
@@ -71,14 +70,14 @@ export const ProjectsListMobileHeader = observer(function ProjectsListMobileHead
       />
       <div className="flex w-full justify-around border-l border-subtle">
         <FiltersDropdown
-          icon={<ListFilter className="h-3 w-3" />}
+          icon={<FilterOutline className="h-3 w-3" />}
           title={t("common.filters")}
           placement="bottom-end"
           menuButton={
             <div className="flex items-center gap-2 text-13 text-secondary">
-              <ListFilter className="h-3 w-3" />
+              <FilterOutline className="h-3 w-3" />
               {t("common.filters")}
-              <ChevronDownIcon className="h-3 w-3" strokeWidth={2} />
+              <ChevronDownOutline className="h-3 w-3" />
             </div>
           }
           isFiltersApplied={isFiltersApplied}
diff --git a/apps/web/core/components/projects/settings/intake/header.tsx b/apps/web/core/components/projects/settings/intake/header.tsx
index f24e43d4c01..a46617c0a05 100644
--- a/apps/web/core/components/projects/settings/intake/header.tsx
+++ b/apps/web/core/components/projects/settings/intake/header.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { RefreshCcw } from "lucide-react";
+import { IntakeOutline, RefreshOutline } from "@makeplane/propel/icons";
 // ui
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -22,7 +22,6 @@ import { useProjectInbox } from "@/hooks/store/use-project-inbox";
 import { useUserPermissions } from "@/hooks/store/user";
 // plane web imports
 import { CommonProjectBreadcrumbs } from "@/components/breadcrumbs/common";
-import { IntakeIcon } from "@plane/propel/icons";
 
 export const ProjectInboxHeader = observer(function ProjectInboxHeader() {
   // states
@@ -53,7 +52,7 @@ export const ProjectInboxHeader = observer(function ProjectInboxHeader() {
                 <BreadcrumbLink
                   label="Intake"
                   href={`/${workspaceSlug}/projects/${projectId}/intake/`}
-                  icon={<IntakeIcon className="h-4 w-4 text-tertiary" />}
+                  icon={<IntakeOutline className="h-4 w-4 text-tertiary" />}
                   isLast
                 />
               }
@@ -63,7 +62,7 @@ export const ProjectInboxHeader = observer(function ProjectInboxHeader() {
 
           {loader === "pagination-loading" && (
             <div className="flex items-center gap-1.5 text-tertiary">
-              <RefreshCcw className="h-3.5 w-3.5 animate-spin" />
+              <RefreshOutline className="h-3.5 w-3.5 animate-spin" />
               <p className="text-13">{t("syncing")}...</p>
             </div>
           )}
diff --git a/apps/web/core/components/readonly/cycle.tsx b/apps/web/core/components/readonly/cycle.tsx
index c5fc9753d1c..28a0772da7f 100644
--- a/apps/web/core/components/readonly/cycle.tsx
+++ b/apps/web/core/components/readonly/cycle.tsx
@@ -8,7 +8,7 @@ import { useEffect } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CycleIcon } from "@plane/propel/icons";
+import { CyclesOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 // hooks
 import { useCycle } from "@/hooks/store/use-cycle";
@@ -37,7 +37,7 @@ export const ReadonlyCycle = observer(function ReadonlyCycle(props: TReadonlyCyc
 
   return (
     <div className={cn("flex items-center gap-1 text-13", className)}>
-      {!hideIcon && <CycleIcon className="size-4 flex-shrink-0" />}
+      {!hideIcon && <CyclesOutline className="size-4 flex-shrink-0" />}
       <span className="flex-grow truncate">{cycleName ?? placeholder ?? t("common.none")}</span>
     </div>
   );
diff --git a/apps/web/core/components/readonly/date.tsx b/apps/web/core/components/readonly/date.tsx
index b09650d3517..8592da89189 100644
--- a/apps/web/core/components/readonly/date.tsx
+++ b/apps/web/core/components/readonly/date.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CalendarLayoutIcon } from "@plane/propel/icons";
+import { CalendarOutline } from "@makeplane/propel/icons";
 import { cn, renderFormattedDate, getDate } from "@plane/utils";
 
 export type TReadonlyDateProps = {
@@ -26,7 +26,7 @@ export const ReadonlyDate = observer(function ReadonlyDate(props: TReadonlyDateP
 
   return (
     <div className={cn("flex items-center gap-1 text-13", className)}>
-      {!hideIcon && <CalendarLayoutIcon className="size-4 flex-shrink-0" />}
+      {!hideIcon && <CalendarOutline className="size-4 flex-shrink-0" />}
       <span className="flex-grow truncate">{formattedDate ?? placeholder ?? t("common.none")}</span>
     </div>
   );
diff --git a/apps/web/core/components/readonly/estimate.tsx b/apps/web/core/components/readonly/estimate.tsx
index 1573681191e..9b2822830d2 100644
--- a/apps/web/core/components/readonly/estimate.tsx
+++ b/apps/web/core/components/readonly/estimate.tsx
@@ -7,7 +7,7 @@
 import { useEffect } from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
-import { EstimatePropertyIcon } from "@plane/propel/icons";
+import { EstimateOutline } from "@makeplane/propel/icons";
 import { EEstimateSystem } from "@plane/types";
 import { cn, convertMinutesToHoursMinutesString } from "@plane/utils";
 // hooks
@@ -49,7 +49,7 @@ export const ReadonlyEstimate = observer(function ReadonlyEstimate(props: TReado
 
   return (
     <div className={cn("flex items-center gap-1 text-body-xs-regular", className)}>
-      {!hideIcon && <EstimatePropertyIcon className="size-4 flex-shrink-0" />}
+      {!hideIcon && <EstimateOutline className="size-4 flex-shrink-0" />}
       <span className="flex-grow truncate">{displayValue ?? placeholder ?? t("common.none")}</span>
     </div>
   );
diff --git a/apps/web/core/components/readonly/module.tsx b/apps/web/core/components/readonly/module.tsx
index 30a1dc32b03..600488b808e 100644
--- a/apps/web/core/components/readonly/module.tsx
+++ b/apps/web/core/components/readonly/module.tsx
@@ -6,7 +6,7 @@
 
 import { useEffect } from "react";
 import { observer } from "mobx-react";
-import { Layers } from "lucide-react";
+import { WorkItemsOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { cn } from "@plane/utils";
@@ -51,7 +51,7 @@ export const ReadonlyModule = observer(function ReadonlyModule(props: TReadonlyM
   if (modules.length === 0) {
     return (
       <div className={cn("flex items-center gap-1 text-body-xs-regular", className)}>
-        {!hideIcon && <Layers className="size-4 flex-shrink-0" />}
+        {!hideIcon && <WorkItemsOutline className="size-4 flex-shrink-0" />}
         <span className="flex-grow truncate">{placeholder ?? t("common.none")}</span>
       </div>
     );
@@ -63,7 +63,7 @@ export const ReadonlyModule = observer(function ReadonlyModule(props: TReadonlyM
 
     return (
       <div className={cn("flex items-center gap-1 text-body-xs-regular", className)}>
-        {!hideIcon && <Layers className="size-4 flex-shrink-0" />}
+        {!hideIcon && <WorkItemsOutline className="size-4 flex-shrink-0" />}
         <span className="flex-grow truncate">{displayText}</span>
       </div>
     );
@@ -72,7 +72,7 @@ export const ReadonlyModule = observer(function ReadonlyModule(props: TReadonlyM
   const moduleItem = modules[0];
   return (
     <div className={cn("flex items-center gap-2 text-body-xs-regular", className)}>
-      {!hideIcon && <Layers className="size-4 flex-shrink-0" />}
+      {!hideIcon && <WorkItemsOutline className="size-4 flex-shrink-0" />}
       <span className="flex-grow truncate">{moduleItem?.name}</span>
     </div>
   );
diff --git a/apps/web/core/components/relations/index.tsx b/apps/web/core/components/relations/index.tsx
index e7bf7f9ec44..602fb01f0e1 100644
--- a/apps/web/core/components/relations/index.tsx
+++ b/apps/web/core/components/relations/index.tsx
@@ -4,8 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { CircleDot, XCircle } from "lucide-react";
-import { RelatedIcon, DuplicatePropertyIcon } from "@plane/propel/icons";
+import { BlockingOutline, CloseCircleOutline, DuplicateOfOutline, RelatesToOutline } from "@makeplane/propel/icons";
 import type { TRelationObject } from "@/components/issues/issue-detail-widgets/relations";
 import type { TIssueRelationTypes } from "@plane/types";
 
@@ -14,28 +13,28 @@ export const ISSUE_RELATION_OPTIONS: Record<TIssueRelationTypes, TRelationObject
     key: "relates_to",
     i18n_label: "issue.relation.relates_to",
     className: "bg-layer-1 text-secondary",
-    icon: (size) => <RelatedIcon height={size} width={size} className="text-secondary" />,
+    icon: (size) => <RelatesToOutline height={size} width={size} className="text-secondary" />,
     placeholder: "Add related work items",
   },
   duplicate: {
     key: "duplicate",
     i18n_label: "issue.relation.duplicate",
     className: "bg-layer-1 text-secondary",
-    icon: (size) => <DuplicatePropertyIcon width={size} height={size} className="text-secondary" />,
+    icon: (size) => <DuplicateOfOutline width={size} height={size} className="text-secondary" />,
     placeholder: "None",
   },
   blocked_by: {
     key: "blocked_by",
     i18n_label: "issue.relation.blocked_by",
     className: "bg-danger-subtle text-danger-primary",
-    icon: (size) => <CircleDot size={size} className="text-secondary" />,
+    icon: (size) => <BlockingOutline width={size} height={size} className="text-secondary" />,
     placeholder: "None",
   },
   blocking: {
     key: "blocking",
     i18n_label: "issue.relation.blocking",
     className: "bg-yellow-500/20 text-yellow-700",
-    icon: (size) => <XCircle size={size} className="text-secondary" />,
+    icon: (size) => <CloseCircleOutline width={size} height={size} className="text-secondary" />,
     placeholder: "None",
   },
 };
diff --git a/apps/web/core/components/rich-filters/add-filters/button.tsx b/apps/web/core/components/rich-filters/add-filters/button.tsx
index 51f58c37505..3d7d4f6c87e 100644
--- a/apps/web/core/components/rich-filters/add-filters/button.tsx
+++ b/apps/web/core/components/rich-filters/add-filters/button.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { ListFilter } from "lucide-react";
+import { FilterOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TButtonSize, TButtonVariant } from "@plane/propel/button";
 import { getButtonStyling } from "@plane/propel/button";
@@ -47,7 +47,7 @@ export const AddFilterButton = observer(function AddFilterButton<P extends TFilt
     isDisabled = false,
   } = buttonConfig || {};
   // derived values
-  const FilterIcon = iconConfig.iconComponent || ListFilter;
+  const FilterIcon = iconConfig.iconComponent || FilterOutline;
 
   const handleFilterSelect = (property: P, operator: TSupportedOperators, isNegation: boolean) => {
     filter.addCondition(
diff --git a/apps/web/core/components/rich-filters/filter-item/close-button.tsx b/apps/web/core/components/rich-filters/filter-item/close-button.tsx
index 753fec47677..1ad84beec4b 100644
--- a/apps/web/core/components/rich-filters/filter-item/close-button.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/close-button.tsx
@@ -7,7 +7,7 @@
 import React from "react";
 import { observer } from "mobx-react";
 // plane imports
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import type { IFilterInstance } from "@plane/shared-state";
 import type { TExternalFilter, TFilterProperty } from "@plane/types";
 
@@ -33,7 +33,7 @@ export const FilterItemCloseButton = observer(function FilterItemCloseButton<
       type="button"
       aria-label="Remove filter"
     >
-      <CloseIcon className="size-3.5" />
+      <CloseOutline className="size-3.5" />
     </button>
   );
 });
diff --git a/apps/web/core/components/rich-filters/filter-item/invalid.tsx b/apps/web/core/components/rich-filters/filter-item/invalid.tsx
index 931f3d8e8e9..678f12d97eb 100644
--- a/apps/web/core/components/rich-filters/filter-item/invalid.tsx
+++ b/apps/web/core/components/rich-filters/filter-item/invalid.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { CircleAlert } from "lucide-react";
+import { WarningCircleOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { TExternalFilter, TFilterProperty } from "@plane/types";
 // local imports
@@ -31,7 +31,7 @@ export const InvalidFilterItem = observer(function InvalidFilterItem<
       {/* Property section */}
       <FilterItemProperty
         conditionId={condition.id}
-        icon={CircleAlert}
+        icon={WarningCircleOutline}
         label="Invalid filter"
         filter={filter}
         isDisabled={isDisabled}
diff --git a/apps/web/core/components/rich-filters/filters-row.tsx b/apps/web/core/components/rich-filters/filters-row.tsx
index 5b8aa933189..9a836fcafe6 100644
--- a/apps/web/core/components/rich-filters/filters-row.tsx
+++ b/apps/web/core/components/rich-filters/filters-row.tsx
@@ -6,7 +6,7 @@
 
 import React, { useCallback, useState } from "react";
 import { observer } from "mobx-react";
-import { ListFilterPlus } from "lucide-react";
+import { AddFilterOutline } from "@makeplane/propel/icons";
 import { Transition } from "@headlessui/react";
 // plane imports
 import { Button } from "@plane/propel/button";
@@ -67,7 +67,7 @@ export const FiltersRow = observer(function FiltersRow<K extends TFilterProperty
           size: "lg",
           iconConfig: {
             shouldShowIcon: true,
-            iconComponent: ListFilterPlus,
+            iconComponent: AddFilterOutline,
           },
           ...buttonConfig,
           isDisabled: disabledAllOperations,
diff --git a/apps/web/core/components/rich-filters/filters-toggle.tsx b/apps/web/core/components/rich-filters/filters-toggle.tsx
index 27479216fbf..cbc7bcff9ea 100644
--- a/apps/web/core/components/rich-filters/filters-toggle.tsx
+++ b/apps/web/core/components/rich-filters/filters-toggle.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // plane imports
 import { IconButton } from "@plane/propel/icon-button";
-import { FilterIcon, FilterAppliedIcon } from "@plane/propel/icons";
+import { FilterOutline, SelectedFilterOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 import type { IFilterInstance } from "@plane/shared-state";
 import type { TExternalFilter, TFilterProperty } from "@plane/types";
@@ -81,7 +81,7 @@ export const FiltersToggle = observer(function FiltersToggle<P extends TFilterPr
     <IconButton
       size="lg"
       variant="secondary"
-      icon={showFilterRowChangesPill ? FilterAppliedIcon : FilterIcon}
+      icon={showFilterRowChangesPill ? SelectedFilterOutline : FilterOutline}
       onClick={handleToggleFilter}
       className={buttonClassName}
       iconClassName={iconClassName}
diff --git a/apps/web/core/components/settings/mobile/nav.tsx b/apps/web/core/components/settings/mobile/nav.tsx
index 0d1a763c625..3e5767ad32a 100644
--- a/apps/web/core/components/settings/mobile/nav.tsx
+++ b/apps/web/core/components/settings/mobile/nav.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import { Menu } from "lucide-react";
 import { useOutsideClickDetector } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
-import { ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline } from "@makeplane/propel/icons";
 import { useUserSettings } from "@/hooks/store/user";
 import { IconButton } from "@plane/propel/icon-button";
 
@@ -42,7 +42,7 @@ export const SettingsMobileNav = observer(function SettingsMobileNav(props: Prop
       </div>
       {/* path */}
       <div className="flex items-center gap-2">
-        <ChevronRightIcon className="size-4 text-tertiary" />
+        <ChevronRightOutline className="size-4 text-tertiary" />
         <span className="text-13 font-medium text-secondary">{t(activePath)}</span>
       </div>
     </div>
diff --git a/apps/web/core/components/settings/profile/content/pages/general/form.tsx b/apps/web/core/components/settings/profile/content/pages/general/form.tsx
index 7fee925ae6f..7ece5a8a541 100644
--- a/apps/web/core/components/settings/profile/content/pages/general/form.tsx
+++ b/apps/web/core/components/settings/profile/content/pages/general/form.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
-import { CircleUserRound } from "lucide-react";
+import { UserOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -225,7 +225,7 @@ export const GeneralProfileSettingsForm = observer(function GeneralProfileSettin
                   <button type="button" onClick={() => setIsImageUploadModalOpen(true)}>
                     {!userAvatar || userAvatar === "" ? (
                       <div className="h-16 w-16 rounded-md bg-layer-1 p-2">
-                        <CircleUserRound className="h-full w-full text-secondary" />
+                        <UserOutline className="h-full w-full text-secondary" />
                       </div>
                     ) : (
                       <div className="relative h-16 w-16 overflow-hidden">
diff --git a/apps/web/core/components/settings/profile/content/pages/security.tsx b/apps/web/core/components/settings/profile/content/pages/security.tsx
index f4d00654c8e..dfb6dfd2ed2 100644
--- a/apps/web/core/components/settings/profile/content/pages/security.tsx
+++ b/apps/web/core/components/settings/profile/content/pages/security.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
-import { Eye, EyeOff } from "lucide-react";
+import { HideOutline, ShowOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -165,9 +165,9 @@ export const SecurityProfileSettings = observer(function SecurityProfileSettings
                         aria-label={showPassword?.oldPassword ? "Hide password" : "Show password"}
                       >
                         {showPassword?.oldPassword ? (
-                          <EyeOff className="size-5 stroke-placeholder" />
+                          <HideOutline className="size-5 text-placeholder" />
                         ) : (
-                          <Eye className="size-5 stroke-placeholder" />
+                          <ShowOutline className="size-5 text-placeholder" />
                         )}
                       </button>
                     </InputGroup>
@@ -209,9 +209,9 @@ export const SecurityProfileSettings = observer(function SecurityProfileSettings
                         aria-label={showPassword?.password ? "Hide password" : "Show password"}
                       >
                         {showPassword?.password ? (
-                          <EyeOff className="size-5 stroke-placeholder" />
+                          <HideOutline className="size-5 text-placeholder" />
                         ) : (
-                          <Eye className="size-5 stroke-placeholder" />
+                          <ShowOutline className="size-5 text-placeholder" />
                         )}
                       </button>
                     </InputGroup>
@@ -257,9 +257,9 @@ export const SecurityProfileSettings = observer(function SecurityProfileSettings
                         aria-label={showPassword?.confirmPassword ? "Hide password" : "Show password"}
                       >
                         {showPassword?.confirmPassword ? (
-                          <EyeOff className="size-5 stroke-placeholder" />
+                          <HideOutline className="size-5 text-placeholder" />
                         ) : (
-                          <Eye className="size-5 stroke-placeholder" />
+                          <ShowOutline className="size-5 text-placeholder" />
                         )}
                       </button>
                     </InputGroup>
diff --git a/apps/web/core/components/settings/profile/modal.tsx b/apps/web/core/components/settings/profile/modal.tsx
index 43abd90afbf..ed45a87eb3d 100644
--- a/apps/web/core/components/settings/profile/modal.tsx
+++ b/apps/web/core/components/settings/profile/modal.tsx
@@ -5,7 +5,7 @@
  */
 
 import { useCallback } from "react";
-import { X } from "lucide-react";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { observer } from "mobx-react";
 // plane imports
 import { IconButton } from "@plane/propel/icon-button";
@@ -51,7 +51,7 @@ export const ProfileSettingsModal = observer(function ProfileSettingsModal() {
           <ProfileSettingsContent activeTab={activeTab} className="flex-1 rounded-r-xl" />
         </div>
         <div className="absolute top-3.5 right-3.5">
-          <IconButton size="base" variant="tertiary" icon={X} onClick={handleClose} />
+          <IconButton size="base" variant="tertiary" icon={CloseOutline} onClick={handleClose} />
         </div>
       </div>
     </ModalCore>
diff --git a/apps/web/core/components/settings/profile/sidebar/item-categories.tsx b/apps/web/core/components/settings/profile/sidebar/item-categories.tsx
index 812d7328032..5de5f282d24 100644
--- a/apps/web/core/components/settings/profile/sidebar/item-categories.tsx
+++ b/apps/web/core/components/settings/profile/sidebar/item-categories.tsx
@@ -6,7 +6,7 @@
 
 import type React from "react";
 import type { LucideIcon } from "lucide-react";
-import { Bell, CircleUser, KeyRound, LockIcon, Settings2 } from "lucide-react";
+import { KeyOutline, LockOutline, SettingsOutline, SubscribeOutline, UserOutline } from "@makeplane/propel/icons";
 import { observer } from "mobx-react";
 import { useParams } from "react-router";
 // plane imports
@@ -23,11 +23,11 @@ import { SettingsSidebarItem } from "../../sidebar/item";
 import { ProfileSettingsSidebarWorkspaceOptions } from "./workspace-options";
 
 const ICONS: Record<TProfileSettingsTabs, LucideIcon | React.FC<ISvgIcons>> = {
-  general: CircleUser,
-  security: LockIcon,
-  preferences: Settings2,
-  notifications: Bell,
-  "api-tokens": KeyRound,
+  general: UserOutline,
+  security: LockOutline,
+  preferences: SettingsOutline,
+  notifications: SubscribeOutline,
+  "api-tokens": KeyOutline,
 };
 
 type Props = {
diff --git a/apps/web/core/components/settings/profile/sidebar/workspace-options.tsx b/apps/web/core/components/settings/profile/sidebar/workspace-options.tsx
index ae8acfaad25..5459befe812 100644
--- a/apps/web/core/components/settings/profile/sidebar/workspace-options.tsx
+++ b/apps/web/core/components/settings/profile/sidebar/workspace-options.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { CirclePlus, Mails } from "lucide-react";
+import { MailOutline, PlusCircleOutline } from "@makeplane/propel/icons";
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
@@ -38,14 +38,14 @@ export const ProfileSettingsSidebarWorkspaceOptions = observer(function ProfileS
           <SettingsSidebarItem
             as="link"
             href="/create-workspace/"
-            icon={CirclePlus}
+            icon={PlusCircleOutline}
             label={t("create_workspace")}
             isActive={false}
           />
           <SettingsSidebarItem
             as="link"
             href="/invitations/"
-            icon={Mails}
+            icon={MailOutline}
             label={t("workspace_invites")}
             isActive={false}
           />
diff --git a/apps/web/core/components/settings/project/sidebar/header.tsx b/apps/web/core/components/settings/project/sidebar/header.tsx
index a5986d30146..e257aefd842 100644
--- a/apps/web/core/components/settings/project/sidebar/header.tsx
+++ b/apps/web/core/components/settings/project/sidebar/header.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { ArrowLeft } from "lucide-react";
+import { ArrowNarrowLeftOutline } from "@makeplane/propel/icons";
 import { observer } from "mobx-react";
 // plane imports
 import { ROLE_DETAILS } from "@plane/constants";
@@ -45,7 +45,7 @@ export const ProjectSettingsSidebarHeader = observer(function ProjectSettingsSid
         <IconButton
           variant="ghost"
           size="base"
-          icon={ArrowLeft}
+          icon={ArrowNarrowLeftOutline}
           onClick={() => router.push(`/${currentWorkspace?.slug}/projects/${projectId}/issues/`)}
         />
         <p>Project settings</p>
diff --git a/apps/web/core/components/settings/project/sidebar/item-icon.tsx b/apps/web/core/components/settings/project/sidebar/item-icon.tsx
index 80d324b6684..a58928a7a73 100644
--- a/apps/web/core/components/settings/project/sidebar/item-icon.tsx
+++ b/apps/web/core/components/settings/project/sidebar/item-icon.tsx
@@ -5,33 +5,34 @@
  */
 
 import type { LucideIcon } from "lucide-react";
-import { Users, Zap } from "lucide-react";
+import {
+  CyclesOutline,
+  EstimateOutline,
+  IntakeOutline,
+  LabelsOutline,
+  MembersOutline,
+  ModuleOutline,
+  PagesOutline,
+  StateOutline,
+  TriggerOutline,
+  ViewsOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import type { ISvgIcons } from "@plane/propel/icons";
-import {
-  CycleIcon,
-  EstimatePropertyIcon,
-  IntakeIcon,
-  LabelPropertyIcon,
-  ModuleIcon,
-  PageIcon,
-  StatePropertyIcon,
-  ViewsIcon,
-} from "@plane/propel/icons";
 import type { TProjectSettingsTabs } from "@plane/types";
 // components
 import { SettingIcon } from "@/components/icons/attachment";
 
 export const PROJECT_SETTINGS_ICONS: Record<TProjectSettingsTabs, LucideIcon | React.FC<ISvgIcons>> = {
   general: SettingIcon,
-  members: Users,
-  features_cycles: CycleIcon,
-  features_modules: ModuleIcon,
-  features_views: ViewsIcon,
-  features_pages: PageIcon,
-  features_intake: IntakeIcon,
-  states: StatePropertyIcon,
-  labels: LabelPropertyIcon,
-  estimates: EstimatePropertyIcon,
-  automations: Zap,
+  members: MembersOutline,
+  features_cycles: CyclesOutline,
+  features_modules: ModuleOutline,
+  features_views: ViewsOutline,
+  features_pages: PagesOutline,
+  features_intake: IntakeOutline,
+  states: StateOutline,
+  labels: LabelsOutline,
+  estimates: EstimateOutline,
+  automations: TriggerOutline,
 };
diff --git a/apps/web/core/components/settings/workspace/sidebar/header.tsx b/apps/web/core/components/settings/workspace/sidebar/header.tsx
index 2a34c86e815..754d62c4a29 100644
--- a/apps/web/core/components/settings/workspace/sidebar/header.tsx
+++ b/apps/web/core/components/settings/workspace/sidebar/header.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { ArrowLeft } from "lucide-react";
+import { ArrowNarrowLeftOutline } from "@makeplane/propel/icons";
 import { observer } from "mobx-react";
 // plane imports
 import { ROLE_DETAILS } from "@plane/constants";
@@ -38,7 +38,7 @@ export const WorkspaceSettingsSidebarHeader = observer(function WorkspaceSetting
         <IconButton
           variant="ghost"
           size="base"
-          icon={ArrowLeft}
+          icon={ArrowNarrowLeftOutline}
           onClick={() => router.push(`/${currentWorkspace?.slug}/`)}
         />
         <p>Workspace settings</p>
diff --git a/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx b/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx
index b89c11fd226..b4afebb7c4b 100644
--- a/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx
+++ b/apps/web/core/components/settings/workspace/sidebar/item-icon.tsx
@@ -5,15 +5,21 @@
  */
 
 import type { LucideIcon } from "lucide-react";
-import { ArrowUpToLine, Building, CreditCard, Users, Webhook } from "lucide-react";
+import {
+  BillingsOutline,
+  BuildingOutline,
+  ExportOutline,
+  MembersOutline,
+  WebhooksOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import type { ISvgIcons } from "@plane/propel/icons";
 import type { TWorkspaceSettingsTabs } from "@plane/types";
 
 export const WORKSPACE_SETTINGS_ICONS: Record<TWorkspaceSettingsTabs, LucideIcon | React.FC<ISvgIcons>> = {
-  general: Building,
-  members: Users,
-  export: ArrowUpToLine,
-  "billing-and-plans": CreditCard,
-  webhooks: Webhook,
+  general: BuildingOutline,
+  members: MembersOutline,
+  export: ExportOutline,
+  "billing-and-plans": BillingsOutline,
+  webhooks: WebhooksOutline,
 };
diff --git a/apps/web/core/components/sidebar/search-button.tsx b/apps/web/core/components/sidebar/search-button.tsx
index 397507a2b80..30acec2973d 100644
--- a/apps/web/core/components/sidebar/search-button.tsx
+++ b/apps/web/core/components/sidebar/search-button.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { SearchIcon } from "@plane/propel/icons";
+import { SearchOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 type Props = {
@@ -22,7 +22,7 @@ export function SidebarSearchButton(props: Props) {
         }
       )}
     >
-      <SearchIcon
+      <SearchOutline
         className={cn("size-4 text-tertiary", {
           "text-accent-secondary": isActive,
         })}
diff --git a/apps/web/core/components/sidebar/sidebar-toggle-button.tsx b/apps/web/core/components/sidebar/sidebar-toggle-button.tsx
index 7fe3e93ca87..4c3e9ef7128 100644
--- a/apps/web/core/components/sidebar/sidebar-toggle-button.tsx
+++ b/apps/web/core/components/sidebar/sidebar-toggle-button.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { PanelLeft } from "lucide-react";
+import { LeftSidePaneOutline } from "@makeplane/propel/icons";
 // hooks
 import { useAppTheme } from "@/hooks/store/use-app-theme";
 import { IconButton } from "@plane/propel/icon-button";
@@ -18,7 +18,7 @@ export const AppSidebarToggleButton = observer(function AppSidebarToggleButton()
     <IconButton
       size="base"
       variant="ghost"
-      icon={PanelLeft}
+      icon={LeftSidePaneOutline}
       onClick={() => {
         if (sidebarPeek) toggleSidebarPeek(false);
         toggleSidebar();
diff --git a/apps/web/core/components/sidebar/sidebar-wrapper.tsx b/apps/web/core/components/sidebar/sidebar-wrapper.tsx
index b59983f725f..7e8700ab67d 100644
--- a/apps/web/core/components/sidebar/sidebar-wrapper.tsx
+++ b/apps/web/core/components/sidebar/sidebar-wrapper.tsx
@@ -8,7 +8,7 @@ import { useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
 // plane helpers
 import { useOutsideClickDetector } from "@plane/hooks";
-import { PreferencesIcon } from "@plane/propel/icons";
+import { PreferencesOutline } from "@makeplane/propel/icons";
 import { ScrollArea } from "@plane/propel/scrollarea";
 // components
 import { CustomizeNavigationDialog } from "@/components/navigation/customize-navigation-dialog";
@@ -61,7 +61,7 @@ export const SidebarWrapper = observer(function SidebarWrapper(props: TSidebarWr
                 <IconButton
                   size="base"
                   variant="ghost"
-                  icon={PreferencesIcon}
+                  icon={PreferencesOutline}
                   onClick={() => setIsCustomizeNavDialogOpen(true)}
                 />
               )}
diff --git a/apps/web/core/components/stickies/action-bar.tsx b/apps/web/core/components/stickies/action-bar.tsx
index bc835f9ab84..2ff2236bb81 100644
--- a/apps/web/core/components/stickies/action-bar.tsx
+++ b/apps/web/core/components/stickies/action-bar.tsx
@@ -8,11 +8,10 @@ import { useRef, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
-import { StickyNote as StickyIcon } from "lucide-react";
 // plane hooks
 import { useOutsideClickDetector } from "@plane/hooks";
 // plane ui
-import { RecentStickyIcon, StickyNoteIcon, PlusIcon, CloseIcon } from "@plane/propel/icons";
+import { AddOutline, CloseOutline, MultipleStickyOutline, StickyNoteOutline } from "@makeplane/propel/icons";
 import { PreviewCard, PreviewCardContent, PreviewCardTrigger } from "@makeplane/propel/components/preview-card";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 // plane utils
@@ -60,7 +59,7 @@ export const StickyActionBar = observer(function StickyActionBar() {
       onClick={() => setShowRecentSticky(true)}
       style={{ color: recentStickyBackgroundColor }}
     >
-      <StickyNoteIcon className={cn("size-5 rotate-90")} color={recentStickyBackgroundColor} />
+      <StickyNoteOutline className={cn("size-5 rotate-90")} color={recentStickyBackgroundColor} />
     </button>
   );
 
@@ -77,7 +76,7 @@ export const StickyActionBar = observer(function StickyActionBar() {
             className="btn btn--icon shadow-sm flex h-10 w-10 items-center justify-center rounded-full bg-surface-1"
             onClick={() => toggleAllStickiesModal(true)}
           >
-            <RecentStickyIcon className="size-5 rotate-90 text-tertiary" />
+            <MultipleStickyOutline className="size-5 rotate-90 text-tertiary" />
           </button>
         </Tooltip>
         {recentStickyId &&
@@ -112,7 +111,7 @@ export const StickyActionBar = observer(function StickyActionBar() {
               setNewSticky(true);
             }}
           >
-            <PlusIcon className="size-5 rotate-90 text-tertiary" />
+            <AddOutline className="size-5 rotate-90 text-tertiary" />
           </button>
         </Tooltip>
       </div>
@@ -122,9 +121,9 @@ export const StickyActionBar = observer(function StickyActionBar() {
         onClick={() => setIsExpanded(!isExpanded)}
       >
         {isExpanded ? (
-          <CloseIcon className="size-5 text-tertiary" />
+          <CloseOutline className="size-5 text-tertiary" />
         ) : (
-          <StickyIcon className="size-5 rotate-90 text-tertiary" />
+          <StickyNoteOutline className="size-5 rotate-90 text-tertiary" />
         )}
       </button>
 
diff --git a/apps/web/core/components/stickies/layout/stickies-list.tsx b/apps/web/core/components/stickies/layout/stickies-list.tsx
index 6a9e78ea2d1..41c97c6b31d 100644
--- a/apps/web/core/components/stickies/layout/stickies-list.tsx
+++ b/apps/web/core/components/stickies/layout/stickies-list.tsx
@@ -18,7 +18,7 @@ import Masonry from "react-masonry-component";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import { EUserWorkspaceRoles } from "@plane/types";
 // assets
 import darkStickiesAsset from "@/app/assets/empty-state/stickies/stickies-dark.webp?url";
@@ -129,7 +129,7 @@ export const StickiesList = observer(function StickiesList(props: TProps) {
                 description={t("stickies.empty_state.general.description")}
                 assetPath={stickiesResolvedPath}
                 primaryButton={{
-                  prependIcon: <PlusIcon className="size-4" />,
+                  prependIcon: <AddOutline className="size-4" />,
                   text: t("stickies.empty_state.general.primary_button.text"),
                   onClick: () => {
                     toggleShowNewSticky(true);
diff --git a/apps/web/core/components/stickies/modal/search.tsx b/apps/web/core/components/stickies/modal/search.tsx
index 1964a7c3b9b..dfed3db8730 100644
--- a/apps/web/core/components/stickies/modal/search.tsx
+++ b/apps/web/core/components/stickies/modal/search.tsx
@@ -12,7 +12,7 @@ import { useParams } from "next/navigation";
 import { useOutsideClickDetector } from "@plane/hooks";
 // helpers
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 import { useSticky } from "@/hooks/use-stickies";
 import { IconButton } from "@plane/propel/icon-button";
@@ -59,7 +59,7 @@ export const StickySearch = observer(function StickySearch() {
           variant="ghost"
           size="lg"
           className="-mr-2"
-          icon={SearchIcon}
+          icon={SearchOutline}
           onClick={() => {
             setIsSearchOpen(true);
             inputRef.current?.focus();
@@ -74,7 +74,7 @@ export const StickySearch = observer(function StickySearch() {
           }
         )}
       >
-        <SearchIcon className="size-3.5 shrink-0" />
+        <SearchOutline className="size-3.5 shrink-0" />
         <input
           ref={inputRef}
           className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -96,7 +96,7 @@ export const StickySearch = observer(function StickySearch() {
               fetchStickies();
             }}
           >
-            <CloseIcon className="h-3 w-3" />
+            <CloseOutline className="h-3 w-3" />
           </button>
         )}
       </div>
diff --git a/apps/web/core/components/stickies/modal/stickies.tsx b/apps/web/core/components/stickies/modal/stickies.tsx
index 95746422ebc..e56978d109e 100644
--- a/apps/web/core/components/stickies/modal/stickies.tsx
+++ b/apps/web/core/components/stickies/modal/stickies.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 
 // plane ui
-import { RecentStickyIcon, PlusIcon, CloseIcon } from "@plane/propel/icons";
+import { AddOutline, CloseOutline, MultipleStickyOutline } from "@makeplane/propel/icons";
 // hooks
 import { useSticky } from "@/hooks/use-stickies";
 // components
@@ -35,7 +35,7 @@ export const Stickies = observer(function Stickies(props: TProps) {
       <div className="mb-6 flex items-center justify-between">
         {/* Title */}
         <div className="flex items-center gap-2 text-secondary">
-          <RecentStickyIcon className="size-5 flex-shrink-0 rotate-90" />
+          <MultipleStickyOutline className="size-5 flex-shrink-0 rotate-90" />
           <p className="text-18 font-medium">Your stickies</p>
         </div>
         {/* actions */}
@@ -49,7 +49,7 @@ export const Stickies = observer(function Stickies(props: TProps) {
             className="my-auto flex gap-1 text-13 font-medium text-accent-primary"
             disabled={creatingSticky}
           >
-            <PlusIcon className="my-auto size-4" /> <span>Add sticky</span>
+            <AddOutline className="my-auto size-4" /> <span>Add sticky</span>
             {creatingSticky && (
               <div className="ml-2 flex items-center justify-center">
                 <div
@@ -66,7 +66,7 @@ export const Stickies = observer(function Stickies(props: TProps) {
               onClick={handleClose}
               className="my-auto grid flex-shrink-0 place-items-center rounded-sm p-1 text-tertiary transition-colors hover:bg-layer-1 hover:text-primary"
             >
-              <CloseIcon className="size-4 text-placeholder" />
+              <CloseOutline className="size-4 text-placeholder" />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/stickies/sticky/root.tsx b/apps/web/core/components/stickies/sticky/root.tsx
index b2afc84c3a6..17fa652d9ee 100644
--- a/apps/web/core/components/stickies/sticky/root.tsx
+++ b/apps/web/core/components/stickies/sticky/root.tsx
@@ -7,7 +7,7 @@
 import { useCallback, useState } from "react";
 import { debounce } from "lodash-es";
 import { observer } from "mobx-react";
-import { Minimize2 } from "lucide-react";
+import { ArrowCollapseOutline } from "@makeplane/propel/icons";
 // plane types
 import type { TSticky } from "@plane/types";
 // plane utils
@@ -88,7 +88,7 @@ export const StickyNote = observer(function StickyNote(props: TProps) {
         {/* {isStickiesPage && <StickyItemDragHandle isDragging={false} />}{" "} */}
         {onClose && (
           <button type="button" className="flex flex-shrink-0 justify-end p-2.5" onClick={onClose}>
-            <Minimize2 className="size-4" />
+            <ArrowCollapseOutline className="size-4" />
           </button>
         )}
         {/* inputs */}
diff --git a/apps/web/core/components/stickies/widget.tsx b/apps/web/core/components/stickies/widget.tsx
index 929c6b69e77..8324312e9b1 100644
--- a/apps/web/core/components/stickies/widget.tsx
+++ b/apps/web/core/components/stickies/widget.tsx
@@ -9,7 +9,7 @@ import { useParams } from "next/navigation";
 
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 // hooks
 import { useSticky } from "@/hooks/use-stickies";
 // local imports
@@ -43,7 +43,7 @@ export const StickiesWidget = observer(function StickiesWidget() {
             className="my-auto flex gap-1 text-13 font-medium text-accent-primary"
             disabled={creatingSticky}
           >
-            <PlusIcon className="my-auto size-4" />
+            <AddOutline className="my-auto size-4" />
             <span>{t("stickies.add")}</span>
             {creatingSticky && (
               <div
diff --git a/apps/web/core/components/ui/empty-space.tsx b/apps/web/core/components/ui/empty-space.tsx
index dabb72c7c8c..1dacfd33fec 100644
--- a/apps/web/core/components/ui/empty-space.tsx
+++ b/apps/web/core/components/ui/empty-space.tsx
@@ -7,7 +7,7 @@
 // next
 import React from "react";
 import Link from "next/link";
-import { ChevronRightIcon } from "@plane/propel/icons";
+import { ChevronRightOutline } from "@makeplane/propel/icons";
 
 type EmptySpaceProps = {
   title: string;
@@ -68,7 +68,7 @@ function EmptySpaceItem({ title, description, Icon, action, href }: EmptySpaceIt
         {description ? <div className="text-13">{description}</div> : null}
       </div>
       <div className="flex-shrink-0 self-center">
-        <ChevronRightIcon className="h-5 w-5 text-secondary group-hover:text-primary" aria-hidden="true" />
+        <ChevronRightOutline className="h-5 w-5 text-secondary group-hover:text-primary" aria-hidden="true" />
       </div>
     </div>
   );
diff --git a/apps/web/core/components/ui/integration-and-import-export-banner.tsx b/apps/web/core/components/ui/integration-and-import-export-banner.tsx
index a67c2d6c33d..edadffd11cc 100644
--- a/apps/web/core/components/ui/integration-and-import-export-banner.tsx
+++ b/apps/web/core/components/ui/integration-and-import-export-banner.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { AlertCircle } from "lucide-react";
+import { WarningCircleOutline } from "@makeplane/propel/icons";
 
 type Props = {
   bannerName: string;
@@ -17,7 +17,7 @@ export function IntegrationAndImportExportBanner({ bannerName, description }: Pr
       <h3 className="text-18 font-medium">{bannerName}</h3>
       {description && (
         <div className="flex items-center gap-3 rounded-[10px] border border-accent-strong/75 bg-accent-primary/5 p-4 text-13 text-primary">
-          <AlertCircle className="h-6 w-6 text-primary" />
+          <WarningCircleOutline className="h-6 w-6 text-primary" />
           <p className="leading-5">{description}</p>
         </div>
       )}
diff --git a/apps/web/core/components/views/applied-filters/access.tsx b/apps/web/core/components/views/applied-filters/access.tsx
index 36f68435f96..a880baa63d5 100644
--- a/apps/web/core/components/views/applied-filters/access.tsx
+++ b/apps/web/core/components/views/applied-filters/access.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // icons
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // constants
 // helpers
 import type { EViewAccess } from "@plane/types";
@@ -44,7 +44,7 @@ export const AppliedAccessFilters = observer(function AppliedAccessFilters(props
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemove(access)}
               >
-                <CloseIcon height={10} width={10} strokeWidth={2} />
+                <CloseOutline height={10} width={10} />
               </button>
             )}
           </div>
diff --git a/apps/web/core/components/views/applied-filters/root.tsx b/apps/web/core/components/views/applied-filters/root.tsx
index 0999e373d5d..2f58af48243 100644
--- a/apps/web/core/components/views/applied-filters/root.tsx
+++ b/apps/web/core/components/views/applied-filters/root.tsx
@@ -6,7 +6,7 @@
 
 import { useTranslation } from "@plane/i18n";
 import { PillButton } from "@makeplane/propel/components/pill";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { EViewAccess, TViewFilterProps } from "@plane/types";
 import { replaceUnderscoreIfSnakeCase } from "@plane/utils";
@@ -77,7 +77,7 @@ export function ViewAppliedFiltersList(props: Props) {
                 className="grid place-items-center text-tertiary hover:text-secondary"
                 onClick={() => handleRemoveFilter(filterKey, null)}
               >
-                <CloseIcon height={12} width={12} strokeWidth={2} />
+                <CloseOutline height={12} width={12} />
               </button>
             )}
           </div>
@@ -89,7 +89,7 @@ export function ViewAppliedFiltersList(props: Props) {
           size="md"
           variant="outline"
           label={t("common.clear_all")}
-          endIcon={<CloseIcon height={12} width={12} strokeWidth={2} />}
+          endIcon={<CloseOutline height={12} width={12} />}
           onClick={handleClearAllFilters}
         />
       )}
diff --git a/apps/web/core/components/views/filters/filter-selection.tsx b/apps/web/core/components/views/filters/filter-selection.tsx
index 04cd45d5eb6..ed08adf7065 100644
--- a/apps/web/core/components/views/filters/filter-selection.tsx
+++ b/apps/web/core/components/views/filters/filter-selection.tsx
@@ -7,7 +7,7 @@
 import { useState } from "react";
 import { observer } from "mobx-react";
 
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
+import { CloseOutline, SearchOutline } from "@makeplane/propel/icons";
 import type { TViewFilterProps, TViewFilters } from "@plane/types";
 import { EViewAccess } from "@plane/types";
 // components
@@ -58,7 +58,7 @@ export const ViewFiltersSelection = observer(function ViewFiltersSelection(props
     <div className="flex h-full w-full flex-col overflow-hidden">
       <div className="bg-surface-1 p-2.5 pb-0">
         <div className="flex items-center gap-1.5 rounded-sm border-[0.5px] border-subtle bg-surface-2 px-1.5 py-1 text-11">
-          <SearchIcon className="text-placeholder" width={12} height={12} strokeWidth={2} />
+          <SearchOutline className="text-placeholder" width={12} height={12} />
           <input
             type="text"
             className="w-full bg-surface-2 outline-none placeholder:text-placeholder"
@@ -70,7 +70,7 @@ export const ViewFiltersSelection = observer(function ViewFiltersSelection(props
           />
           {filtersSearchQuery !== "" && (
             <button type="button" className="grid place-items-center" onClick={() => setFiltersSearchQuery("")}>
-              <CloseIcon className="text-tertiary" height={12} width={12} strokeWidth={2} />
+              <CloseOutline className="text-tertiary" height={12} width={12} />
             </button>
           )}
         </div>
diff --git a/apps/web/core/components/views/filters/order-by.tsx b/apps/web/core/components/views/filters/order-by.tsx
index 33360658864..1ea41f7b987 100644
--- a/apps/web/core/components/views/filters/order-by.tsx
+++ b/apps/web/core/components/views/filters/order-by.tsx
@@ -4,12 +4,11 @@
  * See the LICENSE file for details.
  */
 
-import { ArrowDownWideNarrow, ArrowUpWideNarrow } from "lucide-react";
+import { SortAscendingOutline, SortDescendingOutline, TickOutline } from "@makeplane/propel/icons";
 // plane imports
 import { VIEW_SORT_BY_OPTIONS, VIEW_SORTING_KEY_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { getButtonStyling } from "@plane/propel/button";
-import { CheckIcon } from "@plane/propel/icons";
 import type { TViewFiltersSortBy, TViewFiltersSortKey } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 
@@ -32,7 +31,7 @@ export function ViewOrderByDropdown(props: Props) {
     : getButtonStyling("secondary", "lg");
 
   const icon = (
-    <>{!isDescending ? <ArrowUpWideNarrow className="size-3" /> : <ArrowDownWideNarrow className="size-3" />}</>
+    <>{!isDescending ? <SortAscendingOutline className="size-3" /> : <SortDescendingOutline className="size-3" />}</>
   );
   return (
     <CustomMenu
@@ -58,7 +57,7 @@ export function ViewOrderByDropdown(props: Props) {
           }
         >
           {t(option.i18n_label)}
-          {sortKey === option.key && <CheckIcon className="h-3 w-3" />}
+          {sortKey === option.key && <TickOutline className="h-3 w-3" />}
         </CustomMenu.MenuItem>
       ))}
       <hr className="my-2 border-subtle" />
@@ -76,7 +75,7 @@ export function ViewOrderByDropdown(props: Props) {
             }}
           >
             {t(option.i18n_label)}
-            {isSelected && <CheckIcon className="h-3 w-3" />}
+            {isSelected && <TickOutline className="h-3 w-3" />}
           </CustomMenu.MenuItem>
         );
       })}
diff --git a/apps/web/core/components/views/form.tsx b/apps/web/core/components/views/form.tsx
index ae5712da0e5..5c4ce12f016 100644
--- a/apps/web/core/components/views/form.tsx
+++ b/apps/web/core/components/views/form.tsx
@@ -14,7 +14,7 @@ import { ETabIndices, ISSUE_DISPLAY_FILTERS_BY_PAGE } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { EmojiPicker, EmojiIconPickerTypes, Logo } from "@plane/propel/emoji-icon-picker";
-import { ViewsIcon } from "@plane/propel/icons";
+import { ViewsOutline } from "@makeplane/propel/icons";
 import type {
   IIssueDisplayFilterOptions,
   IIssueDisplayProperties,
@@ -123,7 +123,7 @@ export const ProjectViewForm = observer(function ProjectViewForm(props: Props) {
                     {logoValue?.in_use ? (
                       <Logo logo={logoValue} size={18} type="lucide" />
                     ) : (
-                      <ViewsIcon className="h-4 w-4 text-tertiary" />
+                      <ViewsOutline className="h-4 w-4 text-tertiary" />
                     )}
                   </>
                 </span>
diff --git a/apps/web/core/components/views/quick-actions.tsx b/apps/web/core/components/views/quick-actions.tsx
index 2f2cf28d151..94d8ba948d6 100644
--- a/apps/web/core/components/views/quick-actions.tsx
+++ b/apps/web/core/components/views/quick-actions.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { MoreHorizontal } from "lucide-react";
+import { MoreHorizontalOutline } from "@makeplane/propel/icons";
 // types
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { IconButton } from "@plane/propel/icon-button";
@@ -99,7 +99,7 @@ export const ViewQuickActions = observer(function ViewQuickActions(props: Props)
       {additionalModals}
       <ContextMenu parentRef={parentRef} items={CONTEXT_MENU_ITEMS} />
       <CustomMenu
-        customButton={<IconButton variant="tertiary" size="lg" icon={MoreHorizontal} />}
+        customButton={<IconButton variant="tertiary" size="lg" icon={MoreHorizontalOutline} />}
         placement="bottom-end"
         closeOnSelect
         buttonClassName={customClassName}
diff --git a/apps/web/core/components/views/view-list-header.tsx b/apps/web/core/components/views/view-list-header.tsx
index 2c25850f0ba..bc5e79d97e4 100644
--- a/apps/web/core/components/views/view-list-header.tsx
+++ b/apps/web/core/components/views/view-list-header.tsx
@@ -7,9 +7,8 @@
 import React, { useEffect, useRef, useState } from "react";
 import { observer } from "mobx-react";
 // icons
-import { ListFilter } from "lucide-react";
+import { CloseOutline, FilterOutline, SearchOutline } from "@makeplane/propel/icons";
 import { useOutsideClickDetector } from "@plane/hooks";
-import { SearchIcon, CloseIcon } from "@plane/propel/icons";
 // plane helpers
 // helpers
 import { cn } from "@plane/utils";
@@ -65,7 +64,7 @@ export const ViewListHeader = observer(function ViewListHeader() {
               setIsSearchOpen(true);
               inputRef.current?.focus();
             }}
-            icon={SearchIcon}
+            icon={SearchOutline}
           />
         )}
         <div
@@ -76,7 +75,7 @@ export const ViewListHeader = observer(function ViewListHeader() {
             }
           )}
         >
-          <SearchIcon className="h-3.5 w-3.5" />
+          <SearchOutline className="h-3.5 w-3.5" />
           <input
             ref={inputRef}
             className="w-full max-w-[234px] border-none bg-transparent text-13 text-primary placeholder:text-placeholder focus:outline-none"
@@ -94,7 +93,7 @@ export const ViewListHeader = observer(function ViewListHeader() {
                 setIsSearchOpen(false);
               }}
             >
-              <CloseIcon className="h-3 w-3" />
+              <CloseOutline className="h-3 w-3" />
             </button>
           )}
         </div>
@@ -109,7 +108,7 @@ export const ViewListHeader = observer(function ViewListHeader() {
           }}
         />
         <FiltersDropdown
-          icon={<ListFilter className="h-3 w-3" />}
+          icon={<FilterOutline className="h-3 w-3" />}
           title="Filters"
           placement="bottom-end"
           isFiltersApplied={false}
diff --git a/apps/web/core/components/views/view-list-item-action.tsx b/apps/web/core/components/views/view-list-item-action.tsx
index 7de30992026..d526bc656ae 100644
--- a/apps/web/core/components/views/view-list-item-action.tsx
+++ b/apps/web/core/components/views/view-list-item-action.tsx
@@ -7,11 +7,10 @@
 import React, { useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { Earth } from "lucide-react";
+import { GlobeOutline, LockOutline } from "@makeplane/propel/icons";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel, IS_FAVORITE_MENU_OPEN } from "@plane/constants";
 import { useLocalStorage } from "@plane/hooks";
-import { LockIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IProjectView } from "@plane/types";
 import { EViewAccess } from "@plane/types";
@@ -92,7 +91,7 @@ export const ViewListItemAction = observer(function ViewListItemAction(props: Pr
       <DeleteProjectViewModal data={view} isOpen={deleteViewModal} onClose={() => setDeleteViewModal(false)} />
       <div className="cursor-default text-tertiary">
         <Tooltip label={access === EViewAccess.PUBLIC ? "Public" : "Private"}>
-          {access === EViewAccess.PUBLIC ? <Earth className="h-4 w-4" /> : <LockIcon className="h-4 w-4" />}
+          {access === EViewAccess.PUBLIC ? <GlobeOutline className="h-4 w-4" /> : <LockOutline className="h-4 w-4" />}
         </Tooltip>
       </div>
 
diff --git a/apps/web/core/components/views/view-list-item.tsx b/apps/web/core/components/views/view-list-item.tsx
index a790daca062..011b4738934 100644
--- a/apps/web/core/components/views/view-list-item.tsx
+++ b/apps/web/core/components/views/view-list-item.tsx
@@ -8,7 +8,7 @@ import { useRef } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { ViewsIcon } from "@plane/propel/icons";
+import { ViewsOutline } from "@makeplane/propel/icons";
 // types
 import type { IProjectView } from "@plane/types";
 // components
@@ -39,7 +39,7 @@ export const ProjectViewListItem = observer(function ProjectViewListItem(props:
           {view?.logo_props?.in_use ? (
             <Logo logo={view?.logo_props} size={16} type="lucide" />
           ) : (
-            <ViewsIcon className="h-4 w-4 text-tertiary" />
+            <ViewsOutline className="h-4 w-4 text-tertiary" />
           )}
         </>
       }
diff --git a/apps/web/core/components/web-hooks/form/delete-section.tsx b/apps/web/core/components/web-hooks/form/delete-section.tsx
index 5b51d78dbdf..ef4f5bd1aa4 100644
--- a/apps/web/core/components/web-hooks/form/delete-section.tsx
+++ b/apps/web/core/components/web-hooks/form/delete-section.tsx
@@ -6,7 +6,7 @@
 
 import { Disclosure, Transition } from "@headlessui/react";
 import { Button } from "@plane/propel/button";
-import { ChevronDownIcon, ChevronUpIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, ChevronUpOutline } from "@makeplane/propel/icons";
 
 type Props = {
   openDeleteModal: () => void;
@@ -21,7 +21,7 @@ export function WebhookDeleteSection(props: Props) {
         <div className="w-full">
           <Disclosure.Button as="button" type="button" className="flex w-full items-center justify-between py-4">
             <span className="text-16 tracking-tight">Danger zone</span>
-            {open ? <ChevronUpIcon className="h-5 w-5" /> : <ChevronDownIcon className="h-5 w-5" />}
+            {open ? <ChevronUpOutline className="h-5 w-5" /> : <ChevronDownOutline className="h-5 w-5" />}
           </Disclosure.Button>
 
           <Transition
diff --git a/apps/web/core/components/web-hooks/form/secret-key.tsx b/apps/web/core/components/web-hooks/form/secret-key.tsx
index 5c6867635c7..a4fe3055c2c 100644
--- a/apps/web/core/components/web-hooks/form/secret-key.tsx
+++ b/apps/web/core/components/web-hooks/form/secret-key.tsx
@@ -9,10 +9,9 @@ import { range } from "lodash-es";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { Eye, EyeOff, RefreshCw } from "lucide-react";
+import { CopyOutline, HideOutline, RefreshOutline, ShowOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CopyIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IWebhook } from "@plane/types";
@@ -94,8 +93,8 @@ export const WebhookSecretKey = observer(function WebhookSecretKey(props: Props)
   const toggleShowKey = () => setShouldShowKey((prevState) => !prevState);
 
   const SECRET_KEY_OPTIONS = [
-    { label: "View secret key", Icon: shouldShowKey ? EyeOff : Eye, onClick: toggleShowKey, key: "eye" },
-    { label: "Copy secret key", Icon: CopyIcon, onClick: handleCopySecretKey, key: "copy" },
+    { label: "View secret key", Icon: shouldShowKey ? HideOutline : ShowOutline, onClick: toggleShowKey, key: "eye" },
+    { label: "Copy secret key", Icon: CopyOutline, onClick: handleCopySecretKey, key: "copy" },
   ];
 
   return (
@@ -138,7 +137,7 @@ export const WebhookSecretKey = observer(function WebhookSecretKey(props: Props)
                   variant="secondary"
                   size="lg"
                   loading={isRegenerating}
-                  prependIcon={<RefreshCw />}
+                  prependIcon={<RefreshOutline />}
                 >
                   {isRegenerating ? `${t("re_generating")}...` : t("re_generate_key")}
                 </Button>
diff --git a/apps/web/core/components/workflow/state-option.tsx b/apps/web/core/components/workflow/state-option.tsx
index 20d350e6e77..cbf535ce5d1 100644
--- a/apps/web/core/components/workflow/state-option.tsx
+++ b/apps/web/core/components/workflow/state-option.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Combobox } from "@headlessui/react";
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 export type TStateOptionProps = {
@@ -38,7 +38,7 @@ export const StateOption = observer(function StateOption(props: TStateOptionProp
       {({ selected }) => (
         <>
           <span className="flex-grow truncate">{option.content}</span>
-          {selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
+          {selected && <TickOutline className="h-3.5 w-3.5 flex-shrink-0" />}
         </>
       )}
     </Combobox.Option>
diff --git a/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx b/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx
index bd47d333d17..71198f63715 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/filters/applied-filter.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import { ENotificationFilterType, FILTER_TYPE_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { PillButton } from "@makeplane/propel/components/pill";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { Header, EHeaderVariant } from "@plane/ui";
 // hooks
 import { useWorkspaceNotifications } from "@/hooks/store/notifications";
@@ -54,7 +54,7 @@ export const AppliedFilters = observer(function AppliedFilters(props: TAppliedFi
               size="md"
               variant="outline"
               label={t(filter.i18n_label)}
-              endIcon={<CloseIcon className="h-3 w-3" />}
+              endIcon={<CloseOutline className="h-3 w-3" />}
               onClick={() => handleFilterTypeChange(filter?.value, !isSelected)}
             />
           );
@@ -64,7 +64,7 @@ export const AppliedFilters = observer(function AppliedFilters(props: TAppliedFi
           size="md"
           variant="outline"
           label={t("common.clear_all")}
-          endIcon={<CloseIcon height={12} width={12} strokeWidth={2} />}
+          endIcon={<CloseOutline height={12} width={12} />}
           onClick={handleClearFilters}
         />
       </Header.LeftItem>
diff --git a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx
index 1f6a87f08e4..44305f150e8 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/menu-option-item.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 
 import type { ENotificationFilterType } from "@plane/constants";
-import { CheckIcon } from "@plane/propel/icons";
+import { TickOutline } from "@makeplane/propel/icons";
 // plane imports
 // helpers
 import { cn } from "@plane/utils";
@@ -43,7 +43,7 @@ export const NotificationFilterOptionItem = observer(function NotificationFilter
           "bg-surface-2": !isSelected,
         })}
       >
-        {isSelected && <CheckIcon className="h-2.5 w-2.5" />}
+        {isSelected && <TickOutline className="h-2.5 w-2.5" />}
       </div>
       <div
         className={cn("text-body-xs-medium whitespace-nowrap", {
diff --git a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx
index 13279ca4f5e..789827cc41c 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/filters/menu/root.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { ListFilter } from "lucide-react";
+import { FilterOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { ENotificationFilterType } from "@plane/constants";
 import { FILTER_TYPE_OPTIONS } from "@plane/constants";
@@ -33,7 +33,7 @@ export const NotificationFilter = observer(function NotificationFilter() {
       data={translatedFilterTypeOptions}
       button={
         <Tooltip label={t("notification.options.filters")} side="bottom" disabled={isMobile}>
-          <IconButton size="base" variant="ghost" icon={ListFilter} />
+          <IconButton size="base" variant="ghost" icon={FilterOutline} />
         </Tooltip>
       }
       keyExtractor={(item: { label: string; value: ENotificationFilterType }) => item.value}
diff --git a/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx
index 596e5bde0f9..39cd2deaad3 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/header/options/menu-option/root.tsx
@@ -6,10 +6,15 @@
 
 import type { ReactNode } from "react";
 import { observer } from "mobx-react";
-import { CheckCircle, Clock, MoreVertical } from "lucide-react";
+import {
+  ArchiveOutline,
+  ClockOutline,
+  MoreVerticalOutline,
+  TickCircleOutline,
+  TickOutline,
+} from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
 // plane imports
-import { ArchiveIcon, CheckIcon } from "@plane/propel/icons";
 import type { TNotificationFilter } from "@plane/types";
 import { PopoverMenu } from "@plane/ui";
 // hooks
@@ -44,8 +49,8 @@ export const NotificationHeaderMenuOption = observer(function NotificationHeader
       type: "menu-item",
       label: t("notification.options.show_unread"),
       isActive: filters?.read,
-      prependIcon: <CheckCircle className="h-3 w-3 flex-shrink-0" />,
-      appendIcon: filters?.read ? <CheckIcon className="h-3 w-3" /> : undefined,
+      prependIcon: <TickCircleOutline className="h-3 w-3 flex-shrink-0" />,
+      appendIcon: filters?.read ? <TickOutline className="h-3 w-3" /> : undefined,
       onClick: () => handleFilterChange("read", !filters?.read),
     },
     {
@@ -53,8 +58,8 @@ export const NotificationHeaderMenuOption = observer(function NotificationHeader
       type: "menu-item",
       label: t("notification.options.show_archived"),
       isActive: filters?.archived,
-      prependIcon: <ArchiveIcon className="h-3 w-3 flex-shrink-0" />,
-      appendIcon: filters?.archived ? <CheckIcon className="h-3 w-3" /> : undefined,
+      prependIcon: <ArchiveOutline className="h-3 w-3 flex-shrink-0" />,
+      appendIcon: filters?.archived ? <TickOutline className="h-3 w-3" /> : undefined,
       onClick: () =>
         handleBulkFilterChange({
           archived: !filters?.archived,
@@ -66,8 +71,8 @@ export const NotificationHeaderMenuOption = observer(function NotificationHeader
       type: "menu-item",
       label: t("notification.options.show_snoozed"),
       isActive: filters?.snoozed,
-      prependIcon: <Clock className="h-3 w-3 flex-shrink-0" />,
-      appendIcon: filters?.snoozed ? <CheckIcon className="h-3 w-3" /> : undefined,
+      prependIcon: <ClockOutline className="h-3 w-3 flex-shrink-0" />,
+      appendIcon: filters?.snoozed ? <TickOutline className="h-3 w-3" /> : undefined,
       onClick: () =>
         handleBulkFilterChange({
           snoozed: !filters?.snoozed,
@@ -79,7 +84,7 @@ export const NotificationHeaderMenuOption = observer(function NotificationHeader
   return (
     <PopoverMenu
       data={popoverMenuOptions}
-      button={<IconButton size="base" variant="ghost" icon={MoreVertical} />}
+      button={<IconButton size="base" variant="ghost" icon={MoreVerticalOutline} />}
       keyExtractor={(item: TPopoverMenuOptions) => item.key}
       panelClassName="p-0 py-2 rounded-md border border-subtle bg-surface-1 space-y-1"
       render={(item: TPopoverMenuOptions) => <NotificationMenuOptionItem {...item} />}
diff --git a/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx
index 328099054c9..02784ee4047 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/header/options/root.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { CheckCheck, RefreshCw } from "lucide-react";
+import { CheckDoneOutline, RefreshOutline } from "@makeplane/propel/icons";
 // plane imports
 import { ENotificationLoader, ENotificationQueryParamType } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
@@ -58,7 +58,7 @@ export const NotificationSidebarHeaderOptions = observer(function NotificationSi
         <IconButton
           size="base"
           variant="ghost"
-          icon={loader === ENotificationLoader.MARK_ALL_AS_READY ? Spinner : CheckCheck}
+          icon={loader === ENotificationLoader.MARK_ALL_AS_READY ? Spinner : CheckDoneOutline}
           onClick={() => {
             handleMarkAllNotificationsAsRead();
           }}
@@ -70,7 +70,7 @@ export const NotificationSidebarHeaderOptions = observer(function NotificationSi
         <IconButton
           size="base"
           variant="ghost"
-          icon={RefreshCw}
+          icon={RefreshOutline}
           className={loader === ENotificationLoader.MUTATION_LOADER ? "animate-spin" : ""}
           onClick={refreshNotifications}
         />
diff --git a/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx
index 13f3c412eac..c2440ea8f4f 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/header/root.tsx
@@ -7,7 +7,7 @@
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { InboxIcon } from "@plane/propel/icons";
+import { InboxOutline } from "@makeplane/propel/icons";
 import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -33,7 +33,7 @@ export const NotificationSidebarHeader = observer(function NotificationSidebarHe
             component={
               <BreadcrumbLink
                 label={t("notification.label")}
-                icon={<InboxIcon className="h-4 w-4 text-primary" />}
+                icon={<InboxOutline className="h-4 w-4 text-primary" />}
                 disableTooltip
               />
             }
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx
index a2dc20fa30e..b00e18a697a 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/item.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { Clock } from "lucide-react";
+import { ClockOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { Row } from "@plane/ui";
@@ -125,7 +125,7 @@ export const NotificationItem = observer(function NotificationItem(props: TNotif
             <div className="flex-shrink-0">
               {notification?.snoozed_till ? (
                 <p className="flex flex-shrink-0 items-center justify-end gap-x-1 text-tertiary">
-                  <Clock className="h-4 w-4" />
+                  <ClockOutline className="h-4 w-4" />
                   <span>
                     Till {renderFormattedDate(notification.snoozed_till)},&nbsp;
                     {renderFormattedTime(notification.snoozed_till, "12-hour")}
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx
index 8e5ab806655..5a436663056 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/archive.tsx
@@ -5,10 +5,9 @@
  */
 
 import { observer } from "mobx-react";
-import { ArchiveRestore } from "lucide-react";
+import { ArchiveOutline, RestoreOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { ArchiveIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 // store
 import type { INotification } from "@/store/notifications/notification";
@@ -49,9 +48,9 @@ export const NotificationItemArchiveOption = observer(function NotificationItemA
       callBack={handleNotificationUpdate}
     >
       {data.archived_at ? (
-        <ArchiveRestore className="h-3 w-3 text-tertiary" />
+        <RestoreOutline className="h-3 w-3 text-tertiary" />
       ) : (
-        <ArchiveIcon className="h-3 w-3 text-tertiary" />
+        <ArchiveOutline className="h-3 w-3 text-tertiary" />
       )}
     </NotificationItemOptionButton>
   );
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx
index 16a5b513336..f2f7f9c5f19 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/read.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { MessageSquare } from "lucide-react";
+import { ChatOutline } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
@@ -45,7 +45,7 @@ export const NotificationItemReadOption = observer(function NotificationItemRead
       tooltipContent={data.read_at ? t("notification.options.mark_unread") : t("notification.options.mark_read")}
       callBack={handleNotificationUpdate}
     >
-      <MessageSquare className="h-3 w-3 text-tertiary" />
+      <ChatOutline className="h-3 w-3 text-tertiary" />
     </NotificationItemOptionButton>
   );
 });
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx
index 02e8c353c39..b1eadc51e6a 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/modal.tsx
@@ -9,7 +9,7 @@ import { useForm, Controller } from "react-hook-form";
 // plane imports
 import { allTimeIn30MinutesInterval12HoursFormat } from "@plane/constants";
 import { Button } from "@plane/propel/button";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { CustomSelect, EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
 // components
 import { getDate, cn } from "@plane/utils";
@@ -120,7 +120,7 @@ export function NotificationSnoozeModal(props: TNotificationSnoozeModal) {
 
           <div>
             <button type="button" onClick={handleClose}>
-              <CloseIcon className="h-5 w-5 text-primary" />
+              <CloseOutline className="h-5 w-5 text-primary" />
             </button>
           </div>
         </div>
diff --git a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx
index 14f6189f768..71299f9477c 100644
--- a/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx
+++ b/apps/web/core/components/workspace-notifications/sidebar/notification-card/options/snooze/root.tsx
@@ -7,7 +7,7 @@
 import type { Dispatch, SetStateAction } from "react";
 import { Fragment } from "react";
 import { observer } from "mobx-react";
-import { Clock } from "lucide-react";
+import { ClockOutline } from "@makeplane/propel/icons";
 import { Popover, Transition } from "@headlessui/react";
 // plane imports
 import { NOTIFICATION_SNOOZE_OPTIONS } from "@plane/constants";
@@ -108,7 +108,7 @@ export const NotificationItemSnoozeOption = observer(function NotificationItemSn
                     open ? "bg-layer-1" : ""
                   )}
                 >
-                  <Clock className="h-3 w-3 text-tertiary" />
+                  <ClockOutline className="h-3 w-3 text-tertiary" />
                 </Popover.Button>
               </Tooltip>
 
diff --git a/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx b/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx
index e8f1d632887..4037c5963ae 100644
--- a/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx
+++ b/apps/web/core/components/workspace/ConfirmWorkspaceMemberRemove.tsx
@@ -6,7 +6,7 @@
 
 import React, { useState } from "react";
 import { observer } from "mobx-react";
-import { AlertTriangle } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 import { Dialog, Transition } from "@headlessui/react";
 import { Button } from "@plane/propel/button";
 import { useUser } from "@/hooks/store/user";
@@ -62,7 +62,7 @@ export const ConfirmWorkspaceMemberRemove = observer(function ConfirmWorkspaceMe
                 <div className="px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
                   <div className="sm:flex sm:items-start">
                     <div className="mx-auto flex h-12 w-12 flex-shrink-0 items-center justify-center rounded-full bg-danger-subtle sm:mx-0 sm:h-10 sm:w-10">
-                      <AlertTriangle className="h-6 w-6 text-danger-primary" aria-hidden="true" />
+                      <WarningTriangleOutline className="h-6 w-6 text-danger-primary" aria-hidden="true" />
                     </div>
                     <div className="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
                       <Dialog.Title as="h3" className="text-16 leading-6 font-medium text-primary">
diff --git a/apps/web/core/components/workspace/billing/comparison/base.tsx b/apps/web/core/components/workspace/billing/comparison/base.tsx
index b09965a0282..f36cad4f445 100644
--- a/apps/web/core/components/workspace/billing/comparison/base.tsx
+++ b/apps/web/core/components/workspace/billing/comparison/base.tsx
@@ -5,7 +5,7 @@
  */
 
 import { observer } from "mobx-react";
-import { ArrowDown, ArrowUp } from "lucide-react";
+import { ArrowDownOutline, TopArrowOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Button } from "@plane/propel/button";
 import { cn } from "@plane/utils";
@@ -130,7 +130,7 @@ export const PlansComparisonBase = observer(function PlansComparisonBase(props:
             onClick={() => {
               setIsCompareAllFeaturesSectionOpen(!isCompareAllFeaturesSectionOpen);
             }}
-            appendIcon={isCompareAllFeaturesSectionOpen ? <ArrowUp /> : <ArrowDown />}
+            appendIcon={isCompareAllFeaturesSectionOpen ? <TopArrowOutline /> : <ArrowDownOutline />}
           >
             {isCompareAllFeaturesSectionOpen ? "Collapse comparison" : "Compare all features"}
           </Button>
diff --git a/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx b/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx
index b8bcadc07fc..85ad64c02c4 100644
--- a/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx
+++ b/apps/web/core/components/workspace/billing/comparison/feature-detail.tsx
@@ -4,7 +4,8 @@
  * See the LICENSE file for details.
  */
 
-import { CheckCircle2, Minus, MinusCircle } from "lucide-react";
+import { MinusCircle } from "lucide-react";
+import { MinusOutline, TickCircleOutline } from "@makeplane/propel/icons";
 import type { EProductSubscriptionEnum } from "@plane/types";
 // plane imports
 // constants
@@ -19,10 +20,10 @@ export function PlanFeatureDetail(props: TPlanFeatureDetailProps) {
   const { data } = props;
 
   if (data === null || data === undefined) {
-    return <Minus className="size-4 text-placeholder" />;
+    return <MinusOutline className="size-4 text-placeholder" />;
   }
   if (data === true) {
-    return <CheckCircle2 className="size-4 text-accent-primary" />;
+    return <TickCircleOutline className="size-4 text-accent-primary" />;
   }
   if (data === false) {
     return <MinusCircle className="size-4 text-placeholder" />;
diff --git a/apps/web/core/components/workspace/billing/comparison/plans.tsx b/apps/web/core/components/workspace/billing/comparison/plans.tsx
index a51afb5d187..3273aff2d24 100644
--- a/apps/web/core/components/workspace/billing/comparison/plans.tsx
+++ b/apps/web/core/components/workspace/billing/comparison/plans.tsx
@@ -4,7 +4,7 @@
  * See the LICENSE file for details.
  */
 
-import { Mail, MessageCircle, MessageSquare } from "lucide-react";
+import { ChatOutline, MailOutline } from "@makeplane/propel/icons";
 import { EProductSubscriptionEnum } from "@plane/types";
 // plane imports
 import { cn } from "@plane/utils";
@@ -51,7 +51,7 @@ type PlanePlans = {
 };
 
 function ForumIcon({ className }: { className?: string }) {
-  return <MessageSquare className={cn(className, "size-5 text-secondary")} />;
+  return <ChatOutline className={cn(className, "size-5 text-secondary")} />;
 }
 
 export function ComingSoonBadge({ className }: { className?: string }) {
@@ -1216,15 +1216,15 @@ export const PLANS_COMPARISON_LIST: TPlansComparisonDetails[] = [
           ),
           one: (
             <div className="flex items-center gap-1">
-              <Mail className="size-4 flex-shrink-0" />
+              <MailOutline className="size-4 flex-shrink-0" />
               <ForumIcon className="size-4 flex-shrink-0" />
             </div>
           ),
           pro: (
             <div className="flex items-center gap-1">
-              <Mail className="size-4 flex-shrink-0" />
+              <MailOutline className="size-4 flex-shrink-0" />
               <ForumIcon className="size-4 flex-shrink-0" />
-              <MessageCircle className="size-4 flex-shrink-0" />
+              <ChatOutline className="size-4 flex-shrink-0" />
             </div>
           ),
           business: "Full-suite\nprofessional services",
diff --git a/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx b/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx
index 9ec6dc42806..274b65ffff2 100644
--- a/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx
+++ b/apps/web/core/components/workspace/confirm-workspace-member-remove.tsx
@@ -6,7 +6,7 @@
 
 import { useState } from "react";
 import { observer } from "mobx-react";
-import { AlertTriangle } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 // ui
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
@@ -50,7 +50,7 @@ export const ConfirmWorkspaceMemberRemove = observer(function ConfirmWorkspaceMe
       <div className="px-4 pt-5 pb-4 sm:p-6 sm:pb-4">
         <div className="sm:flex sm:items-start">
           <div className="mx-auto flex h-12 w-12 shrink-0 items-center justify-center rounded-full bg-danger-subtle sm:mx-0 sm:h-10 sm:w-10">
-            <AlertTriangle className="h-6 w-6 text-danger-primary" aria-hidden="true" />
+            <WarningTriangleOutline className="h-6 w-6 text-danger-primary" aria-hidden="true" />
           </div>
           <div className="mt-3 text-center sm:mt-0 sm:ml-4 sm:text-left">
             <h3 className="text-h5-medium leading-6 text-primary">
diff --git a/apps/web/core/components/workspace/delete-workspace-form.tsx b/apps/web/core/components/workspace/delete-workspace-form.tsx
index 6c9d6fb33bf..1a837c5d830 100644
--- a/apps/web/core/components/workspace/delete-workspace-form.tsx
+++ b/apps/web/core/components/workspace/delete-workspace-form.tsx
@@ -6,7 +6,7 @@
 
 import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
-import { AlertTriangle } from "lucide-react";
+import { WarningTriangleOutline } from "@makeplane/propel/icons";
 // Plane Imports
 import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
@@ -90,7 +90,7 @@ export const DeleteWorkspaceForm = observer(function DeleteWorkspaceForm(props:
             "grid size-12 shrink-0 place-items-center rounded-full bg-danger-subtle text-danger-primary sm:size-10"
           )}
         >
-          <AlertTriangle className="size-5 text-danger-primary" aria-hidden="true" />
+          <WarningTriangleOutline className="size-5 text-danger-primary" aria-hidden="true" />
         </span>
         <div>
           <div className="text-center sm:text-left">
diff --git a/apps/web/core/components/workspace/invite-modal/actions.tsx b/apps/web/core/components/workspace/invite-modal/actions.tsx
index 23b5f4d0dda..17a800f1e88 100644
--- a/apps/web/core/components/workspace/invite-modal/actions.tsx
+++ b/apps/web/core/components/workspace/invite-modal/actions.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 type TInvitationModalActionsProps = {
@@ -53,7 +53,7 @@ export const InvitationModalActions = observer(function InvitationModalActions(p
         onClick={appendField}
         disabled={isInviteDisabled}
       >
-        <PlusIcon className="h-3.5 w-3.5" />
+        <AddOutline className="h-3.5 w-3.5" />
         {addMoreButtonText || t("common.add_more")}
       </button>
       <div className="flex items-center gap-2">
diff --git a/apps/web/core/components/workspace/invite-modal/fields.tsx b/apps/web/core/components/workspace/invite-modal/fields.tsx
index 7ab12a64f0b..b73f4356c9b 100644
--- a/apps/web/core/components/workspace/invite-modal/fields.tsx
+++ b/apps/web/core/components/workspace/invite-modal/fields.tsx
@@ -12,7 +12,7 @@ import { Field } from "@makeplane/propel/components/field";
 import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { ROLE } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CloseIcon } from "@plane/propel/icons";
+import { CloseOutline } from "@makeplane/propel/icons";
 import { CustomSelect } from "@plane/ui";
 import { cn } from "@plane/utils";
 // hooks
@@ -120,7 +120,7 @@ export const InvitationFields = observer(function InvitationFields(props: TInvit
                   className="place-items-center self-center rounded-sm"
                   onClick={() => remove(index)}
                 >
-                  <CloseIcon className="h-4 w-4 text-secondary" />
+                  <CloseOutline className="h-4 w-4 text-secondary" />
                 </button>
               </div>
             )}
diff --git a/apps/web/core/components/workspace/settings/invitations-list-item.tsx b/apps/web/core/components/workspace/settings/invitations-list-item.tsx
index cf0db45a26a..708b63d30a0 100644
--- a/apps/web/core/components/workspace/settings/invitations-list-item.tsx
+++ b/apps/web/core/components/workspace/settings/invitations-list-item.tsx
@@ -10,7 +10,7 @@ import { useParams } from "next/navigation";
 // plane imports
 import { ROLE, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { LinkIcon, TrashIcon, ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline, DeleteOutline, LinkOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TContextMenuItem } from "@plane/ui";
 import { CustomSelect, CustomMenu } from "@plane/ui";
@@ -94,7 +94,7 @@ export const WorkspaceInvitationsListItem = observer(function WorkspaceInvitatio
       key: "copy-link",
       action: () => void handleCopyText(),
       title: t("common.actions.copy_link"),
-      icon: LinkIcon,
+      icon: LinkOutline,
       shouldRender: !!invitationDetails.invite_link,
     },
     {
@@ -103,7 +103,7 @@ export const WorkspaceInvitationsListItem = observer(function WorkspaceInvitatio
         setRemoveMemberModal(true);
       },
       title: t("common.remove"),
-      icon: TrashIcon,
+      icon: DeleteOutline,
       shouldRender: isAdmin,
       className: "text-danger-primary",
       iconClassName: "text-danger-primary",
@@ -146,7 +146,7 @@ export const WorkspaceInvitationsListItem = observer(function WorkspaceInvitatio
                 </span>
                 {hasRoleChangeAccess && (
                   <span className="grid place-items-center">
-                    <ChevronDownIcon className="h-3 w-3" />
+                    <ChevronDownOutline className="h-3 w-3" />
                   </span>
                 )}
               </div>
diff --git a/apps/web/core/components/workspace/settings/member-columns.tsx b/apps/web/core/components/workspace/settings/member-columns.tsx
index 1ad49f74710..54e711804a2 100644
--- a/apps/web/core/components/workspace/settings/member-columns.tsx
+++ b/apps/web/core/components/workspace/settings/member-columns.tsx
@@ -11,7 +11,7 @@ import { Controller, useForm } from "react-hook-form";
 import { Disclosure } from "@headlessui/react";
 // plane imports
 import { ROLE, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
-import { TrashIcon, SuspendedUserIcon } from "@plane/propel/icons";
+import { DeactivatedUserOutline, DeleteOutline } from "@makeplane/propel/icons";
 import { Pill, EPillVariant, EPillSize } from "@plane/propel/pill";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { IUser, IWorkspaceMember } from "@plane/types";
@@ -56,7 +56,7 @@ export function NameColumn(props: NameProps) {
             <div className="flex flex-1 items-center gap-x-2 gap-y-2">
               {isSuspended ? (
                 <div className="rounded-full bg-layer-1">
-                  <SuspendedUserIcon className="size-6 text-placeholder" />
+                  <DeactivatedUserOutline className="size-6 text-placeholder" />
                 </div>
               ) : avatar_url && avatar_url.trim() !== "" ? (
                 <Link href={`/${workspaceSlug}/profile/${id}`}>
@@ -99,7 +99,7 @@ export function NameColumn(props: NameProps) {
                       }
                     }}
                   >
-                    <TrashIcon className="size-3.5 align-middle" /> {id === currentUser?.id ? "Leave " : "Remove "}
+                    <DeleteOutline className="size-3.5 align-middle" /> {id === currentUser?.id ? "Leave " : "Remove "}
                   </div>
                 )}
               />
diff --git a/apps/web/core/components/workspace/settings/members-list.tsx b/apps/web/core/components/workspace/settings/members-list.tsx
index 41b4bed3fb7..17067760d7b 100644
--- a/apps/web/core/components/workspace/settings/members-list.tsx
+++ b/apps/web/core/components/workspace/settings/members-list.tsx
@@ -11,7 +11,7 @@ import useSWR from "swr";
 import { Disclosure } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { ChevronDownIcon } from "@plane/propel/icons";
+import { ChevronDownOutline } from "@makeplane/propel/icons";
 import { Collapsible } from "@plane/ui";
 // components
 import { CountChip } from "@/components/common/count-chip";
@@ -92,7 +92,7 @@ export const WorkspaceMembersList = observer(function WorkspaceMembersList(props
                   <CountChip count={searchedInvitationsIds.length} className="m-auto ml-2 h-5" />
                 )}
               </div>{" "}
-              <ChevronDownIcon className={`h-5 w-5 transition-all ${showPendingInvites ? "rotate-180" : ""}`} />
+              <ChevronDownOutline className={`h-5 w-5 transition-all ${showPendingInvites ? "rotate-180" : ""}`} />
             </div>
           }
         >
diff --git a/apps/web/core/components/workspace/settings/workspace-details.tsx b/apps/web/core/components/workspace/settings/workspace-details.tsx
index 8b6dff916ee..bf96889351b 100644
--- a/apps/web/core/components/workspace/settings/workspace-details.tsx
+++ b/apps/web/core/components/workspace/settings/workspace-details.tsx
@@ -13,7 +13,7 @@ import { Input, InputGroup } from "@makeplane/propel/components/input";
 import { ORGANIZATION_SIZE, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { EditIcon } from "@plane/propel/icons";
+import { EditOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { IWorkspace } from "@plane/types";
 import { CustomSelect } from "@plane/ui";
@@ -179,7 +179,7 @@ export const WorkspaceDetails = observer(function WorkspaceDetails() {
               >
                 {workspaceLogo && workspaceLogo !== "" ? (
                   <>
-                    <EditIcon className="h-3 w-3" />
+                    <EditOutline className="h-3 w-3" />
                     {t("workspace_settings.settings.general.edit_logo")}
                   </>
                 ) : (
diff --git a/apps/web/core/components/workspace/sidebar/dropdown-item.tsx b/apps/web/core/components/workspace/sidebar/dropdown-item.tsx
index 5b660d326f9..b4c7f04f5ca 100644
--- a/apps/web/core/components/workspace/sidebar/dropdown-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/dropdown-item.tsx
@@ -7,12 +7,11 @@
 import { observer } from "mobx-react";
 import Link from "next/link";
 import { useParams } from "next/navigation";
-import { Settings, UserPlus } from "lucide-react";
+import { SettingsOutline, TickOutline, UserPlusOutline } from "@makeplane/propel/icons";
 import { Menu } from "@headlessui/react";
 // plane imports
 import { EUserPermissions } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CheckIcon } from "@plane/propel/icons";
 import type { IWorkspace } from "@plane/types";
 import { cn, getFileURL, getUserRole } from "@plane/utils";
 
@@ -80,7 +79,7 @@ const SidebarDropdownItem = observer(function SidebarDropdownItem(props: TProps)
           </div>
           {workspace.id === activeWorkspace?.id ? (
             <span className="flex-shrink-0 p-1">
-              <CheckIcon className="h-5 w-5 text-primary" />
+              <TickOutline className="h-5 w-5 text-primary" />
             </span>
           ) : null}
         </div>
@@ -96,7 +95,7 @@ const SidebarDropdownItem = observer(function SidebarDropdownItem(props: TProps)
                   }}
                   className="flex gap-1.5 rounded-md border border-strong bg-layer-2 px-2.5 py-1.5 text-secondary transition-colors hover:border-strong hover:text-secondary hover:shadow-raised-100"
                 >
-                  <Settings className="my-auto h-4 w-4 flex-shrink-0" />
+                  <SettingsOutline className="my-auto h-4 w-4 flex-shrink-0" />
                   <span className="my-auto text-13 font-medium whitespace-nowrap">{t("settings")}</span>
                 </Link>
               )}
@@ -109,7 +108,7 @@ const SidebarDropdownItem = observer(function SidebarDropdownItem(props: TProps)
                   }}
                   className="flex gap-1.5 rounded-md border border-strong bg-layer-2 px-2.5 py-1.5 text-secondary transition-colors hover:border-strong hover:text-secondary hover:shadow-raised-100"
                 >
-                  <UserPlus className="my-auto h-4 w-4 flex-shrink-0" />
+                  <UserPlusOutline className="my-auto h-4 w-4 flex-shrink-0" />
                   <span className="my-auto text-13 font-medium whitespace-nowrap">
                     {t("project_settings.members.invite_members.title")}
                   </span>
diff --git a/apps/web/core/components/workspace/sidebar/extended-sidebar-item.tsx b/apps/web/core/components/workspace/sidebar/extended-sidebar-item.tsx
index c8fa2f1aa92..952c651af61 100644
--- a/apps/web/core/components/workspace/sidebar/extended-sidebar-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/extended-sidebar-item.tsx
@@ -11,7 +11,7 @@ import { attachInstruction, extractInstruction } from "@atlaskit/pragmatic-drag-
 import { observer } from "mobx-react";
 import Link from "next/link";
 import { useParams, usePathname } from "next/navigation";
-import { Pin, PinOff } from "lucide-react";
+import { PinOutline, UnpinOutline } from "@makeplane/propel/icons";
 // plane imports
 import type { IWorkspaceSidebarNavigationItem } from "@plane/constants";
 import { EUserPermissionsLevel } from "@plane/constants";
@@ -203,14 +203,14 @@ export const ExtendedSidebarItem = observer(function ExtendedSidebarItem(props:
             )}
             {isPinned ? (
               <Tooltip label="Unpin">
-                <PinOff
+                <UnpinOutline
                   className="size-3.5 flex-shrink-0 text-placeholder outline-none hover:text-tertiary"
                   onClick={() => unPinNavigationItem(item.key)}
                 />
               </Tooltip>
             ) : (
               <Tooltip label="Pin">
-                <Pin
+                <PinOutline
                   className="size-3.5 flex-shrink-0 text-placeholder outline-none hover:text-tertiary"
                   onClick={() => pinNavigationItem(item.key)}
                 />
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx
index 752728b699d..d87cb4f696b 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-folder.tsx
@@ -19,12 +19,18 @@ import { attachInstruction } from "@atlaskit/pragmatic-drag-and-drop-hitbox/tree
 import { orderBy } from "lodash-es";
 import { useParams } from "next/navigation";
 import { createRoot } from "react-dom/client";
-import { Star, MoreHorizontal, GripVertical } from "lucide-react";
+import {
+  ChevronRightOutline,
+  DraftsOutline,
+  DragDropOutline,
+  MoreHorizontalOutline,
+  StarFilled,
+} from "@makeplane/propel/icons";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
 import { useOutsideClickDetector } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
-import { DraftIcon, FavoriteFolderIcon, ChevronRightIcon } from "@plane/propel/icons";
+import { FavoriteFolderIcon } from "@plane/propel/icons";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import type { IFavorite, InstructionType } from "@plane/types";
 import { CustomMenu, DropIndicator, DragHandle } from "@plane/ui";
@@ -169,7 +175,7 @@ export function FavoriteFolder(props: Props) {
               {/* draggable indicator */}
 
               <div className="absolute left-0 hidden h-3 w-3 flex-shrink-0 cursor-pointer items-center justify-center rounded-xs bg-surface-2 text-secondary transition-colors group-hover:flex hover:text-primary">
-                <GripVertical className="h-3 w-3" />
+                <DragDropOutline className="h-3 w-3" />
               </div>
 
               <>
@@ -211,7 +217,7 @@ export function FavoriteFolder(props: Props) {
                       ref={actionSectionRef}
                       className="grid place-items-center rounded-sm p-0.5 text-placeholder hover:bg-layer-1"
                     >
-                      <MoreHorizontal className="size-3" />
+                      <MoreHorizontalOutline className="size-3" />
                     </span>
                   }
                   menuButtonOnClick={() => setIsMenuActive(!isMenuActive)}
@@ -227,13 +233,13 @@ export function FavoriteFolder(props: Props) {
                 >
                   <CustomMenu.MenuItem onClick={() => handleRemoveFromFavorites(favorite)}>
                     <span className="flex items-center justify-start gap-2">
-                      <Star className="fill-yellow-500 stroke-yellow-500 h-3.5 w-3.5" />
+                      <StarFilled className="text-yellow-500 h-3.5 w-3.5" />
                       <span>Remove from favorites</span>
                     </span>
                   </CustomMenu.MenuItem>
                   <CustomMenu.MenuItem onClick={() => setFolderToRename(favorite.id)}>
                     <div className="flex items-center justify-start gap-2">
-                      <DraftIcon className="h-3.5 w-3.5 stroke-[1.5] text-tertiary" />
+                      <DraftsOutline className="h-3.5 w-3.5 stroke-[1.5] text-tertiary" />
                       <span>Rename Folder</span>
                     </div>
                   </CustomMenu.MenuItem>
@@ -248,7 +254,7 @@ export function FavoriteFolder(props: Props) {
                     open ? "aria_labels.projects_sidebar.close_folder" : "aria_labels.projects_sidebar.open_folder"
                   )}
                 >
-                  <ChevronRightIcon
+                  <ChevronRightOutline
                     className={cn("size-3 flex-shrink-0 text-placeholder transition-transform", {
                       "rotate-90": open,
                     })}
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-icon.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-icon.tsx
index 64c3a4ae6c2..a4255352efa 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-icon.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-icon.tsx
@@ -7,16 +7,17 @@
 import type { LucideIcon } from "lucide-react";
 // plane imports
 import type { TLogoProps } from "@plane/types";
-import { CycleIcon, FavoriteFolderIcon, ModuleIcon, PageIcon, ProjectIcon, ViewsIcon } from "@plane/propel/icons";
+import { FavoriteFolderIcon } from "@plane/propel/icons";
+import { CyclesOutline, ModuleOutline, PagesOutline, ProjectsOutline, ViewsOutline } from "@makeplane/propel/icons";
 import type { ISvgIcons } from "@plane/propel/icons";
 import { Logo } from "@plane/propel/emoji-icon-picker";
 
 const ICON_MAP: Record<string, React.FC<ISvgIcons> | LucideIcon> = {
-  page: PageIcon,
-  project: ProjectIcon,
-  view: ViewsIcon,
-  module: ModuleIcon,
-  cycle: CycleIcon,
+  page: PagesOutline,
+  project: ProjectsOutline,
+  view: ViewsOutline,
+  module: ModuleOutline,
+  cycle: CyclesOutline,
   folder: FavoriteFolderIcon,
 };
 
@@ -26,7 +27,7 @@ type Props = {
 };
 
 export const FavoriteItemIcon = ({ type, logo }: Props) => {
-  const Icon = ICON_MAP[type] ?? PageIcon;
+  const Icon = ICON_MAP[type] ?? PagesOutline;
 
   return (
     <>
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx
index 521554861ab..75dd830d5f7 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorite-items/common/favorite-item-quick-action.tsx
@@ -6,7 +6,7 @@
 
 import React from "react";
 import { observer } from "mobx-react";
-import { MoreHorizontal, Star } from "lucide-react";
+import { MoreHorizontalOutline, StarFilled } from "@makeplane/propel/icons";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import type { IFavorite } from "@plane/types";
@@ -31,7 +31,7 @@ export const FavoriteItemQuickAction = observer(function FavoriteItemQuickAction
     <CustomMenu
       customButton={
         <span ref={ref} className="grid place-items-center rounded-sm p-0.5 text-placeholder hover:bg-layer-1">
-          <MoreHorizontal className="size-4" />
+          <MoreHorizontalOutline className="size-4" />
         </span>
       }
       menuButtonOnClick={() => onChange(!isMenuActive)}
@@ -47,7 +47,7 @@ export const FavoriteItemQuickAction = observer(function FavoriteItemQuickAction
     >
       <CustomMenu.MenuItem onClick={() => handleRemoveFromFavorites(favorite)}>
         <span className="flex items-center justify-start gap-2">
-          <Star className="fill-yellow-500 stroke-yellow-500 h-3.5 w-3.5 flex-shrink-0" />
+          <StarFilled className="text-yellow-500 h-3.5 w-3.5 flex-shrink-0" />
           <span>Remove from favorites</span>
         </span>
       </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx b/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
index c6759bcb28d..fb0eec8ce14 100644
--- a/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
+++ b/apps/web/core/components/workspace/sidebar/favorites/favorites-menu.tsx
@@ -15,11 +15,10 @@ import { dropTargetForElements } from "@atlaskit/pragmatic-drag-and-drop/element
 import { orderBy } from "lodash-es";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
-import { FolderPlus } from "lucide-react";
+import { ChevronRightOutline, CreateFolderOutline } from "@makeplane/propel/icons";
 import { Disclosure, Transition } from "@headlessui/react";
 import { IS_FAVORITE_MENU_OPEN } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ChevronRightIcon } from "@plane/propel/icons";
 // ui
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -215,7 +214,7 @@ export const SidebarFavoritesMenu = observer(function SidebarFavoritesMenu() {
                   if (!isFavoriteMenuOpen) toggleFavoriteMenu(!isFavoriteMenuOpen);
                 }}
                 aria-label={t("aria_labels.projects_sidebar.create_favorites_folder")}
-                icon={FolderPlus}
+                icon={CreateFolderOutline}
               />
             </Tooltip>
             <Disclosure.Button
@@ -229,7 +228,7 @@ export const SidebarFavoritesMenu = observer(function SidebarFavoritesMenu() {
                   : "aria_labels.projects_sidebar.open_favorites_menu"
               )}
             >
-              <ChevronRightIcon
+              <ChevronRightOutline
                 className={cn("size-3 flex-shrink-0 transition-all", {
                   "rotate-90": isFavoriteMenuOpen,
                 })}
diff --git a/apps/web/core/components/workspace/sidebar/help-section/root.tsx b/apps/web/core/components/workspace/sidebar/help-section/root.tsx
index d19b8602d3b..6b23af1b2f4 100644
--- a/apps/web/core/components/workspace/sidebar/help-section/root.tsx
+++ b/apps/web/core/components/workspace/sidebar/help-section/root.tsx
@@ -6,9 +6,8 @@
 
 import React, { useState } from "react";
 import { observer } from "mobx-react";
-import { HelpCircle, User } from "lucide-react";
+import { HelpOutline, PagesOutline, UserOutline } from "@makeplane/propel/icons";
 import { useTranslation } from "@plane/i18n";
-import { PageIcon } from "@plane/propel/icons";
 // ui
 import { CustomMenu } from "@plane/ui";
 // components
@@ -35,7 +34,7 @@ export const HelpMenuRoot = observer(function HelpMenuRoot() {
           <AppSidebarItem
             variant="button"
             item={{
-              icon: <HelpCircle className="size-5" />,
+              icon: <HelpOutline className="size-5" />,
               isActive: isNeedHelpOpen,
             }}
           />
@@ -49,13 +48,13 @@ export const HelpMenuRoot = observer(function HelpMenuRoot() {
       >
         <CustomMenu.MenuItem onClick={() => window.open("https://go.plane.so/p-docs", "_blank")}>
           <div className="flex items-center gap-x-2 rounded-sm text-11">
-            <PageIcon className="h-3.5 w-3.5 text-secondary" height={14} width={14} />
+            <PagesOutline className="h-3.5 w-3.5 text-secondary" height={14} width={14} />
             <span className="text-11">{t("documentation")}</span>
           </div>
         </CustomMenu.MenuItem>
         <CustomMenu.MenuItem onClick={() => window.open("mailto:sales@plane.so", "_blank")}>
           <div className="flex items-center gap-x-2 rounded-sm text-11">
-            <User className="h-3.5 w-3.5 text-secondary" size={14} />
+            <UserOutline className="h-3.5 w-3.5 text-secondary" width={14} height={14} />
             <span className="text-11">{t("contact_sales")}</span>
           </div>
         </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/workspace/sidebar/helper.tsx b/apps/web/core/components/workspace/sidebar/helper.tsx
index 9bf4a01bf22..0e8fae6b480 100644
--- a/apps/web/core/components/workspace/sidebar/helper.tsx
+++ b/apps/web/core/components/workspace/sidebar/helper.tsx
@@ -5,40 +5,40 @@
  */
 
 import {
-  AnalyticsIcon,
-  ArchiveIcon,
-  CycleIcon,
-  DraftIcon,
-  HomeIcon,
-  InboxIcon,
-  MultipleStickyIcon,
-  ProjectIcon,
-  ViewsIcon,
-  YourWorkIcon,
-} from "@plane/propel/icons";
+  AnalyticsOutline,
+  ArchiveOutline,
+  CyclesOutline,
+  DraftsOutline,
+  HomeOutline,
+  InboxOutline,
+  MultipleStickyOutline,
+  ProjectsOutline,
+  ViewsOutline,
+  YourWorkOutline,
+} from "@makeplane/propel/icons";
 import { cn } from "@plane/utils";
 
 export const getSidebarNavigationItemIcon = (key: string, className: string = "") => {
   switch (key) {
     case "home":
-      return <HomeIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <HomeOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "inbox":
-      return <InboxIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <InboxOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "projects":
-      return <ProjectIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <ProjectsOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "views":
-      return <ViewsIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <ViewsOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "active_cycles":
-      return <CycleIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <CyclesOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "analytics":
-      return <AnalyticsIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <AnalyticsOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "your_work":
-      return <YourWorkIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <YourWorkOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "drafts":
-      return <DraftIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <DraftsOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "archives":
-      return <ArchiveIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <ArchiveOutline className={cn("size-4 flex-shrink-0", className)} />;
     case "stickies":
-      return <MultipleStickyIcon className={cn("size-4 flex-shrink-0", className)} />;
+      return <MultipleStickyOutline className={cn("size-4 flex-shrink-0", className)} />;
   }
 };
diff --git a/apps/web/core/components/workspace/sidebar/project-navigation.tsx b/apps/web/core/components/workspace/sidebar/project-navigation.tsx
index 3582215f3bd..e7dfc7392b2 100644
--- a/apps/web/core/components/workspace/sidebar/project-navigation.tsx
+++ b/apps/web/core/components/workspace/sidebar/project-navigation.tsx
@@ -10,7 +10,14 @@ import Link from "next/link";
 import { useParams, usePathname } from "next/navigation";
 import { EUserPermissionsLevel, EUserPermissions } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { CycleIcon, IntakeIcon, ModuleIcon, PageIcon, ViewsIcon, WorkItemsIcon } from "@plane/propel/icons";
+import {
+  CyclesOutline,
+  IntakeOutline,
+  ModuleOutline,
+  PagesOutline,
+  ViewsOutline,
+  WorkItemsOutline,
+} from "@makeplane/propel/icons";
 import type { EUserProjectRoles } from "@plane/types";
 // plane ui
 // components
@@ -75,7 +82,7 @@ export const ProjectNavigation = observer(function ProjectNavigation(props: TPro
         key: "work_items",
         name: "Work items",
         href: `/${workspaceSlug}/projects/${projectId}/issues`,
-        icon: WorkItemsIcon,
+        icon: WorkItemsOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: true,
         sortOrder: 1,
@@ -85,7 +92,7 @@ export const ProjectNavigation = observer(function ProjectNavigation(props: TPro
         key: "cycles",
         name: "Cycles",
         href: `/${workspaceSlug}/projects/${projectId}/cycles`,
-        icon: CycleIcon,
+        icon: CyclesOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
         shouldRender: project?.cycle_view ?? false,
         sortOrder: 2,
@@ -95,7 +102,7 @@ export const ProjectNavigation = observer(function ProjectNavigation(props: TPro
         key: "modules",
         name: "Modules",
         href: `/${workspaceSlug}/projects/${projectId}/modules`,
-        icon: ModuleIcon,
+        icon: ModuleOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER],
         shouldRender: project?.module_view ?? false,
         sortOrder: 3,
@@ -105,7 +112,7 @@ export const ProjectNavigation = observer(function ProjectNavigation(props: TPro
         key: "views",
         name: "Views",
         href: `/${workspaceSlug}/projects/${projectId}/views`,
-        icon: ViewsIcon,
+        icon: ViewsOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: project?.issue_views_view ?? false,
         sortOrder: 4,
@@ -115,7 +122,7 @@ export const ProjectNavigation = observer(function ProjectNavigation(props: TPro
         key: "pages",
         name: "Pages",
         href: `/${workspaceSlug}/projects/${projectId}/pages`,
-        icon: PageIcon,
+        icon: PagesOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: project?.page_view ?? false,
         sortOrder: 5,
@@ -125,7 +132,7 @@ export const ProjectNavigation = observer(function ProjectNavigation(props: TPro
         key: "intake",
         name: "Intake",
         href: `/${workspaceSlug}/projects/${projectId}/intake`,
-        icon: IntakeIcon,
+        icon: IntakeOutline,
         access: [EUserPermissions.ADMIN, EUserPermissions.MEMBER, EUserPermissions.GUEST],
         shouldRender: project?.inbox_view ?? false,
         sortOrder: 6,
diff --git a/apps/web/core/components/workspace/sidebar/projects-list-item.tsx b/apps/web/core/components/workspace/sidebar/projects-list-item.tsx
index e043629b2fa..9d0fa86c042 100644
--- a/apps/web/core/components/workspace/sidebar/projects-list-item.tsx
+++ b/apps/web/core/components/workspace/sidebar/projects-list-item.tsx
@@ -14,14 +14,21 @@ import { observer } from "mobx-react";
 import { useParams, useRouter } from "next/navigation";
 import { createRoot } from "react-dom/client";
 import scrollIntoView from "smooth-scroll-into-view-if-needed";
-import { Settings, Share2, LogOut, MoreHorizontal } from "lucide-react";
+import {
+  ArchiveOutline,
+  ChevronRightOutline,
+  LinkOutline,
+  LogOutOutline,
+  MoreHorizontalOutline,
+  SettingsOutline,
+  ShareAltOutline,
+} from "@makeplane/propel/icons";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useOutsideClickDetector } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import { LinkIcon, ArchiveIcon, ChevronRightIcon } from "@plane/propel/icons";
 import { IconButton } from "@plane/propel/icon-button";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
 import { CustomMenu, DropIndicator, DragHandle, ControlLink } from "@plane/ui";
@@ -356,7 +363,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
                       ref={actionSectionRef}
                       variant="ghost"
                       size="sm"
-                      icon={MoreHorizontal}
+                      icon={MoreHorizontalOutline}
                       onClick={() => setIsMenuActive(!isMenuActive)}
                       className="text-placeholder"
                     />
@@ -395,7 +402,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
                     <CustomMenu.MenuItem onClick={() => setPublishModal(true)}>
                       <div className="relative flex flex-shrink-0 items-center justify-start gap-2">
                         <div className="flex h-4 w-4 cursor-pointer items-center justify-center rounded-sm text-secondary transition-all duration-300 hover:bg-layer-1">
-                          <Share2 className="h-3.5 w-3.5 stroke-[1.5]" />
+                          <ShareAltOutline className="h-3.5 w-3.5 stroke-[1.5]" />
                         </div>
                         <div>{t("publish_project")}</div>
                       </div>
@@ -403,7 +410,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
                   )}
                   <CustomMenu.MenuItem onClick={handleCopyText}>
                     <span className="flex items-center justify-start gap-2">
-                      <LinkIcon className="h-3.5 w-3.5 stroke-[1.5]" />
+                      <LinkOutline className="h-3.5 w-3.5 stroke-[1.5]" />
                       <span>{t("copy_link")}</span>
                     </span>
                   </CustomMenu.MenuItem>
@@ -414,7 +421,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
                       }}
                     >
                       <div className="flex cursor-pointer items-center justify-start gap-2">
-                        <ArchiveIcon className="h-3.5 w-3.5 stroke-[1.5]" />
+                        <ArchiveOutline className="h-3.5 w-3.5 stroke-[1.5]" />
                         <span>{t("archives")}</span>
                       </div>
                     </CustomMenu.MenuItem>
@@ -425,7 +432,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
                     }}
                   >
                     <div className="flex cursor-pointer items-center justify-start gap-2">
-                      <Settings className="h-3.5 w-3.5 stroke-[1.5]" />
+                      <SettingsOutline className="h-3.5 w-3.5 stroke-[1.5]" />
                       <span>{t("settings")}</span>
                     </div>
                   </CustomMenu.MenuItem>
@@ -433,7 +440,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
                   {!isAuthorized && (
                     <CustomMenu.MenuItem onClick={handleLeaveProject}>
                       <div className="flex items-center justify-start gap-2">
-                        <LogOut className="h-3.5 w-3.5 stroke-[1.5]" />
+                        <LogOutOutline className="h-3.5 w-3.5 stroke-[1.5]" />
                         <span>{t("leave_project")}</span>
                       </div>
                     </CustomMenu.MenuItem>
@@ -443,7 +450,7 @@ export const SidebarProjectsListItem = observer(function SidebarProjectsListItem
                   <IconButton
                     variant="ghost"
                     size="sm"
-                    icon={ChevronRightIcon}
+                    icon={ChevronRightOutline}
                     onClick={() => setIsProjectListOpen(!isProjectListOpen)}
                     className={cn("hidden text-placeholder group-hover/project-item:inline-flex", {
                       "inline-flex": isMenuActive,
diff --git a/apps/web/core/components/workspace/sidebar/projects-list.tsx b/apps/web/core/components/workspace/sidebar/projects-list.tsx
index d1eb0ad4134..4f96a2a5b2e 100644
--- a/apps/web/core/components/workspace/sidebar/projects-list.tsx
+++ b/apps/web/core/components/workspace/sidebar/projects-list.tsx
@@ -9,12 +9,11 @@ import { combine } from "@atlaskit/pragmatic-drag-and-drop/combine";
 import { autoScrollForElements } from "@atlaskit/pragmatic-drag-and-drop-auto-scroll/element";
 import { observer } from "mobx-react";
 import { useParams, usePathname } from "next/navigation";
-import { Ellipsis } from "lucide-react";
+import { AddOutline, ChevronRightOutline, MoreHorizontalOutline } from "@makeplane/propel/icons";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { PlusIcon, ChevronRightIcon } from "@plane/propel/icons";
 import { IconButton } from "@plane/propel/icon-button";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@makeplane/propel/components/tooltip";
@@ -191,7 +190,7 @@ export const SidebarProjectsList = observer(function SidebarProjectsList() {
                     <IconButton
                       variant="ghost"
                       size="sm"
-                      icon={PlusIcon}
+                      icon={AddOutline}
                       onClick={() => {
                         setIsProjectModalOpen(true);
                       }}
@@ -203,7 +202,7 @@ export const SidebarProjectsList = observer(function SidebarProjectsList() {
                 <IconButton
                   variant="ghost"
                   size="sm"
-                  icon={ChevronRightIcon}
+                  icon={ChevronRightOutline}
                   onClick={() => toggleListDisclosure(!isAllProjectsListOpen)}
                   className="text-placeholder"
                   iconClassName={cn("transition-transform", {
@@ -262,7 +261,7 @@ export const SidebarProjectsList = observer(function SidebarProjectsList() {
                               : "aria_labels.app_sidebar.open_extended_sidebar"
                           )}
                         >
-                          <Ellipsis className="size-4 flex-shrink-0" />
+                          <MoreHorizontalOutline className="size-4 flex-shrink-0" />
                           <span>{isExtendedProjectSidebarOpened ? "Hide" : "More"}</span>
                         </button>
                       </SidebarNavItem>
diff --git a/apps/web/core/components/workspace/sidebar/quick-actions.tsx b/apps/web/core/components/workspace/sidebar/quick-actions.tsx
index f1d6bd80ae5..2142c62bc24 100644
--- a/apps/web/core/components/workspace/sidebar/quick-actions.tsx
+++ b/apps/web/core/components/workspace/sidebar/quick-actions.tsx
@@ -10,7 +10,7 @@ import { useParams } from "next/navigation";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { AddWorkItemIcon } from "@plane/propel/icons";
+import { AddWorkItemOutline } from "@makeplane/propel/icons";
 import type { TIssue } from "@plane/types";
 // components
 import { CreateUpdateIssueModal } from "@/components/issues/issue-modal/modal";
@@ -81,7 +81,7 @@ export const SidebarQuickActions = observer(function SidebarQuickActions() {
         <SidebarAddButton
           label={
             <>
-              <AddWorkItemIcon className="size-4" />
+              <AddWorkItemOutline className="size-4" />
               <span className="max-w-[145px] truncate text-13 font-medium">{t("sidebar.new_work_item")}</span>
             </>
           }
diff --git a/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx b/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx
index ec452517aa6..d70f84d911c 100644
--- a/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx
+++ b/apps/web/core/components/workspace/sidebar/sidebar-menu-items.tsx
@@ -6,7 +6,7 @@
 
 import React, { useMemo } from "react";
 import { observer } from "mobx-react";
-import { Ellipsis } from "lucide-react";
+import { ChevronRightOutline, MoreHorizontalOutline } from "@makeplane/propel/icons";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
 import {
@@ -16,7 +16,6 @@ import {
   WORKSPACE_SIDEBAR_STATIC_PINNED_NAVIGATION_ITEMS_LINKS,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ChevronRightIcon } from "@plane/propel/icons";
 import { cn } from "@plane/utils";
 // components
 import { SidebarNavItem } from "@/components/sidebar/sidebar-navigation";
@@ -129,7 +128,7 @@ export const SidebarMenuItems = observer(function SidebarMenuItems() {
                   : "aria_labels.app_sidebar.open_workspace_menu"
               )}
             >
-              <ChevronRightIcon
+              <ChevronRightOutline
                 className={cn("size-3 flex-shrink-0 transition-all", {
                   "rotate-90": isWorkspaceMenuOpen,
                 })}
@@ -170,7 +169,7 @@ export const SidebarMenuItems = observer(function SidebarMenuItems() {
                         : "aria_labels.app_sidebar.open_extended_sidebar"
                     )}
                   >
-                    <Ellipsis className="size-4 flex-shrink-0" />
+                    <MoreHorizontalOutline className="size-4 flex-shrink-0" />
                     <span>{isExtendedSidebarOpened ? "Hide" : "More"}</span>
                   </button>
                 </SidebarNavItem>
diff --git a/apps/web/core/components/workspace/sidebar/user-menu-root.tsx b/apps/web/core/components/workspace/sidebar/user-menu-root.tsx
index d47cbba041c..95b78f56ec6 100644
--- a/apps/web/core/components/workspace/sidebar/user-menu-root.tsx
+++ b/apps/web/core/components/workspace/sidebar/user-menu-root.tsx
@@ -7,7 +7,7 @@
 import { useState, useEffect } from "react";
 import { observer } from "mobx-react";
 import { useRouter } from "next/navigation";
-import { LogOut, Settings, Settings2 } from "lucide-react";
+import { LogOutOutline, SettingsOutline } from "@makeplane/propel/icons";
 // plane imports
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { GOD_MODE_URL } from "@plane/constants";
@@ -117,7 +117,7 @@ export const UserMenuRoot = observer(function UserMenuRoot() {
           }
           className="flex items-center gap-2"
         >
-          <Settings className="size-3.5 shrink-0" />
+          <SettingsOutline className="size-3.5 shrink-0" />
           {t("settings")}
         </CustomMenu.MenuItem>
         <CustomMenu.MenuItem
@@ -129,12 +129,12 @@ export const UserMenuRoot = observer(function UserMenuRoot() {
           }
           className="flex items-center gap-2"
         >
-          <Settings2 className="size-3.5 shrink-0" />
+          <SettingsOutline className="size-3.5 shrink-0" />
           {t("preferences")}
         </CustomMenu.MenuItem>
       </div>
       <CustomMenu.MenuItem onClick={handleSignOut} className="flex items-center gap-2">
-        <LogOut className="size-3.5 shrink-0" />
+        <LogOutOutline className="size-3.5 shrink-0" />
         {t("sign_out")}
       </CustomMenu.MenuItem>
       {isUserInstanceAdmin && (
diff --git a/apps/web/core/components/workspace/sidebar/user-menu.tsx b/apps/web/core/components/workspace/sidebar/user-menu.tsx
index f4f7b4ad367..a7835fc74c9 100644
--- a/apps/web/core/components/workspace/sidebar/user-menu.tsx
+++ b/apps/web/core/components/workspace/sidebar/user-menu.tsx
@@ -8,7 +8,8 @@ import React from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
-import { DraftIcon, HomeIcon, PiChatLogo, YourWorkIcon, DashboardIcon } from "@plane/propel/icons";
+import { PiChatLogo } from "@plane/propel/icons";
+import { DashboardsOutline, DraftsOutline, HomeOutline, YourWorkOutline } from "@makeplane/propel/icons";
 import { EUserWorkspaceRoles } from "@plane/types";
 // hooks
 import { useUserPermissions, useUser } from "@/hooks/store/user";
@@ -28,28 +29,28 @@ export const SidebarUserMenu = observer(function SidebarUserMenu() {
       labelTranslationKey: "sidebar.home",
       href: `/${workspaceSlug.toString()}/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER, EUserWorkspaceRoles.GUEST],
-      Icon: HomeIcon,
+      Icon: HomeOutline,
     },
     {
       key: "dashboards",
       labelTranslationKey: "workspace_dashboards",
       href: `/${workspaceSlug.toString()}/dashboards/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER],
-      Icon: DashboardIcon,
+      Icon: DashboardsOutline,
     },
     {
       key: "your-work",
       labelTranslationKey: "sidebar.your_work",
       href: `/${workspaceSlug.toString()}/profile/${currentUser?.id}/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER],
-      Icon: YourWorkIcon,
+      Icon: YourWorkOutline,
     },
     {
       key: "drafts",
       labelTranslationKey: "sidebar.drafts",
       href: `/${workspaceSlug.toString()}/drafts/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER],
-      Icon: DraftIcon,
+      Icon: DraftsOutline,
     },
     {
       key: "pi-chat",
diff --git a/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx b/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx
index 00a1c2c3822..57bb83afd5b 100644
--- a/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx
+++ b/apps/web/core/components/workspace/sidebar/workspace-menu-header.tsx
@@ -7,13 +7,12 @@
 import { useState, useRef } from "react";
 import { observer } from "mobx-react";
 import { useParams, useRouter } from "next/navigation";
-import { MoreHorizontal, ArchiveIcon, Settings } from "lucide-react";
+import { ArchiveOutline, ChevronRightOutline, MoreHorizontalOutline, SettingsOutline } from "@makeplane/propel/icons";
 import { Disclosure } from "@headlessui/react";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useOutsideClickDetector } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
-import { ChevronRightIcon } from "@plane/propel/icons";
 import { EUserWorkspaceRoles } from "@plane/types";
 import { CustomMenu } from "@plane/ui";
 import { cn } from "@plane/utils";
@@ -63,7 +62,7 @@ export const SidebarWorkspaceMenuHeader = observer(function SidebarWorkspaceMenu
               setIsMenuActive(!isMenuActive);
             }}
           >
-            <MoreHorizontal className="size-4" />
+            <MoreHorizontalOutline className="size-4" />
           </span>
         }
         className={cn(
@@ -77,7 +76,7 @@ export const SidebarWorkspaceMenuHeader = observer(function SidebarWorkspaceMenu
       >
         <CustomMenu.MenuItem onClick={() => router.push(`/${workspaceSlug}/projects/archives`)}>
           <div className="flex items-center justify-start gap-2">
-            <ArchiveIcon className="h-3.5 w-3.5 stroke-[1.5]" />
+            <ArchiveOutline className="h-3.5 w-3.5 stroke-[1.5]" />
             <span>{t("archives")}</span>
           </div>
         </CustomMenu.MenuItem>
@@ -85,7 +84,7 @@ export const SidebarWorkspaceMenuHeader = observer(function SidebarWorkspaceMenu
         {isAdmin && (
           <CustomMenu.MenuItem onClick={() => router.push(`/${workspaceSlug}/settings`)}>
             <div className="flex items-center justify-start gap-2">
-              <Settings className="h-3.5 w-3.5 stroke-[1.5]" />
+              <SettingsOutline className="h-3.5 w-3.5 stroke-[1.5]" />
               <span>{t("settings")}</span>
             </div>
           </CustomMenu.MenuItem>
@@ -98,7 +97,7 @@ export const SidebarWorkspaceMenuHeader = observer(function SidebarWorkspaceMenu
       >
         {" "}
         <span className="pointer-events-none flex-shrink-0 rounded-sm opacity-0 group-hover/workspace-button:pointer-events-auto group-hover/workspace-button:opacity-100 hover:bg-layer-1">
-          <ChevronRightIcon
+          <ChevronRightOutline
             className={cn("size-4 flex-shrink-0 text-placeholder transition-transform", {
               "rotate-90": isWorkspaceMenuOpen,
             })}
diff --git a/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx b/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx
index e1e447dbe46..be082f40c58 100644
--- a/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx
+++ b/apps/web/core/components/workspace/sidebar/workspace-menu-root.tsx
@@ -8,12 +8,11 @@ import { Fragment, useState, useEffect } from "react";
 import { observer } from "mobx-react";
 import Link from "next/link";
 // icons
-import { CirclePlus, LogOut, Mails } from "lucide-react";
+import { ChevronDownOutline, LogOutOutline, MailOutline, PlusCircleOutline } from "@makeplane/propel/icons";
 // ui
 import { Menu, Transition } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { ChevronDownIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { IWorkspace } from "@plane/types";
 import { Loader } from "@plane/ui";
@@ -128,7 +127,7 @@ export const WorkspaceMenuRoot = observer(function WorkspaceMenuRoot(props: Work
                   />
                   <h4 className="truncate text-14 font-medium text-primary">{activeWorkspace?.name ?? t("loading")}</h4>
                 </div>
-                <ChevronDownIcon
+                <ChevronDownOutline
                   className={cn("size-4 flex-shrink-0 text-placeholder duration-300", {
                     "rotate-180": open,
                   })}
@@ -193,7 +192,7 @@ export const WorkspaceMenuRoot = observer(function WorkspaceMenuRoot(props: Work
                           as="div"
                           className="flex items-center gap-2 rounded-sm px-2 py-1 text-13 font-medium text-secondary hover:bg-layer-transparent-hover"
                         >
-                          <CirclePlus className="size-4 flex-shrink-0" />
+                          <PlusCircleOutline className="size-4 flex-shrink-0" />
                           {t("create_workspace")}
                         </Menu.Item>
                       </Link>
@@ -204,7 +203,7 @@ export const WorkspaceMenuRoot = observer(function WorkspaceMenuRoot(props: Work
                         as="div"
                         className="flex items-center gap-2 rounded-sm px-2 py-1 text-13 font-medium text-secondary hover:bg-layer-transparent-hover"
                       >
-                        <Mails className="h-4 w-4 flex-shrink-0" />
+                        <MailOutline className="h-4 w-4 flex-shrink-0" />
                         {t("workspace_invites")}
                       </Menu.Item>
                     </Link>
@@ -216,7 +215,7 @@ export const WorkspaceMenuRoot = observer(function WorkspaceMenuRoot(props: Work
                         className="flex w-full items-center gap-2 rounded-sm px-2 py-1 text-13 font-medium text-danger-primary hover:bg-layer-transparent-hover"
                         onClick={handleSignOut}
                       >
-                        <LogOut className="size-4 flex-shrink-0" />
+                        <LogOutOutline className="size-4 flex-shrink-0" />
                         {t("sign_out")}
                       </Menu.Item>
                     </div>
diff --git a/apps/web/core/components/workspace/sidebar/workspace-menu.tsx b/apps/web/core/components/workspace/sidebar/workspace-menu.tsx
index 0861878c902..fa003ae4ff6 100644
--- a/apps/web/core/components/workspace/sidebar/workspace-menu.tsx
+++ b/apps/web/core/components/workspace/sidebar/workspace-menu.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { Disclosure, Transition } from "@headlessui/react";
 // plane imports
-import { AnalyticsIcon, CycleIcon, ProjectIcon, ViewsIcon } from "@plane/propel/icons";
+import { AnalyticsOutline, CyclesOutline, ProjectsOutline, ViewsOutline } from "@makeplane/propel/icons";
 import { EUserWorkspaceRoles } from "@plane/types";
 // hooks
 import useLocalStorage from "@/hooks/use-local-storage";
@@ -31,28 +31,28 @@ export const SidebarWorkspaceMenu = observer(function SidebarWorkspaceMenu() {
       labelTranslationKey: "sidebar.projects",
       href: `/${workspaceSlug}/projects/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER, EUserWorkspaceRoles.GUEST],
-      Icon: ProjectIcon,
+      Icon: ProjectsOutline,
     },
     {
       key: "views",
       labelTranslationKey: "sidebar.views",
       href: `/${workspaceSlug}/workspace-views/all-issues/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER, EUserWorkspaceRoles.GUEST],
-      Icon: ViewsIcon,
+      Icon: ViewsOutline,
     },
     {
       key: "active-cycles",
       labelTranslationKey: "sidebar.cycles",
       href: `/${workspaceSlug}/active-cycles/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER],
-      Icon: CycleIcon,
+      Icon: CyclesOutline,
     },
     {
       key: "analytics",
       labelTranslationKey: "sidebar.analytics",
       href: `/${workspaceSlug}/analytics/`,
       access: [EUserWorkspaceRoles.ADMIN, EUserWorkspaceRoles.MEMBER],
-      Icon: AnalyticsIcon,
+      Icon: AnalyticsOutline,
     },
   ];
 
diff --git a/apps/web/core/components/workspace/views/default-view-quick-action.tsx b/apps/web/core/components/workspace/views/default-view-quick-action.tsx
index a37744dbfed..732134b510b 100644
--- a/apps/web/core/components/workspace/views/default-view-quick-action.tsx
+++ b/apps/web/core/components/workspace/views/default-view-quick-action.tsx
@@ -8,7 +8,7 @@ import { observer } from "mobx-react";
 
 import { useTranslation } from "@plane/i18n";
 // plane imports
-import { LinkIcon, NewTabIcon } from "@plane/propel/icons";
+import { LinkOutline, NewTabOutline } from "@makeplane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 // ui
 import type { TStaticViewTypes } from "@plane/types";
@@ -45,13 +45,13 @@ export const DefaultWorkspaceViewQuickActions = observer(function DefaultWorkspa
       key: "open-new-tab",
       action: handleOpenInNewTab,
       title: t("open_in_new_tab"),
-      icon: NewTabIcon,
+      icon: NewTabOutline,
     },
     {
       key: "copy-link",
       action: handleCopyText,
       title: t("copy_link"),
-      icon: LinkIcon,
+      icon: LinkOutline,
     },
   ];
 
diff --git a/apps/web/core/components/workspace/views/header.tsx b/apps/web/core/components/workspace/views/header.tsx
index 056dcceda8e..0ad9effc026 100644
--- a/apps/web/core/components/workspace/views/header.tsx
+++ b/apps/web/core/components/workspace/views/header.tsx
@@ -10,7 +10,7 @@ import { useParams } from "next/navigation";
 
 // plane imports
 import { DEFAULT_GLOBAL_VIEWS_LIST, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
-import { PlusIcon } from "@plane/propel/icons";
+import { AddOutline } from "@makeplane/propel/icons";
 import type { TStaticViewTypes } from "@plane/types";
 import { Header, EHeaderVariant } from "@plane/ui";
 // hooks
@@ -111,7 +111,7 @@ export const GlobalViewsHeader = observer(function GlobalViewsHeader() {
           className="sticky -right-4 flex flex-shrink-0 items-center justify-center border-transparent bg-surface-1 py-3 hover:border-subtle hover:text-placeholder"
           onClick={() => setCreateViewModal(true)}
         >
-          <PlusIcon className="h-4 w-4 text-accent-secondary" />
+          <AddOutline className="h-4 w-4 text-accent-secondary" />
         </button>
       ) : (
         <></>
diff --git a/apps/web/core/components/workspace/views/view-list-item.tsx b/apps/web/core/components/workspace/views/view-list-item.tsx
index 8c71a05bf30..f30956a31df 100644
--- a/apps/web/core/components/workspace/views/view-list-item.tsx
+++ b/apps/web/core/components/workspace/views/view-list-item.tsx
@@ -9,7 +9,7 @@ import { observer } from "mobx-react";
 import Link from "next/link";
 import { useParams } from "next/navigation";
 // plane imports
-import { EditIcon, TrashIcon } from "@plane/propel/icons";
+import { DeleteOutline, EditOutline } from "@makeplane/propel/icons";
 import { CustomMenu } from "@plane/ui";
 import { truncateText } from "@plane/utils";
 // hooks
@@ -57,7 +57,7 @@ export const GlobalViewListItem = observer(function GlobalViewListItem(props: Pr
                       }}
                     >
                       <span className="flex items-center justify-start gap-2">
-                        <EditIcon width={14} height={14} strokeWidth={2} />
+                        <EditOutline width={14} height={14} />
                         <span>Edit View</span>
                       </span>
                     </CustomMenu.MenuItem>
@@ -67,7 +67,7 @@ export const GlobalViewListItem = observer(function GlobalViewListItem(props: Pr
                       }}
                     >
                       <span className="flex items-center justify-start gap-2">
-                        <TrashIcon width={14} height={14} strokeWidth={2} />
+                        <DeleteOutline width={14} height={14} />
                         <span>Delete View</span>
                       </span>
                     </CustomMenu.MenuItem>
diff --git a/apps/web/core/hooks/work-item-filters/use-work-item-filters-config.tsx b/apps/web/core/hooks/work-item-filters/use-work-item-filters-config.tsx
index c9e0bce8671..6a6bb189764 100644
--- a/apps/web/core/hooks/work-item-filters/use-work-item-filters-config.tsx
+++ b/apps/web/core/hooks/work-item-filters/use-work-item-filters-config.tsx
@@ -5,25 +5,24 @@
  */
 
 import { useCallback, useMemo } from "react";
-import { AtSign, Briefcase } from "lucide-react";
+import {
+  AtOutline,
+  CalendarOutline,
+  CyclesOutline,
+  DueDateOutline,
+  LabelsOutline,
+  MembersOutline,
+  ModuleOutline,
+  PriorityOutline,
+  ProjectsOutline,
+  StartDateOutline,
+  StateOutline,
+  UserOutline,
+} from "@makeplane/propel/icons";
 // plane imports
 import { Avatar } from "@makeplane/propel/components/avatar";
 import { Logo } from "@plane/propel/emoji-icon-picker";
-import {
-  CalendarLayoutIcon,
-  CycleGroupIcon,
-  CycleIcon,
-  ModuleIcon,
-  StatePropertyIcon,
-  PriorityIcon,
-  StateGroupIcon,
-  MembersPropertyIcon,
-  LabelPropertyIcon,
-  StartDatePropertyIcon,
-  DueDatePropertyIcon,
-  UserCirclePropertyIcon,
-  PriorityPropertyIcon,
-} from "@plane/propel/icons";
+import { CycleGroupIcon, PriorityIcon, StateGroupIcon } from "@plane/propel/icons";
 import type {
   ICycle,
   IState,
@@ -153,7 +152,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getStateGroupFilterConfig<TWorkItemFilterProperty>("state_group")({
         isEnabled: isFilterEnabled("state_group"),
-        filterIcon: StatePropertyIcon,
+        filterIcon: StateOutline,
         getOptionIcon: (stateGroupKey) => <StateGroupIcon stateGroup={stateGroupKey} />,
         ...operatorConfigs,
       }),
@@ -165,7 +164,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getStateFilterConfig<TWorkItemFilterProperty>("state_id")({
         isEnabled: isFilterEnabled("state_id") && workItemStates !== undefined,
-        filterIcon: StatePropertyIcon,
+        filterIcon: StateOutline,
         getOptionIcon: (state) => <StateGroupIcon stateGroup={state.group} color={state.color} />,
         states: workItemStates ?? [],
         ...operatorConfigs,
@@ -178,7 +177,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getLabelFilterConfig<TWorkItemFilterProperty>("label_id")({
         isEnabled: isFilterEnabled("label_id") && workItemLabels !== undefined,
-        filterIcon: LabelPropertyIcon,
+        filterIcon: LabelsOutline,
         labels: workItemLabels ?? [],
         getOptionIcon: (color) => (
           <span className="flex size-2.5 flex-shrink-0 rounded-full" style={{ backgroundColor: color }} />
@@ -193,7 +192,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getCycleFilterConfig<TWorkItemFilterProperty>("cycle_id")({
         isEnabled: isFilterEnabled("cycle_id") && project?.cycle_view === true && cycles !== undefined,
-        filterIcon: CycleIcon,
+        filterIcon: CyclesOutline,
         getOptionIcon: (cycleGroup) => <CycleGroupIcon cycleGroup={cycleGroup} className="h-3.5 w-3.5 flex-shrink-0" />,
         cycles: cycles ?? [],
         ...operatorConfigs,
@@ -206,8 +205,8 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getModuleFilterConfig<TWorkItemFilterProperty>("module_id")({
         isEnabled: isFilterEnabled("module_id") && project?.module_view === true && modules !== undefined,
-        filterIcon: ModuleIcon,
-        getOptionIcon: () => <ModuleIcon className="h-3 w-3 flex-shrink-0" />,
+        filterIcon: ModuleOutline,
+        getOptionIcon: () => <ModuleOutline className="h-3 w-3 flex-shrink-0" />,
         modules: modules ?? [],
         ...operatorConfigs,
       }),
@@ -219,7 +218,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getAssigneeFilterConfig<TWorkItemFilterProperty>("assignee_id")({
         isEnabled: isFilterEnabled("assignee_id") && members !== undefined,
-        filterIcon: MembersPropertyIcon,
+        filterIcon: MembersOutline,
         members: members ?? [],
         getOptionIcon: (memberDetails) => (
           <Avatar
@@ -239,7 +238,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getMentionFilterConfig<TWorkItemFilterProperty>("mention_id")({
         isEnabled: isFilterEnabled("mention_id") && members !== undefined,
-        filterIcon: AtSign,
+        filterIcon: AtOutline,
         members: members ?? [],
         getOptionIcon: (memberDetails) => (
           <Avatar
@@ -259,7 +258,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getCreatedByFilterConfig<TWorkItemFilterProperty>("created_by_id")({
         isEnabled: isFilterEnabled("created_by_id") && members !== undefined,
-        filterIcon: UserCirclePropertyIcon,
+        filterIcon: UserOutline,
         members: members ?? [],
         getOptionIcon: (memberDetails) => (
           <Avatar
@@ -279,7 +278,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getSubscriberFilterConfig<TWorkItemFilterProperty>("subscriber_id")({
         isEnabled: isFilterEnabled("subscriber_id") && members !== undefined,
-        filterIcon: MembersPropertyIcon,
+        filterIcon: MembersOutline,
         members: members ?? [],
         getOptionIcon: (memberDetails) => (
           <Avatar
@@ -299,7 +298,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getPriorityFilterConfig<TWorkItemFilterProperty>("priority")({
         isEnabled: isFilterEnabled("priority"),
-        filterIcon: PriorityPropertyIcon,
+        filterIcon: PriorityOutline,
         getOptionIcon: (priority) => <PriorityIcon priority={priority} />,
         ...operatorConfigs,
       }),
@@ -311,7 +310,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getStartDateFilterConfig<TWorkItemFilterProperty>("start_date")({
         isEnabled: true,
-        filterIcon: StartDatePropertyIcon,
+        filterIcon: StartDateOutline,
         ...operatorConfigs,
       }),
     [operatorConfigs]
@@ -322,7 +321,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getTargetDateFilterConfig<TWorkItemFilterProperty>("target_date")({
         isEnabled: true,
-        filterIcon: DueDatePropertyIcon,
+        filterIcon: DueDateOutline,
         ...operatorConfigs,
       }),
     [operatorConfigs]
@@ -333,7 +332,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getCreatedAtFilterConfig<TWorkItemFilterProperty>("created_at")({
         isEnabled: true,
-        filterIcon: CalendarLayoutIcon,
+        filterIcon: CalendarOutline,
         ...operatorConfigs,
       }),
     [operatorConfigs]
@@ -344,7 +343,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getUpdatedAtFilterConfig<TWorkItemFilterProperty>("updated_at")({
         isEnabled: true,
-        filterIcon: CalendarLayoutIcon,
+        filterIcon: CalendarOutline,
         ...operatorConfigs,
       }),
     [operatorConfigs]
@@ -355,7 +354,7 @@ export const useWorkItemFiltersConfig = (props: TUseWorkItemFiltersConfigProps):
     () =>
       getProjectFilterConfig<TWorkItemFilterProperty>("project_id")({
         isEnabled: isFilterEnabled("project_id") && projects !== undefined,
-        filterIcon: Briefcase,
+        filterIcon: ProjectsOutline,
         projects: projects,
         getOptionIcon: (project) => <Logo logo={project.logo_props} size={12} />,
         ...operatorConfigs,
diff --git a/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx b/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx
index ac167d232e5..c730c1ceb18 100644
--- a/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx
+++ b/apps/web/core/layouts/auth-layout/workspace-wrapper.tsx
@@ -10,7 +10,7 @@ import Link from "next/link";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
 // ui
-import { LogOut } from "lucide-react";
+import { LogOutOutline } from "@makeplane/propel/icons";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { Button, getButtonStyling } from "@plane/propel/button";
 import { PlaneLogo } from "@plane/propel/icons";
@@ -164,7 +164,7 @@ export const WorkspaceAuthWrapper = observer(function WorkspaceAuthWrapper(props
                 onClick={handleSignOut}
               >
                 <Tooltip label={"Sign out"} alignOffset={8} disabled={isMobile}>
-                  <LogOut size={14} />
+                  <LogOutOutline width={14} height={14} />
                 </Tooltip>
               </div>
             </div>
diff --git a/apps/web/helpers/views.helper.ts b/apps/web/helpers/views.helper.ts
index 5b91810c9bb..b4ca7ca5d97 100644
--- a/apps/web/helpers/views.helper.ts
+++ b/apps/web/helpers/views.helper.ts
@@ -6,14 +6,14 @@
 
 import type { LucideIcon } from "lucide-react";
 import { VIEW_ACCESS_SPECIFIERS as VIEW_ACCESS_SPECIFIERS_CONSTANTS } from "@plane/constants";
-import { GlobeIcon, LockIcon } from "@plane/propel/icons";
+import { GlobeOutline, LockOutline } from "@makeplane/propel/icons";
 
 import type { ISvgIcons } from "@plane/propel/icons";
 import { EViewAccess } from "@plane/types";
 
 const VIEW_ACCESS_ICONS = {
-  [EViewAccess.PUBLIC]: GlobeIcon,
-  [EViewAccess.PRIVATE]: LockIcon,
+  [EViewAccess.PUBLIC]: GlobeOutline,
+  [EViewAccess.PRIVATE]: LockOutline,
 };
 
 export const VIEW_ACCESS_SPECIFIERS: {