diff --git a/src/components/Icon/Icon.stories.js b/src/components/Icon/Icon.stories.js
index e958587ee..7afae93da 100644
--- a/src/components/Icon/Icon.stories.js
+++ b/src/components/Icon/Icon.stories.js
@@ -58,17 +58,26 @@ export const iconGallery = {
 
 	args: {
 		icons: [
+			'Add',
 			'Announcements',
 			'AnonymousReview',
+			'ArrowLeft',
+			'ArrowRight',
 			'AttachFile',
+			'Attention',
 			'BackButton',
 			'Bold',
+			'Book',
 			'Bullets',
+			'Calendar',
 			'Cancel',
 			'Catalog',
-			'Complete',
 			'ChevronDown',
+			'ChevronLeft',
+			'ChevronRight',
 			'ChevronUp',
+			'Clock',
+			'Complete',
 			'Dashboard',
 			'DefaultDocument',
 			'DecreaseTextSize',
diff --git a/src/components/Icon/Icon.vue b/src/components/Icon/Icon.vue
index 3d9d214c8..a67339d1d 100644
--- a/src/components/Icon/Icon.vue
+++ b/src/components/Icon/Icon.vue
@@ -36,16 +36,25 @@
 <script></script>
 <script setup>
 import {defineProps, computed} from 'vue';
+import Add from './icons/Add.vue';
 import Announcements from './icons/Announcements.vue';
 import AnonymousReview from './icons/AnonymousReview.vue';
+import ArrowLeft from './icons/ArrowLeft.vue';
+import ArrowRight from './icons/ArrowRight.vue';
 import AttachFile from './icons/AttachFile.vue';
+import Attention from './icons/Attention.vue';
 import BackButton from './icons/BackButton.vue';
 import Bold from './icons/Bold.vue';
+import Book from './icons/Book.vue';
 import Bullets from './icons/Bullets.vue';
+import Calendar from './icons/Calendar.vue';
 import Cancel from './icons/Cancel.vue';
 import Catalog from './icons/Catalog.vue';
 import ChevronDown from './icons/ChevronDown.vue';
+import ChevronLeft from './icons/ChevronLeft.vue';
+import ChevronRight from './icons/ChevronRight.vue';
 import ChevronUp from './icons/ChevronUp.vue';
+import Clock from './icons/Clock.vue';
 import Complete from './icons/Complete.vue';
 import Dashboard from './icons/Dashboard.vue';
 import DecreaseTextSize from './icons/DecreaseTextSize.vue';
@@ -103,17 +112,26 @@ import View from './icons/View.vue';
 import Workflow from './icons/Workflow.vue';
 
 const svgIcons = {
+	Add,
 	Announcements,
 	AnonymousReview,
+	ArrowLeft,
+	ArrowRight,
 	AttachFile,
+	Attention,
 	BackButton,
 	Bold,
+	Book,
 	Bullets,
+	Calendar,
 	Cancel,
 	Catalog,
-	Complete,
 	ChevronDown,
+	ChevronLeft,
+	ChevronRight,
 	ChevronUp,
+	Clock,
+	Complete,
 	Dashboard,
 	DefaultDocument,
 	DecreaseTextSize,
diff --git a/src/components/Icon/icons/Add.vue b/src/components/Icon/icons/Add.vue
new file mode 100644
index 000000000..86f19fc7e
--- /dev/null
+++ b/src/components/Icon/icons/Add.vue
@@ -0,0 +1,8 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			d="M20.5714 11.1429H12.8571V3.42857C12.8571 3.20124 12.7668 2.98323 12.6061 2.82248C12.4453 2.66174 12.2273 2.57143 12 2.57143C11.7727 2.57143 11.5547 2.66174 11.3939 2.82248C11.2332 2.98323 11.1429 3.20124 11.1429 3.42857V11.1429H3.42857C3.20124 11.1429 2.98323 11.2332 2.82248 11.3939C2.66174 11.5547 2.57143 11.7727 2.57143 12C2.57143 12.2273 2.66174 12.4453 2.82248 12.6061C2.98323 12.7668 3.20124 12.8571 3.42857 12.8571H11.1429V20.5714C11.1429 20.7988 11.2332 21.0168 11.3939 21.1775C11.5547 21.3383 11.7727 21.4286 12 21.4286C12.2273 21.4286 12.4453 21.3383 12.6061 21.1775C12.7668 21.0168 12.8571 20.7988 12.8571 20.5714V12.8571H20.5714C20.7988 12.8571 21.0168 12.7668 21.1775 12.6061C21.3383 12.4453 21.4286 12.2273 21.4286 12C21.4286 11.7727 21.3383 11.5547 21.1775 11.3939C21.0168 11.2332 20.7988 11.1429 20.5714 11.1429Z"
+			fill="currentColor"
+		/>
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/ArrowLeft.vue b/src/components/Icon/icons/ArrowLeft.vue
new file mode 100644
index 000000000..25ddcb586
--- /dev/null
+++ b/src/components/Icon/icons/ArrowLeft.vue
@@ -0,0 +1,8 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			d="M21 11H5.41L6.71 9.71C6.8983 9.52169 7.00409 9.2663 7.00409 9C7.00409 8.7337 6.8983 8.4783 6.71 8.29C6.5217 8.10169 6.2663 7.99591 6 7.99591C5.7337 7.99591 5.4783 8.10169 5.29 8.29L2.29 11.29C2.19627 11.383 2.12188 11.4936 2.07111 11.6154C2.02034 11.7373 1.9942 11.868 1.9942 12C1.9942 12.132 2.02034 12.2627 2.07111 12.3846C2.12188 12.5064 2.19627 12.617 2.29 12.71L5.29 15.71C5.38296 15.8037 5.49356 15.8781 5.61542 15.9289C5.73728 15.9797 5.86799 16.0058 6 16.0058C6.13201 16.0058 6.26272 15.9797 6.38458 15.9289C6.50644 15.8781 6.61704 15.8037 6.71 15.71C6.80373 15.617 6.87812 15.5064 6.92889 15.3846C6.97966 15.2627 7.0058 15.132 7.0058 15C7.0058 14.868 6.97966 14.7373 6.92889 14.6154C6.87812 14.4936 6.80373 14.383 6.71 14.29L5.41 13H21C21.2652 13 21.5196 12.8946 21.7071 12.7071C21.8946 12.5196 22 12.2652 22 12C22 11.7348 21.8946 11.4804 21.7071 11.2929C21.5196 11.1054 21.2652 11 21 11Z"
+			fill="currentColor"
+		/>
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/ArrowRight.vue b/src/components/Icon/icons/ArrowRight.vue
new file mode 100644
index 000000000..de32ef299
--- /dev/null
+++ b/src/components/Icon/icons/ArrowRight.vue
@@ -0,0 +1,18 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			d="M3 12H21"
+			stroke="currentColor"
+			stroke-width="2"
+			stroke-linecap="round"
+			stroke-linejoin="round"
+		/>
+		<path
+			d="M18 15L21 12L18 9"
+			stroke="currentColor"
+			stroke-width="2"
+			stroke-linecap="round"
+			stroke-linejoin="round"
+		/>
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/Attention.vue b/src/components/Icon/icons/Attention.vue
new file mode 100644
index 000000000..16f3c3211
--- /dev/null
+++ b/src/components/Icon/icons/Attention.vue
@@ -0,0 +1,8 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			d="M13 2V16.5H11V2H13ZM11 19H13.004V21.004H11V19Z"
+			fill="currentColor"
+		/>
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/Book.vue b/src/components/Icon/icons/Book.vue
new file mode 100644
index 000000000..206b2b768
--- /dev/null
+++ b/src/components/Icon/icons/Book.vue
@@ -0,0 +1,13 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			d="M4 8C4 5.17157 4 3.75736 4.87868 2.87868C5.75736 2 7.17157 2 10 2H14C16.8284 2 18.2426 2 19.1213 2.87868C20 3.75736 20 5.17157 20 8V16C20 18.8284 20 20.2426 19.1213 21.1213C18.2426 22 16.8284 22 14 22H10C7.17157 22 5.75736 22 4.87868 21.1213C4 20.2426 4 18.8284 4 16V8Z"
+			stroke="currentColor"
+		/>
+		<path
+			d="M19.8978 16H7.89778C6.96781 16 6.50282 16 6.12132 16.1022C5.08604 16.3796 4.2774 17.1883 4 18.2235"
+			stroke="currentColor"
+		/>
+		<path d="M7 16V2.5" stroke="currentColor" stroke-linecap="round" />
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/Calendar.vue b/src/components/Icon/icons/Calendar.vue
new file mode 100644
index 000000000..fc63f7a49
--- /dev/null
+++ b/src/components/Icon/icons/Calendar.vue
@@ -0,0 +1,514 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<g clip-path="url(#clip0_336_796)">
+			<g filter="url(#filter0_d_336_796)">
+				<path
+					d="M3 8.26667V19C3 19.5523 3.44772 20 4 20H20C20.5523 20 21 19.5523 21 19V8.26667M3 8.26667V5C3 4.44772 3.44772 4 4 4H20C20.5523 4 21 4.44772 21 5V8.26667M3 8.26667H21"
+					stroke="currentColor"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter1_d_336_796)">
+				<path
+					d="M7 2V5"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter2_d_336_796)">
+				<path
+					d="M17 2V5"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter3_d_336_796)">
+				<path
+					d="M18 11H16"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter4_d_336_796)">
+				<path
+					d="M18 17H16"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter5_d_336_796)">
+				<path
+					d="M13 11H11"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter6_d_336_796)">
+				<path
+					d="M13 17H11"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter7_d_336_796)">
+				<path
+					d="M8 11H6"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter8_d_336_796)">
+				<path
+					d="M8 17H6"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter9_d_336_796)">
+				<path
+					d="M18 14H16"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter10_d_336_796)">
+				<path
+					d="M13 14H11"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+			<g filter="url(#filter11_d_336_796)">
+				<path
+					d="M8 14H6"
+					stroke="currentColor"
+					stroke-linecap="round"
+					stroke-linejoin="round"
+				/>
+			</g>
+		</g>
+		<defs>
+			<filter
+				id="filter0_d_336_796"
+				x="0"
+				y="3.5"
+				width="24"
+				height="22"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter1_d_336_796"
+				x="4"
+				y="1.5"
+				width="6"
+				height="9"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter2_d_336_796"
+				x="14"
+				y="1.5"
+				width="6"
+				height="9"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter3_d_336_796"
+				x="13"
+				y="10.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter4_d_336_796"
+				x="13"
+				y="16.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter5_d_336_796"
+				x="8"
+				y="10.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter6_d_336_796"
+				x="8"
+				y="16.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter7_d_336_796"
+				x="3"
+				y="10.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter8_d_336_796"
+				x="3"
+				y="16.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter9_d_336_796"
+				x="13"
+				y="13.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter10_d_336_796"
+				x="8"
+				y="13.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<filter
+				id="filter11_d_336_796"
+				x="3"
+				y="13.5"
+				width="8"
+				height="6"
+				filterUnits="userSpaceOnUse"
+				color-interpolation-filters="sRGB"
+			>
+				<feFlood flood-opacity="0" result="BackgroundImageFix" />
+				<feColorMatrix
+					in="SourceAlpha"
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+					result="hardAlpha"
+				/>
+				<feOffset dy="2.5" />
+				<feGaussianBlur stdDeviation="1.25" />
+				<feColorMatrix
+					type="matrix"
+					values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"
+				/>
+				<feBlend
+					mode="normal"
+					in2="BackgroundImageFix"
+					result="effect1_dropShadow_336_796"
+				/>
+				<feBlend
+					mode="normal"
+					in="SourceGraphic"
+					in2="effect1_dropShadow_336_796"
+					result="shape"
+				/>
+			</filter>
+			<clipPath id="clip0_336_796">
+				<rect width="24" height="24" fill="white" />
+			</clipPath>
+		</defs>
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/ChevronLeft.vue b/src/components/Icon/icons/ChevronLeft.vue
new file mode 100644
index 000000000..63f96e70b
--- /dev/null
+++ b/src/components/Icon/icons/ChevronLeft.vue
@@ -0,0 +1,10 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			fill-rule="evenodd"
+			clip-rule="evenodd"
+			d="M10.0606 11.9999L15.5303 17.4696L14.4696 18.5303L7.93929 11.9999L14.4696 5.4696L15.5303 6.5303L10.0606 11.9999Z"
+			fill="currentColor"
+		/>
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/ChevronRight.vue b/src/components/Icon/icons/ChevronRight.vue
new file mode 100644
index 000000000..5537401ab
--- /dev/null
+++ b/src/components/Icon/icons/ChevronRight.vue
@@ -0,0 +1,10 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			fill-rule="evenodd"
+			clip-rule="evenodd"
+			d="M13.9394 12.0001L8.46971 6.53039L9.53041 5.46973L16.0607 12.0001L9.53041 18.5304L8.46971 17.4697L13.9394 12.0001Z"
+			fill="currentColor"
+		/>
+	</svg>
+</template>
diff --git a/src/components/Icon/icons/Clock.vue b/src/components/Icon/icons/Clock.vue
new file mode 100644
index 000000000..93c070aa7
--- /dev/null
+++ b/src/components/Icon/icons/Clock.vue
@@ -0,0 +1,10 @@
+<template>
+	<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+		<path
+			fill-rule="evenodd"
+			clip-rule="evenodd"
+			d="M12 2.75C6.89137 2.75 2.75 6.89137 2.75 12C2.75 17.1086 6.89137 21.25 12 21.25C17.1086 21.25 21.25 17.1086 21.25 12C21.25 6.89137 17.1086 2.75 12 2.75ZM1.25 12C1.25 6.06294 6.06294 1.25 12 1.25C17.9371 1.25 22.75 6.06294 22.75 12C22.75 17.9371 17.9371 22.75 12 22.75C6.06294 22.75 1.25 17.9371 1.25 12ZM12 7.25C12.4142 7.25 12.75 7.58579 12.75 8V11.6893L15.0303 13.9697C15.3232 14.2626 15.3232 14.7374 15.0303 15.0303C14.7374 15.3232 14.2626 15.3232 13.9697 15.0303L11.4697 12.5303C11.329 12.3897 11.25 12.1989 11.25 12V8C11.25 7.58579 11.5858 7.25 12 7.25Z"
+			fill="currentColor"
+		/>
+	</svg>
+</template>