diff --git a/src/assets/icons/all.svg b/src/assets/icons/all.svg
new file mode 100644
index 0000000..f2cb2d6
--- /dev/null
+++ b/src/assets/icons/all.svg
@@ -0,0 +1,12 @@
+<svg
+  width="20"
+  height="20"
+  viewBox="0 0 20 20"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M6.25 5.5V3.25C6.25 3.05109 6.32902 2.86032 6.46967 2.71967C6.61032 2.57902 6.80109 2.5 7 2.5H16C16.1989 2.5 16.3897 2.57902 16.5303 2.71967C16.671 2.86032 16.75 3.05109 16.75 3.25V13.75C16.75 13.9489 16.671 14.1397 16.5303 14.2803C16.3897 14.421 16.1989 14.5 16 14.5H13.75V16.75C13.75 17.164 13.4125 17.5 12.9948 17.5H4.00525C3.90635 17.5006 3.8083 17.4816 3.71674 17.4442C3.62519 17.4068 3.54192 17.3517 3.47174 17.282C3.40156 17.2123 3.34584 17.1294 3.30779 17.0381C3.26974 16.9468 3.2501 16.8489 3.25 16.75L3.25225 6.25C3.25225 5.836 3.58975 5.5 4.0075 5.5H6.25ZM7.75 5.5H13.75V13H15.25V4H7.75V5.5ZM6.25 9.25V10.75H10.75V9.25H6.25ZM6.25 12.25V13.75H10.75V12.25H6.25Z"
+    fill="currentColor"
+  />
+</svg>
diff --git a/src/assets/icons/copy.svg b/src/assets/icons/copy.svg
new file mode 100644
index 0000000..3d9aa4b
--- /dev/null
+++ b/src/assets/icons/copy.svg
@@ -0,0 +1,6 @@
+<svg viewBox="0 0 21 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M7 5.5V3.25C7 3.05109 7.07902 2.86032 7.21967 2.71967C7.36032 2.57902 7.55109 2.5 7.75 2.5H16.75C16.9489 2.5 17.1397 2.57902 17.2803 2.71967C17.421 2.86032 17.5 3.05109 17.5 3.25V13.75C17.5 13.9489 17.421 14.1397 17.2803 14.2803C17.1397 14.421 16.9489 14.5 16.75 14.5H14.5V16.75C14.5 17.164 14.1625 17.5 13.7448 17.5H4.75525C4.65635 17.5006 4.5583 17.4816 4.46674 17.4442C4.37519 17.4068 4.29192 17.3517 4.22174 17.282C4.15156 17.2123 4.09584 17.1294 4.05779 17.0381C4.01974 16.9468 4.0001 16.8489 4 16.75L4.00225 6.25C4.00225 5.836 4.33975 5.5 4.7575 5.5H7ZM5.50225 7L5.5 16H13V7H5.50225ZM8.5 5.5H14.5V13H16V4H8.5V5.5Z"
+    fill="#969696"
+  />
+</svg>
diff --git a/src/assets/icons/download-file.svg b/src/assets/icons/download-file.svg
new file mode 100644
index 0000000..01ce6c8
--- /dev/null
+++ b/src/assets/icons/download-file.svg
@@ -0,0 +1,6 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path
+    d="M4 15.25H16V10H17.5V16C17.5 16.1989 17.421 16.3897 17.2803 16.5303C17.1397 16.671 16.9489 16.75 16.75 16.75H3.25C3.05109 16.75 2.86032 16.671 2.71967 16.5303C2.57902 16.3897 2.5 16.1989 2.5 16V10H4V15.25ZM11.5 7.75H15.25L10 13L4.75 7.75H8.5V3.25H11.5V7.75Z"
+    fill="#969696"
+  />
+</svg>
diff --git a/src/assets/icons/favorite.svg b/src/assets/icons/favorite.svg
new file mode 100644
index 0000000..472d51f
--- /dev/null
+++ b/src/assets/icons/favorite.svg
@@ -0,0 +1,12 @@
+<svg
+  width="20"
+  height="20"
+  viewBox="0 0 20 20"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M9.99999 13.75L5.59149 16.4425L6.78999 11.4175L2.86749 8.0575L8.01624 7.645L9.99999 2.875L11.9837 7.645L17.1332 8.0575L13.21 11.4175L14.4085 16.4425L9.99999 13.75Z"
+    fill="#969696"
+  />
+</svg>
diff --git a/src/assets/icons/plus.svg b/src/assets/icons/plus.svg
new file mode 100644
index 0000000..f6dddea
--- /dev/null
+++ b/src/assets/icons/plus.svg
@@ -0,0 +1,12 @@
+<svg
+  width="21"
+  height="20"
+  viewBox="0 0 21 20"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M10.5 17.5C6.35775 17.5 3 14.1422 3 10C3 5.85775 6.35775 2.5 10.5 2.5C14.6422 2.5 18 5.85775 18 10C18 14.1422 14.6422 17.5 10.5 17.5ZM9.75 9.25H6.75V10.75H9.75V13.75H11.25V10.75H14.25V9.25H11.25V6.25H9.75V9.25Z"
+    fill="#99A0AE"
+  />
+</svg>
diff --git a/src/assets/icons/warning-circle.svg b/src/assets/icons/warning-circle.svg
new file mode 100644
index 0000000..8cb9cc2
--- /dev/null
+++ b/src/assets/icons/warning-circle.svg
@@ -0,0 +1,13 @@
+<svg
+  data-testid="icon-warning"
+  width="20"
+  height="20"
+  viewBox="0 0 20 20"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <path
+    d="M10 17.5C5.85775 17.5 2.5 14.1423 2.5 10C2.5 5.85775 5.85775 2.5 10 2.5C14.1423 2.5 17.5 5.85775 17.5 10C17.5 14.1423 14.1423 17.5 10 17.5ZM6.25 9.25V10.75H13.75V9.25H6.25Z"
+    fill="#FF8447"
+  />
+</svg>
diff --git a/src/components/Upload/UploadFile.tsx b/src/components/Upload/UploadFile.tsx
index faed619..d316f72 100644
--- a/src/components/Upload/UploadFile.tsx
+++ b/src/components/Upload/UploadFile.tsx
@@ -2,12 +2,15 @@ import { useRef, useReducer, Reducer, useEffect, useCallback } from "react";
 import { attributes } from "../utils/attributes";
 import { PrettyBytes } from "../utils/bytes";
 import { UploadStatus } from "./types";
