diff --git a/packages/lsd-react/src/components/CSSBaseline/CSSBaseline.tsx b/packages/lsd-react/src/components/CSSBaseline/CSSBaseline.tsx
index bb1e5e4..7a4fdab 100644
--- a/packages/lsd-react/src/components/CSSBaseline/CSSBaseline.tsx
+++ b/packages/lsd-react/src/components/CSSBaseline/CSSBaseline.tsx
@@ -1,10 +1,11 @@
 import { Global, SerializedStyles } from '@emotion/react'
 import React, { useMemo } from 'react'
 import { ButtonStyles } from '../Button/Button.styles'
+import { LsdIconStyles } from '../Icons/LsdIcon/LsdIcon.styles'
 import { defaultThemes, Theme, withTheme } from '../Theme'
 
 const componentStyles: Array<ReturnType<typeof withTheme> | SerializedStyles> =
-  [ButtonStyles]
+  [ButtonStyles, LsdIconStyles]
 
 export const CSSBaseline: React.FC<{ theme?: Theme }> = ({
   theme = defaultThemes.light,
diff --git a/packages/lsd-react/src/components/Icons/AddIcon/AddIcon.tsx b/packages/lsd-react/src/components/Icons/AddIcon/AddIcon.tsx
new file mode 100644
index 0000000..2d0282b
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/AddIcon/AddIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const AddIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M11.6666 7.58334H7.58325V11.6667H6.41659V7.58334H2.33325V6.41668H6.41659V2.33334H7.58325V6.41668H11.6666V7.58334Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/AddIcon/index.ts b/packages/lsd-react/src/components/Icons/AddIcon/index.ts
new file mode 100644
index 0000000..d62133a
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/AddIcon/index.ts
@@ -0,0 +1 @@
+export * from './AddIcon'
diff --git a/packages/lsd-react/src/components/Icons/ArrowDownIcon/ArrowDownIcon.tsx b/packages/lsd-react/src/components/Icons/ArrowDownIcon/ArrowDownIcon.tsx
new file mode 100644
index 0000000..7ad38fc
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ArrowDownIcon/ArrowDownIcon.tsx
@@ -0,0 +1,22 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const ArrowDownIcon = LsdIcon(
+  (props) => (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 14 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M10.5 5.66125L9.6775 4.83875L7 7.51041L4.3225 4.83874L3.5 5.66125L7 9.16125L10.5 5.66125Z"
+        fill="black"
+      />
+    </svg>
+  ),
+  {
+    filled: true,
+  },
+)
diff --git a/packages/lsd-react/src/components/Icons/ArrowDownIcon/index.ts b/packages/lsd-react/src/components/Icons/ArrowDownIcon/index.ts
new file mode 100644
index 0000000..462c44a
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ArrowDownIcon/index.ts
@@ -0,0 +1 @@
+export * from './ArrowDownIcon'
diff --git a/packages/lsd-react/src/components/Icons/ArrowForwardIcon/ArrowForwardIcon.tsx b/packages/lsd-react/src/components/Icons/ArrowForwardIcon/ArrowForwardIcon.tsx
new file mode 100644
index 0000000..6292880
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ArrowForwardIcon/ArrowForwardIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const ArrowForwardIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M6.99992 2.33334L6.17742 3.15584L9.43242 6.41668H2.33325V7.58334H9.43242L6.17742 10.8442L6.99992 11.6667L11.6666 7.00001L6.99992 2.33334Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/ArrowForwardIcon/index.ts b/packages/lsd-react/src/components/Icons/ArrowForwardIcon/index.ts
new file mode 100644
index 0000000..3ed1249
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ArrowForwardIcon/index.ts
@@ -0,0 +1 @@
+export * from './ArrowForwardIcon'
diff --git a/packages/lsd-react/src/components/Icons/ArrowUpIcon/ArrowUpIcon.tsx b/packages/lsd-react/src/components/Icons/ArrowUpIcon/ArrowUpIcon.tsx
new file mode 100644
index 0000000..a36d196
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ArrowUpIcon/ArrowUpIcon.tsx
@@ -0,0 +1,22 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const ArrowUpIcon = LsdIcon(
+  (props) => (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 14 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M3.5 8.33875L4.3225 9.16125L7 6.48959L9.6775 9.16125L10.5 8.33875L7 4.83875L3.5 8.33875Z"
+        fill="black"
+      />
+    </svg>
+  ),
+  {
+    filled: true,
+  },
+)
diff --git a/packages/lsd-react/src/components/Icons/ArrowUpIcon/index.ts b/packages/lsd-react/src/components/Icons/ArrowUpIcon/index.ts
new file mode 100644
index 0000000..c20a747
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ArrowUpIcon/index.ts
@@ -0,0 +1 @@
+export * from './ArrowUpIcon'
diff --git a/packages/lsd-react/src/components/Icons/CheckIcon/CheckIcon.tsx b/packages/lsd-react/src/components/Icons/CheckIcon/CheckIcon.tsx
new file mode 100644
index 0000000..d1a56a0
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CheckIcon/CheckIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const CheckIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M11.0833 2.91667V11.0833H2.91667V2.91667H11.0833ZM11.0833 1.75H2.91667C2.275 1.75 1.75 2.275 1.75 2.91667V11.0833C1.75 11.725 2.275 12.25 2.91667 12.25H11.0833C11.725 12.25 12.25 11.725 12.25 11.0833V2.91667C12.25 2.275 11.725 1.75 11.0833 1.75Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/CheckIcon/index.ts b/packages/lsd-react/src/components/Icons/CheckIcon/index.ts
new file mode 100644
index 0000000..d779150
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CheckIcon/index.ts
@@ -0,0 +1 @@
+export * from './CheckIcon'
diff --git a/packages/lsd-react/src/components/Icons/CheckboxFilledIcon/CheckboxFilledIcon.tsx b/packages/lsd-react/src/components/Icons/CheckboxFilledIcon/CheckboxFilledIcon.tsx
new file mode 100644
index 0000000..f09e34c
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CheckboxFilledIcon/CheckboxFilledIcon.tsx
@@ -0,0 +1,24 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const CheckboxFilledIcon = LsdIcon(
+  (props) => (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 14 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M2.91667 1.75H11.0833C11.725 1.75 12.25 2.275 12.25 2.91667V11.0833C12.25 11.725 11.725 12.25 11.0833 12.25H2.91667C2.275 12.25 1.75 11.725 1.75 11.0833V2.91667C1.75 2.275 2.275 1.75 2.91667 1.75ZM9.68333 4.43333L10.5 5.25L5.83333 9.91667L3.5 7.58333L4.31667 6.76667L5.83333 8.28333L9.68333 4.43333Z"
+        fill="black"
+      />
+    </svg>
+  ),
+  {
+    filled: true,
+  },
+)
diff --git a/packages/lsd-react/src/components/Icons/CheckboxFilledIcon/index.ts b/packages/lsd-react/src/components/Icons/CheckboxFilledIcon/index.ts
new file mode 100644
index 0000000..0c3d5b6
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CheckboxFilledIcon/index.ts
@@ -0,0 +1 @@
+export * from './CheckboxFilledIcon'
diff --git a/packages/lsd-react/src/components/Icons/CheckboxIcon/CheckboxIcon.tsx b/packages/lsd-react/src/components/Icons/CheckboxIcon/CheckboxIcon.tsx
new file mode 100644
index 0000000..e056a5a
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CheckboxIcon/CheckboxIcon.tsx
@@ -0,0 +1,22 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const CheckboxIcon = LsdIcon(
+  (props) => (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 14 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M11.0833 2.91667V11.0833H2.91667V2.91667H11.0833ZM11.0833 1.75H2.91667C2.275 1.75 1.75 2.275 1.75 2.91667V11.0833C1.75 11.725 2.275 12.25 2.91667 12.25H11.0833C11.725 12.25 12.25 11.725 12.25 11.0833V2.91667C12.25 2.275 11.725 1.75 11.0833 1.75Z"
+        fill="black"
+      />
+    </svg>
+  ),
+  {
+    filled: true,
+  },
+)
diff --git a/packages/lsd-react/src/components/Icons/CheckboxIcon/index.ts b/packages/lsd-react/src/components/Icons/CheckboxIcon/index.ts
new file mode 100644
index 0000000..fe78e7f
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CheckboxIcon/index.ts
@@ -0,0 +1 @@
+export * from './CheckboxIcon'
diff --git a/packages/lsd-react/src/components/Icons/CloseIcon/CloseIcon.tsx b/packages/lsd-react/src/components/Icons/CloseIcon/CloseIcon.tsx
new file mode 100644
index 0000000..e251855
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CloseIcon/CloseIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const CloseIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M11.0834 3.73916L10.2609 2.91666L7.00008 6.17749L3.73925 2.91666L2.91675 3.73916L6.17758 6.99999L2.91675 10.2608L3.73925 11.0833L7.00008 7.82249L10.2609 11.0833L11.0834 10.2608L7.82258 6.99999L11.0834 3.73916Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/CloseIcon/index.ts b/packages/lsd-react/src/components/Icons/CloseIcon/index.ts
new file mode 100644
index 0000000..c4f6c90
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/CloseIcon/index.ts
@@ -0,0 +1 @@
+export * from './CloseIcon'
diff --git a/packages/lsd-react/src/components/Icons/ErrorIcon/ErrorIcon.tsx b/packages/lsd-react/src/components/Icons/ErrorIcon/ErrorIcon.tsx
new file mode 100644
index 0000000..4690b43
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ErrorIcon/ErrorIcon.tsx
@@ -0,0 +1,24 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const ErrorIcon = LsdIcon(
+  (props) => (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 14 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M7.00008 1.16666C3.78008 1.16666 1.16675 3.77999 1.16675 6.99999C1.16675 10.22 3.78008 12.8333 7.00008 12.8333C10.2201 12.8333 12.8334 10.22 12.8334 6.99999C12.8334 3.77999 10.2201 1.16666 7.00008 1.16666ZM6.41675 9.91666V8.74999H7.58342V9.91666H6.41675ZM6.41675 4.08332V7.58332H7.58342V4.08332H6.41675Z"
+        fill="black"
+      />
+    </svg>
+  ),
+  {
+    filled: true,
+  },
+)
diff --git a/packages/lsd-react/src/components/Icons/ErrorIcon/index.ts b/packages/lsd-react/src/components/Icons/ErrorIcon/index.ts
new file mode 100644
index 0000000..8dd0c34
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/ErrorIcon/index.ts
@@ -0,0 +1 @@
+export * from './ErrorIcon'
diff --git a/packages/lsd-react/src/components/Icons/FolderIcon/FolderIcon.tsx b/packages/lsd-react/src/components/Icons/FolderIcon/FolderIcon.tsx
new file mode 100644
index 0000000..6dbf638
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/FolderIcon/FolderIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const FolderIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M5.34925 3.50001L6.51591 4.66668H11.6667V10.5H2.33341V3.50001H5.34925ZM5.83341 2.33334H2.33341C1.69175 2.33334 1.17258 2.85834 1.17258 3.50001L1.16675 10.5C1.16675 11.1417 1.69175 11.6667 2.33341 11.6667H11.6667C12.3084 11.6667 12.8334 11.1417 12.8334 10.5V4.66668C12.8334 4.02501 12.3084 3.50001 11.6667 3.50001H7.00008L5.83341 2.33334Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/FolderIcon/index.ts b/packages/lsd-react/src/components/Icons/FolderIcon/index.ts
new file mode 100644
index 0000000..6ceaad1
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/FolderIcon/index.ts
@@ -0,0 +1 @@
+export * from './FolderIcon'
diff --git a/packages/lsd-react/src/components/Icons/KeyboardReturnIcon/KeyboardReturnIcon.tsx b/packages/lsd-react/src/components/Icons/KeyboardReturnIcon/KeyboardReturnIcon.tsx
new file mode 100644
index 0000000..702f4a1
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/KeyboardReturnIcon/KeyboardReturnIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const KeyboardReturnIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M11.0833 4.08333V6.41667H3.98417L6.0725 4.3225L5.25 3.5L1.75 7L5.25 10.5L6.0725 9.6775L3.98417 7.58333H12.25V4.08333H11.0833Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/KeyboardReturnIcon/index.ts b/packages/lsd-react/src/components/Icons/KeyboardReturnIcon/index.ts
new file mode 100644
index 0000000..f990f87
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/KeyboardReturnIcon/index.ts
@@ -0,0 +1 @@
+export * from './KeyboardReturnIcon'
diff --git a/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.classes.ts b/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.classes.ts
new file mode 100644
index 0000000..6b61c77
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.classes.ts
@@ -0,0 +1,8 @@
+export const lsdIconClasses = {
+  root: 'lsd-icon',
+  small: 'lsd-icon--small',
+  filled: 'lsd-icon--filled',
+  stroked: 'lsd-icon--stroked',
+  primary: 'lsd-icon--primary',
+  secondary: 'lsd-icon--secondary',
+}
diff --git a/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.styles.ts b/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.styles.ts
new file mode 100644
index 0000000..2ccf1b3
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.styles.ts
@@ -0,0 +1,39 @@
+import { css } from '@emotion/react'
+import { lsdIconClasses } from './LsdIcon.classes'
+
+export const LsdIconStyles = css`
+  .${lsdIconClasses.root} {
+  }
+
+  .${lsdIconClasses.primary} {
+    &.${lsdIconClasses.filled} {
+      &,
+      * {
+        fill: rgb(var(--lsd-icon-primary));
+      }
+    }
+
+    $.${lsdIconClasses.stroked} {
+      &,
+      * {
+        fill: rgb(var(--lsd-icon-primary));
+      }
+    }
+  }
+
+  .${lsdIconClasses.secondary} {
+    &.${lsdIconClasses.filled} {
+      &,
+      * {
+        fill: rgb(var(--lsd-icon-secondary));
+      }
+    }
+
+    $.${lsdIconClasses.stroked} {
+      &,
+      * {
+        fill: rgb(var(--lsd-icon-secondary));
+      }
+    }
+  }
+`
diff --git a/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.tsx b/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.tsx
new file mode 100644
index 0000000..04fa70f
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/LsdIcon/LsdIcon.tsx
@@ -0,0 +1,46 @@
+import clsx from 'clsx'
+import React from 'react'
+import { lsdIconClasses } from './LsdIcon.classes'
+
+export type LsdIconProps = React.SVGAttributes<SVGElement> & {
+  size?: 'small'
+  color?: 'primary' | 'secondary'
+}
+
+type LsdIconComponent = React.FC<LsdIconProps> & {
+  classes: typeof lsdIconClasses
+}
+
+export const LsdIcon = (
+  Component: React.ComponentType<React.SVGAttributes<SVGElement>>,
+  metadata?: {
+    filled?: boolean
+    stroked?: boolean
+  },
+): LsdIconComponent => {
+  const IconComponent: LsdIconComponent = ({
+    color,
+    size = 'small',
+    className,
+    ...props
+  }) => {
+    return (
+      <Component
+        className={clsx(
+          className,
+          lsdIconClasses.root,
+          lsdIconClasses[size],
+          color && lsdIconClasses[color],
+          metadata?.filled && lsdIconClasses.filled,
+          metadata?.stroked && lsdIconClasses.stroked,
+        )}
+        {...props}
+      />
+    )
+  }
+
+  IconComponent.displayName = Component.displayName
+  IconComponent.classes = lsdIconClasses
+
+  return IconComponent
+}
diff --git a/packages/lsd-react/src/components/Icons/LsdIcon/index.ts b/packages/lsd-react/src/components/Icons/LsdIcon/index.ts
new file mode 100644
index 0000000..e65cfd8
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/LsdIcon/index.ts
@@ -0,0 +1 @@
+export * from './LsdIcon'
diff --git a/packages/lsd-react/src/components/Icons/MenuIcon/MenuIcon.tsx b/packages/lsd-react/src/components/Icons/MenuIcon/MenuIcon.tsx
new file mode 100644
index 0000000..129d302
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/MenuIcon/MenuIcon.tsx
@@ -0,0 +1,24 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const MenuIcon = LsdIcon(
+  (props) => (
+    <svg
+      width="14"
+      height="14"
+      viewBox="0 0 14 14"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        fillRule="evenodd"
+        clipRule="evenodd"
+        d="M1.75 4.66667V3.5H12.25V4.66667H1.75ZM1.75 7.58333H12.25V6.41667H1.75V7.58333ZM1.75 10.5H12.25V9.33333H1.75V10.5Z"
+        fill="black"
+      />
+    </svg>
+  ),
+  {
+    filled: true,
+  },
+)
diff --git a/packages/lsd-react/src/components/Icons/MenuIcon/index.ts b/packages/lsd-react/src/components/Icons/MenuIcon/index.ts
new file mode 100644
index 0000000..0319bb4
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/MenuIcon/index.ts
@@ -0,0 +1 @@
+export * from './MenuIcon'
diff --git a/packages/lsd-react/src/components/Icons/MoreIcon/MoreIcon.tsx b/packages/lsd-react/src/components/Icons/MoreIcon/MoreIcon.tsx
new file mode 100644
index 0000000..efc56ea
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/MoreIcon/MoreIcon.tsx
@@ -0,0 +1,19 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const MoreIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M3.49992 5.83334C2.85825 5.83334 2.33325 6.35834 2.33325 7.00001C2.33325 7.64168 2.85825 8.16668 3.49992 8.16668C4.14159 8.16668 4.66659 7.64168 4.66659 7.00001C4.66659 6.35834 4.14159 5.83334 3.49992 5.83334ZM10.4999 5.83334C9.85825 5.83334 9.33325 6.35834 9.33325 7.00001C9.33325 7.64168 9.85825 8.16668 10.4999 8.16668C11.1416 8.16668 11.6666 7.64168 11.6666 7.00001C11.6666 6.35834 11.1416 5.83334 10.4999 5.83334ZM5.83325 7.00001C5.83325 6.35834 6.35825 5.83334 6.99992 5.83334C7.64159 5.83334 8.16659 6.35834 8.16659 7.00001C8.16659 7.64168 7.64159 8.16668 6.99992 8.16668C6.35825 8.16668 5.83325 7.64168 5.83325 7.00001Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/MoreIcon/index.ts b/packages/lsd-react/src/components/Icons/MoreIcon/index.ts
new file mode 100644
index 0000000..c304821
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/MoreIcon/index.ts
@@ -0,0 +1 @@
+export * from './MoreIcon'
diff --git a/packages/lsd-react/src/components/Icons/NavigateBeforeIcon/NavigateBeforeIcon.tsx b/packages/lsd-react/src/components/Icons/NavigateBeforeIcon/NavigateBeforeIcon.tsx
new file mode 100644
index 0000000..62fc3cf
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/NavigateBeforeIcon/NavigateBeforeIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const NavigateBeforeIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M9.16137 4.3225L8.33887 3.5L4.83887 7L8.33887 10.5L9.16137 9.6775L6.4897 7L9.16137 4.3225Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/NavigateBeforeIcon/index.ts b/packages/lsd-react/src/components/Icons/NavigateBeforeIcon/index.ts
new file mode 100644
index 0000000..6662488
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/NavigateBeforeIcon/index.ts
@@ -0,0 +1 @@
+export * from './NavigateBeforeIcon'
diff --git a/packages/lsd-react/src/components/Icons/NavigateNextIcon/NavigateNextIcon.tsx b/packages/lsd-react/src/components/Icons/NavigateNextIcon/NavigateNextIcon.tsx
new file mode 100644
index 0000000..c5cb19f
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/NavigateNextIcon/NavigateNextIcon.tsx
@@ -0,0 +1,17 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const NavigateNextIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      d="M5.66137 3.5L4.83887 4.3225L7.51053 7L4.83887 9.6775L5.66137 10.5L9.16137 7L5.66137 3.5Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/NavigateNextIcon/index.ts b/packages/lsd-react/src/components/Icons/NavigateNextIcon/index.ts
new file mode 100644
index 0000000..17d193d
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/NavigateNextIcon/index.ts
@@ -0,0 +1 @@
+export * from './NavigateNextIcon'
diff --git a/packages/lsd-react/src/components/Icons/NewPageIcon/NewPageIcon.tsx b/packages/lsd-react/src/components/Icons/NewPageIcon/NewPageIcon.tsx
new file mode 100644
index 0000000..e431e8b
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/NewPageIcon/NewPageIcon.tsx
@@ -0,0 +1,19 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const NewPageIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M9.79293 3.5H3.00004V2.5H11.5V11H10.5V4.20711L3.35359 11.3536L2.64648 10.6464L9.79293 3.5Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/NewPageIcon/index.ts b/packages/lsd-react/src/components/Icons/NewPageIcon/index.ts
new file mode 100644
index 0000000..87719f9
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/NewPageIcon/index.ts
@@ -0,0 +1 @@
+export * from './NewPageIcon'
diff --git a/packages/lsd-react/src/components/Icons/SearchIcon/SearchIcon.tsx b/packages/lsd-react/src/components/Icons/SearchIcon/SearchIcon.tsx
new file mode 100644
index 0000000..e1db86c
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/SearchIcon/SearchIcon.tsx
@@ -0,0 +1,19 @@
+import { LsdIcon } from '../LsdIcon'
+
+export const SearchIcon = LsdIcon((props) => (
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 14 14"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      fillRule="evenodd"
+      clipRule="evenodd"
+      d="M8.61 7.74083L11.9525 11.0833L11.0833 11.9525L7.74083 8.61C7.11667 9.05917 6.36417 9.33333 5.54167 9.33333C3.4475 9.33333 1.75 7.63583 1.75 5.54167C1.75 3.4475 3.4475 1.75 5.54167 1.75C7.63583 1.75 9.33333 3.4475 9.33333 5.54167C9.33333 6.36417 9.05917 7.11667 8.61 7.74083ZM5.54167 2.91667C4.08917 2.91667 2.91667 4.08917 2.91667 5.54167C2.91667 6.99417 4.08917 8.16667 5.54167 8.16667C6.99417 8.16667 8.16667 6.99417 8.16667 5.54167C8.16667 4.08917 6.99417 2.91667 5.54167 2.91667Z"
+      fill="black"
+    />
+  </svg>
+))
diff --git a/packages/lsd-react/src/components/Icons/SearchIcon/index.ts b/packages/lsd-react/src/components/Icons/SearchIcon/index.ts
new file mode 100644
index 0000000..e87db02
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/SearchIcon/index.ts
@@ -0,0 +1 @@
+export * from './SearchIcon'
diff --git a/packages/lsd-react/src/components/Icons/index.ts b/packages/lsd-react/src/components/Icons/index.ts
new file mode 100644
index 0000000..d046975
--- /dev/null
+++ b/packages/lsd-react/src/components/Icons/index.ts
@@ -0,0 +1,18 @@
+export * from './AddIcon'
+export * from './ArrowDownIcon'
+export * from './ArrowForwardIcon'
+export * from './ArrowUpIcon'
+export * from './CheckboxFilledIcon'
+export * from './CheckboxIcon'
+export * from './CheckIcon'
+export * from './CloseIcon'
+export * from './ErrorIcon'
+export * from './FolderIcon'
+export * from './KeyboardReturnIcon'
+export * from './LsdIcon'
+export * from './MenuIcon'
+export * from './MoreIcon'
+export * from './NavigateBeforeIcon'
+export * from './NavigateNextIcon'
+export * from './NewPageIcon'
+export * from './SearchIcon'
diff --git a/packages/lsd-react/src/index.ts b/packages/lsd-react/src/index.ts
index f7691c0..ce6362a 100644
--- a/packages/lsd-react/src/index.ts
+++ b/packages/lsd-react/src/index.ts
@@ -1,2 +1,3 @@
 export * from './components/Button'
+export * from './components/Icons'
 export * from './components/Theme'