-import { CircleCheck, TriangleAlert, CircleX, CircleStop } from "lucide-react";
+import { CircleStop } from "lucide-react";
 import { Spinner } from "../Spinner/Spinner";
 import { CodexData } from "@codex-storage/sdk-js";
 import { ButtonIcon } from "../ButtonIcon/ButtonIcon";
 import "./UploadFile.css";
 import { WebFileIcon } from "../WebFileIcon/WebFileIcon";
+import SuccessCircleIcon from "../../assets/icons/success-circle.svg?react";
+import WarningCircleIcon from "../../assets/icons/warning-circle.svg?react";
+import CloseIcon from "../../assets/icons/close.svg?react";
 
 type UploadFileProps = {
   file: File;
@@ -332,25 +335,19 @@ export function UploadStatusIcon({ status }: UploadStatusIconProps) {
   switch (status) {
     case "done":
       return (
-        <CircleCheck
-          size={"1.25rem"}
-          fill="currentColor"
-          className="upload-progress-check"
-          stroke="var(--codex-background)"
-        ></CircleCheck>
+        <SuccessCircleIcon width={17.5} fill="currentColor"></SuccessCircleIcon>
       );
     case "error":
       return (
-        <TriangleAlert
-          size={"1.25rem"}
+        <WarningCircleIcon
+          width={17.5}
           fill="currentColor"
-          className="upload-progress-cancelled"
           stroke="var(--codex-background)"
-        ></TriangleAlert>
+        ></WarningCircleIcon>
       );
 
     case "progress":
-      return <Spinner width={"1.25rem"} className="upload-progress-check" />;
+      return <Spinner width={"1.25rem"} />;
   }
 }
 
@@ -358,7 +355,7 @@ function UploadActionIcon({ status }: UploadStatusIconProps) {
   switch (status) {
     case "error":
     case "done":
-      return <CircleX size={"1.25rem"} />;
+      return <CloseIcon width={17.5} />;
     case "progress":
       return <CircleStop size={"1.25rem"} />;
   }
diff --git a/stories/Button.stories.ts b/stories/Button.stories.ts
index 1e52673..03dbbff 100644
--- a/stories/Button.stories.ts
+++ b/stories/Button.stories.ts
@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from "@storybook/react";
 import { fn } from "@storybook/test";
 import { Button } from "../src/components/Button/Button";
-import { Plus } from "lucide-react";
+import PlusIcon from "../src/assets/icons/plus.svg?react";
 
 // More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
 const meta = {
@@ -47,7 +47,7 @@ export const Outline: Story = {
 export const Icon: Story = {
   args: {
     label: "Button",
-    Icon: Plus,
+    Icon: PlusIcon,
   },
 };
 
diff --git a/stories/ButtonIcon.stories.ts b/stories/ButtonIcon.stories.ts
index f89a591..c0a3d5a 100644
--- a/stories/ButtonIcon.stories.ts
+++ b/stories/ButtonIcon.stories.ts
@@ -1,7 +1,9 @@
 import type { Meta, StoryObj } from "@storybook/react";
 import { fn } from "@storybook/test";
-import { Copy, Download, Plus } from "lucide-react";
 import { ButtonIcon } from "../src/components/ButtonIcon/ButtonIcon";
+import CopyIcon from "../src/assets/icons/copy.svg?react";
+import DownloadFileIcon from "../src/assets/icons/download-file.svg?react";
+import PlusIcon from "../src/assets/icons/plus.svg?react";
 
 const meta = {
   title: "Components/ButtonIcon",
@@ -23,42 +25,42 @@ type Story = StoryObj<typeof meta>;
 
 export const Small: Story = {
   args: {
-    Icon: Plus,
+    Icon: PlusIcon,
     variant: "small",
   },
 };
 
 export const Big: Story = {
   args: {
-    Icon: Plus,
+    Icon: PlusIcon,
     variant: "big",
   },
 };
 
 export const Disabled: Story = {
   args: {
-    Icon: Plus,
+    Icon: PlusIcon,
     disabled: true,
   },
 };
 
 export const BuzzAnimation: Story = {
   args: {
-    Icon: Copy,
+    Icon: CopyIcon,
     animation: "buzz"
   },
 };
 
 export const BounceAnimation: Story = {
   args: {
-    Icon: Download,
+    Icon: DownloadFileIcon,
     animation: "bounce"
   },
 };
 
 export const CustomStyle: Story = {
   args: {
-    Icon: Plus,
+    Icon: PlusIcon,
     variant: "big",
   },
 };
diff --git a/stories/InputIcon.tsx b/stories/InputIcon.tsx
index efacff6..46de422 100644
--- a/stories/InputIcon.tsx
+++ b/stories/InputIcon.tsx
@@ -1,5 +1,5 @@
-import { User } from "lucide-react";
+import PlusIcon from "../src/assets/icons/plus.svg?react";
 
 export function InputIcon() {
-  return <User size="1.25rem" />;
+  return <PlusIcon width={17.5} />;
 }
diff --git a/stories/Tabs.stories.tsx b/stories/Tabs.stories.tsx
index d6d08db..93e90f6 100644
--- a/stories/Tabs.stories.tsx
+++ b/stories/Tabs.stories.tsx
@@ -1,6 +1,8 @@
 import type { Meta } from "@storybook/react";
 import { useState } from "react";
-import { FilesIcon, Star } from "lucide-react";
+import AllFilesIcon from "../src/assets/icons/all.svg?react";
+import FavoriteIcon from "../src/assets/icons/favorite.svg?react";
+
 import { Tabs } from "../src/components/Tabs/Tabs";
 import { fn } from "@storybook/test";
 
@@ -33,11 +35,11 @@ const Template = (props: { onTabChange: () => void }) => {
         tabs={[
           {
             label: "All files",
-            Icon: () => <FilesIcon size={"1rem"}></FilesIcon>,
+            Icon: () => <AllFilesIcon></AllFilesIcon>,
           },
           {
             label: "Favorites",
-            Icon: () => <Star size={"1rem"}></Star>,
+            Icon: () => <FavoriteIcon></FavoriteIcon>,
           },
         ]}
       />
diff --git a/stories/Tooltip.stories.tsx b/stories/Tooltip.stories.tsx
index 5d24d92..faebe73 100644
--- a/stories/Tooltip.stories.tsx
+++ b/stories/Tooltip.stories.tsx
@@ -1,6 +1,6 @@
 import type { Meta, StoryObj } from "@storybook/react";
 import { Tooltip } from "../src/components/Tooltip/Tooltip";
-import { CheckCircle } from "lucide-react";
+import SuccessCircleIcon from "../src/assets/icons/success-circle.svg?react";
 
 const meta = {
   title: "Overlays/Tooltip",
@@ -18,6 +18,6 @@ type Story = StoryObj<typeof meta>;
 export const Default: Story = {
   args: {
     message: "Hello world",
-    children: <CheckCircle size={"1rem"} className="cell-stateIcon" />,
+    children: <SuccessCircleIcon className="cell-stateIcon" />,
   },
 };