diff --git a/apps/scandic-web/app/[lang]/(live)/layout.tsx b/apps/scandic-web/app/[lang]/(live)/layout.tsx
index 1b8a33112..48993b39e 100644
--- a/apps/scandic-web/app/[lang]/(live)/layout.tsx
+++ b/apps/scandic-web/app/[lang]/(live)/layout.tsx
@@ -2,6 +2,7 @@ import "@scandic-hotels/design-system/fonts.css"
 import "@/app/globals.css"
 import "@/public/_static/css/design-system-new-deprecated.css"
 import "@scandic-hotels/design-system/style.css"
+import "react-material-symbols/rounded"
 
 import { ReactQueryDevtools } from "@tanstack/react-query-devtools"
 import Script from "next/script"
diff --git a/apps/scandic-web/app/[lang]/(live-current)/layout.tsx b/apps/scandic-web/app/[lang]/(live-current)/layout.tsx
index 416835dc2..617e7c29e 100644
--- a/apps/scandic-web/app/[lang]/(live-current)/layout.tsx
+++ b/apps/scandic-web/app/[lang]/(live-current)/layout.tsx
@@ -2,6 +2,7 @@ import "@scandic-hotels/design-system/fonts.css"
 import "@/app/globals.css"
 import "@/public/_static/css/design-system-current-deprecated.css"
 import "@scandic-hotels/design-system/style.css"
+import "react-material-symbols/rounded"
 
 import Script from "next/script"
 
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/AlreadyLinkedError.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/AlreadyLinkedError.tsx
index e349ad878..c5a319a63 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/AlreadyLinkedError.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/AlreadyLinkedError.tsx
@@ -2,11 +2,11 @@
 import Link from "next/link"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { partnerSas } from "@/constants/routes/myPages"
 
-import ErrorCircleFilledIcon from "@/components/Icons/ErrorCircleFilled"
 import Button from "@/components/TempDesignSystem/Button"
 import useLang from "@/hooks/useLang"
 
@@ -18,7 +18,7 @@ export function AlreadyLinkedError() {
 
   return (
     <SASModal>
-      <ErrorCircleFilledIcon height={64} width={64} color="red" />
+      <MaterialIcon icon="cancel" isFilled size={64} />
       <Typography variant="Title/Subtitle/lg">
         <h1>{intl.formatMessage({ id: "Accounts are already linked" })}</h1>
       </Typography>
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/DateOfBirthError.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/DateOfBirthError.tsx
index 8a452ca0a..ee24138e8 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/DateOfBirthError.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/DateOfBirthError.tsx
@@ -2,11 +2,11 @@
 import { Link } from "react-aria-components"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { profile } from "@/constants/routes/myPages"
 
-import ErrorCircleFilledIcon from "@/components/Icons/ErrorCircleFilled"
 import Button from "@/components/TempDesignSystem/Button"
 import useLang from "@/hooks/useLang"
 
@@ -18,7 +18,12 @@ export function DateOfBirthError() {
 
   return (
     <SASModal>
-      <ErrorCircleFilledIcon height={64} width={64} color="red" />
+      <MaterialIcon
+        icon="cancel"
+        color="Icon/Feedback/Error"
+        isFilled
+        size={64}
+      />
       <Typography variant="Title/Subtitle/lg">
         <h1>{intl.formatMessage({ id: "Date of birth not matching" })}</h1>
       </Typography>
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/GenericError.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/GenericError.tsx
index 235c094a8..0e2c49b4d 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/GenericError.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/components/GenericError.tsx
@@ -1,10 +1,9 @@
 "use client"
 import Image from "next/image"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import ErrorCircleFilledIcon from "@/components/Icons/ErrorCircleFilled"
-
 import { SASModal } from "./SASModal"
 
 import type { ReactNode } from "react"
@@ -21,7 +20,12 @@ export function GenericError({
   return (
     <SASModal>
       {variant === "error" ? (
-        <ErrorCircleFilledIcon height={64} width={64} color="red" />
+        <MaterialIcon
+          icon="cancel"
+          isFilled
+          size={64}
+          color="Icon/Feedback/Error"
+        />
       ) : (
         <Image
           src="/_static/img/scandic-loyalty-time.svg"
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx
index 287cf1ddb..9bbd70d06 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/LinkAccountForm.tsx
@@ -6,11 +6,11 @@ import { useTransition } from "react"
 import { FormProvider, useForm } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { profileEdit } from "@/constants/routes/myPages"
 
-import { ArrowRightIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
 import Link from "@/components/TempDesignSystem/Link"
@@ -94,7 +94,8 @@ export function LinkAccountForm({
             {intl.formatMessage({
               id: "Edit your personal details",
             })}
-            <ArrowRightIcon color="peach80" height={18} width={18} />
+
+            <MaterialIcon icon="arrow_forward" size={18} color="CurrentColor" />
           </Link>
         </div>
         <div className={styles.termsAndConditions}>
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/success/page.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/success/page.tsx
index df6134bcf..02a19ba0c 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/success/page.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/link/success/page.tsx
@@ -1,10 +1,10 @@
 import React from "react"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { partnerSas } from "@/constants/routes/myPages"
 
-import CheckCircle from "@/components/Icons/CheckCircle"
 import { Redirect } from "@/components/Redirect"
 import { getIntl } from "@/i18n"
 
@@ -20,7 +20,11 @@ export default async function SASxScandicLinkPage({
   return (
     <SASModal>
       <Redirect url={partnerSas[params.lang]} timeout={3000} />
-      <CheckCircle height={64} width={64} color="uiSemanticSuccess" />
+      <MaterialIcon
+        icon="check_circle"
+        size={64}
+        color="Icon/Feedback/Success"
+      />
       <Typography variant="Title/Subtitle/lg">
         <h1>{intl.formatMessage({ id: "Your accounts are linked" })}</h1>
       </Typography>
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx
index 146db9990..5212ae507 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/otp/OneTimePasswordForm.tsx
@@ -6,11 +6,11 @@ import { useParams, useRouter } from "next/navigation"
 import { type ReactNode, useState, useTransition } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { trpc } from "@/lib/trpc/client"
 
-import ErrorCircleFilledIcon from "@/components/Icons/ErrorCircleFilled"
 import Link from "@/components/TempDesignSystem/Link"
 
 import { GenericError } from "../components/GenericError"
@@ -170,7 +170,12 @@ export default function OneTimePasswordForm({
       />
       {errorMessage && (
         <div className={styles["error-message"]}>
-          <ErrorCircleFilledIcon height={20} width={20} color="red" />
+          <MaterialIcon
+            icon="cancel"
+            isFilled
+            size={20}
+            color="Icon/Feedback/Error"
+          />
           <Typography variant="Body/Supporting text (caption)/smRegular">
             <p style={{ color: "var(--Scandic-Red-60)" }}>{errorMessage}</p>
           </Typography>
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/transfer/success/page.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/transfer/success/page.tsx
index 20fad5a3c..18ef971b2 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/transfer/success/page.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/transfer/success/page.tsx
@@ -1,13 +1,13 @@
 import Link from "next/link"
 import React, { Suspense } from "react"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { hotelreservation } from "@/constants/routes/hotelReservation"
 import { partnerSas } from "@/constants/routes/myPages"
 import { getProfileSafely } from "@/lib/trpc/memoizedRequests"
 
-import { CalendarAddIcon } from "@/components/Icons"
 import Image from "@/components/Image"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Button from "@/components/TempDesignSystem/Button"
@@ -129,7 +129,11 @@ async function TransactionCard({
             {/* TODO correct link */}
             <Link href={hotelreservation(lang)} color="none">
               {intl.formatMessage({ id: "Book now" })}{" "}
-              <CalendarAddIcon width={20} height={20} color="currentColor" />
+              <MaterialIcon
+                icon="calendar_add_on"
+                size={20}
+                color="CurrentColor"
+              />
             </Link>
           </Button>
         </div>
diff --git a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/unlink/success/page.tsx b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/unlink/success/page.tsx
index d98b2e4ac..086bda89e 100644
--- a/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/unlink/success/page.tsx
+++ b/apps/scandic-web/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/unlink/success/page.tsx
@@ -1,10 +1,10 @@
 import React from "react"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { overview } from "@/constants/routes/myPages"
 
-import CheckCircle from "@/components/Icons/CheckCircle"
 import { Redirect } from "@/components/Redirect"
 import { getIntl } from "@/i18n"
 
@@ -20,7 +20,11 @@ export default async function SASxScandicUnlinkSuccessPage({
   return (
     <SASModal>
       <Redirect url={overview[params.lang]} timeout={3000} />
-      <CheckCircle height={64} width={64} color="uiSemanticSuccess" />
+      <MaterialIcon
+        icon="check_circle"
+        size={64}
+        color="Icon/Feedback/Success"
+      />
       <Typography variant="Title/Subtitle/lg">
         <h1>{intl.formatMessage({ id: "Your accounts are now unlinked" })}</h1>
       </Typography>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx
index 5df6aa44a..1476cbfd3 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/JobylonFeed/JobylonCard/index.tsx
@@ -2,9 +2,10 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
-import { OpenInNewSmallIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -53,7 +54,7 @@ export default function JobylonCard({ job }: JobylonCardProps) {
         >
           <a href={job.url} target="_blank" rel="noopener noreferrer">
             {intl.formatMessage({ id: "View & apply" })}
-            <OpenInNewSmallIcon />
+            <MaterialIcon icon="open_in_new" size={20} />
           </a>
         </Button>
       </div>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/LoyaltyLevels/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/LoyaltyLevels/index.tsx
index d5114f1a2..923482cfa 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/LoyaltyLevels/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/LoyaltyLevels/index.tsx
@@ -1,6 +1,7 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { serverClient } from "@/lib/trpc/server"
 
-import { CheckIcon } from "@/components/Icons"
 import MembershipLevelIcon from "@/components/Levels/Icon"
 import BiroScript from "@/components/TempDesignSystem/Text/BiroScript"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -84,9 +85,10 @@ async function LevelCard({ level }: LevelCardProps) {
             textAlign="center"
             color="textMediumContrast"
           >
-            <CheckIcon
+            <MaterialIcon
+              icon="check"
               className={styles.checkIcon}
-              color="primaryLightOnSurfaceAccent"
+              color="Icon/Interactive/Accent"
             />
             {reward.label}
           </Caption>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Overview/Buttons/CopyButton.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Overview/Buttons/CopyButton.tsx
index b157871f3..046268cd9 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Overview/Buttons/CopyButton.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Overview/Buttons/CopyButton.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import CopyIcon from "@/components/Icons/Copy"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import { toast } from "@/components/TempDesignSystem/Toasts"
 
@@ -33,7 +34,7 @@ export default function CopyButton({ membershipNumber }: CopyButtonProps) {
       size="small"
       intent="tertiary"
     >
-      <CopyIcon color="pale" />
+      <MaterialIcon icon="content_copy" color="CurrentColor" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/RewardValue/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/RewardValue/index.tsx
index e7efee15e..d858b9113 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/RewardValue/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/OverviewTable/RewardValue/index.tsx
@@ -1,6 +1,6 @@
 import { Minus } from "react-feather"
 
-import CheckCircle from "@/components/Icons/CheckCircle"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import styles from "./rewardValue.module.css"
 
@@ -11,7 +11,13 @@ export default function RewardValue({ reward }: RewardValueProps) {
     return <Minus color="var(--UI-Grey-40)" />
   }
   if (!reward.value) {
-    return <CheckCircle height={32} width={32} color="green" />
+    return (
+      <MaterialIcon
+        icon="check_circle"
+        size={32}
+        color="Icon/Feedback/Success"
+      />
+    )
   }
   return (
     <div className={styles.rewardValueContainer}>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/ActiveRedeemedBadge.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/ActiveRedeemedBadge.tsx
index 8ff056af3..6eb2740fd 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/ActiveRedeemedBadge.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/ActiveRedeemedBadge.tsx
@@ -3,7 +3,8 @@
 import { motion } from "framer-motion"
 import { useIntl } from "react-intl"
 
-import { CheckCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./redeem.module.css"
@@ -23,7 +24,7 @@ export default function ActiveRedeemedBadge() {
           ease: "easeInOut",
         }}
       >
-        <CheckCircleIcon color="uiSemanticSuccess" />
+        <MaterialIcon icon="check_circle" color="Icon/Feedback/Success" />
       </motion.div>
       <Caption>{intl.formatMessage({ id: "Active" })}</Caption>
     </div>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/Flows/Campaign.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/Flows/Campaign.tsx
index 88bf12c84..2eb555cfd 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/Flows/Campaign.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/Flows/Campaign.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import CopyIcon from "@/components/Icons/Copy"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -51,7 +52,7 @@ export default function Campaign({ reward }: { reward: Campaign }) {
           theme="base"
           intent="primary"
         >
-          <CopyIcon color="pale" />
+          <MaterialIcon icon="content_copy" color="CurrentColor" />
           {intl.formatMessage({ id: "Copy promotion code" })}
         </Button>
       </footer>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/TimedRedeemedBadge.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/TimedRedeemedBadge.tsx
index 67619cde0..142eb7c7b 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/TimedRedeemedBadge.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/TimedRedeemedBadge.tsx
@@ -2,10 +2,11 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
 import Countdown from "@/components/Countdown"
-import { CheckCircleIcon } from "@/components/Icons"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import useRedeemFlow from "./useRedeemFlow"
@@ -20,7 +21,7 @@ export default function TimedRedeemedBadge() {
   return (
     <>
       <div className={styles.redeemed}>
-        <CheckCircleIcon color="uiSemanticSuccess" />
+        <MaterialIcon icon="check_circle" color="Icon/Feedback/Success" />
         <Caption>
           {intl.formatMessage({
             id: "Redeemed & valid through:",
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/index.tsx
index 0510df93d..fd2cd6e4f 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/Redeem/index.tsx
@@ -10,9 +10,10 @@ import {
 } from "react-aria-components"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { trpc } from "@/lib/trpc/client"
 
-import { CloseLargeIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import useLang from "@/hooks/useLang"
 import { isRestaurantOnSiteTierReward } from "@/utils/rewards"
@@ -117,7 +118,7 @@ export default function Redeem({ reward, membershipNumber }: RedeemProps) {
                         type="button"
                         className={styles.modalClose}
                       >
-                        <CloseLargeIcon />
+                        <MaterialIcon icon="close" />
                       </button>
                     </header>
 
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/data.ts b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/data.ts
index 36d4823cf..a4dd753f8 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/data.ts
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/data.ts
@@ -1,11 +1,13 @@
+import { type IconProps } from "@scandic-hotels/design-system/Icons"
+
 import { REWARD_IDS } from "@/constants/rewards"
 
-import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
+import { IconName } from "@/components/Icons/iconName"
+import { IllustrationByIconName } from "@/components/Icons/IllustrationByIconName"
 import { isValidRewardId } from "@/utils/rewards"
 
 import type { FC } from "react"
 
-import { IconName, type IconProps } from "@/types/components/icon"
 import type { RewardId } from "@/types/components/myPages/rewards"
 
 function getIconForRewardId(rewardId: RewardId): IconName {
@@ -61,9 +63,9 @@ function getIconForRewardId(rewardId: RewardId): IconName {
 export function mapRewardToIcon(rewardId: string): FC<IconProps> | null {
   if (!isValidRewardId(rewardId)) {
     // TODO: Update once UX has decided on fallback icon.
-    return getIconByIconName(IconName.GiftOpen)
+    return IllustrationByIconName(IconName.GiftOpen)
   }
 
   const iconName = getIconForRewardId(rewardId)
-  return getIconByIconName(iconName)
+  return IllustrationByIconName(iconName)
 }
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/index.tsx
index 082d20f54..33dc8a236 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Rewards/RewardIcon/index.tsx
@@ -11,7 +11,7 @@ const sizeMap = {
 
 export function RewardIcon({
   rewardId,
-  size = "medium",
+  iconSize = "medium",
   ...props
 }: RewardIconProps) {
   const IconComponent = mapRewardToIcon(rewardId)
@@ -20,8 +20,8 @@ export function RewardIcon({
   return (
     <IconComponent
       {...props}
-      width={sizeMap[size].width}
-      height={sizeMap[size].height}
+      width={sizeMap[iconSize].width}
+      height={sizeMap[iconSize].height}
     />
   )
 }
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/UnlinkSAS.tsx b/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/UnlinkSAS.tsx
index 532073e56..dc7accfeb 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/UnlinkSAS.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/UnlinkSAS.tsx
@@ -3,8 +3,9 @@
 import { useParams } from "next/navigation"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Dialog from "@/components/Dialog"
-import { ChevronRightSmallIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 
 import type { LangParams } from "@/types/params"
@@ -27,7 +28,7 @@ export function UnlinkSAS() {
       trigger={
         <Button intent="text" theme="base">
           {intl.formatMessage({ id: "Unlink accounts" })}
-          <ChevronRightSmallIcon color="burgundy" />
+          <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
         </Button>
       }
     />
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/index.tsx
index c522a0a63..a5adbf842 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/SAS/LinkedAccounts/index.tsx
@@ -1,13 +1,16 @@
 import { cx } from "class-variance-authority"
 import { type ReactNode, Suspense } from "react"
 
+import {
+  DiamondAddIcon,
+  MaterialIcon,
+} from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { TIER_TO_FRIEND_MAP } from "@/constants/membershipLevels"
 import { env } from "@/env/server"
 import { getProfile } from "@/lib/trpc/memoizedRequests"
 
-import { DiamondIcon, InfoCircleIcon, LinkIcon } from "@/components/Icons"
 import SectionContainer from "@/components/Section/Container"
 import SectionHeader from "@/components/Section/Header"
 import SectionLink from "@/components/Section/Link"
@@ -56,7 +59,7 @@ export default async function SASLinkedAccount({
       <div className={styles.mutationSection}>
         <Typography variant="Body/Supporting text (caption)/smRegular">
           <p className={styles.caption}>
-            <InfoCircleIcon height={20} width={20} />
+            <MaterialIcon icon="info" size={20} />
             {intl.formatMessage({
               id: "Changes in tier match can take up to 24 hours to be displayed.",
             })}
@@ -207,13 +210,9 @@ async function TierMatchMessage({
   }
 
   const iconMap: Record<MatchState, ReactNode> = {
-    boostedBySAS: (
-      <DiamondIcon height={20} width={20} color="uiTextMediumContrast" />
-    ),
-    boostedByScandic: (
-      <DiamondIcon height={20} width={20} color="uiTextMediumContrast" />
-    ),
-    noBoost: <LinkIcon height={20} width={20} color="uiTextMediumContrast" />,
+    boostedBySAS: <DiamondAddIcon size={20} />,
+    boostedByScandic: <DiamondAddIcon size={20} />,
+    noBoost: <MaterialIcon icon="link" size={20} />,
   }
 
   return (
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsForm.tsx b/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsForm.tsx
index 01016282e..ea5ef8cdc 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsForm.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsForm.tsx
@@ -1,9 +1,8 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { getProfileSafely } from "@/lib/trpc/memoizedRequests"
 
-import ArrowFromIcon from "@/components/Icons/ArrowFrom"
-import ArrowToIcon from "@/components/Icons/ArrowTo"
 import Image from "@/components/Image"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import { getIntl } from "@/i18n"
@@ -77,7 +76,7 @@ async function TransferPointsFormContent({
                 <Typography variant="Tag/sm">
                   <p>{intl.formatMessage({ id: "Transfer from" })}</p>
                 </Typography>
-                <ArrowFromIcon />
+                <MaterialIcon icon="upload" />
               </div>
               <Typography variant="Title/Subtitle/md">
                 <p>{intl.formatMessage({ id: "SAS EuroBonus" })}</p>
@@ -117,7 +116,7 @@ async function TransferPointsFormContent({
           <div className={styles.transferTo}>
             <div>
               <div className={styles.labelWithIcon}>
-                <ArrowToIcon />
+                <MaterialIcon icon="download" />
                 <Typography variant="Tag/sm">
                   <p>{intl.formatMessage({ id: "Transfer to" })}</p>
                 </Typography>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsFormClient.tsx b/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsFormClient.tsx
index 63444af6f..c756b6e13 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsFormClient.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/SAS/TransferPoints/TransferPointsFormClient.tsx
@@ -15,10 +15,10 @@ import {
 import { FormProvider, useForm } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { SAS_TRANSFER_POINT_KEY } from "@/app/[lang]/(partner)/(sas)/(protected)/sas-x-scandic/sasUtils"
-import SwipeIcon from "@/components/Icons/Swipe"
 import Image from "@/components/Image"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
@@ -77,7 +77,7 @@ export function TransferPointsFormClient({
             <SliderFill />
             <SliderThumb className={styles.sliderThumb}>
               <SliderOutput className={styles.sliderOutput} />
-              <SwipeIcon color="white" />
+              <MaterialIcon icon="swipe" color="Icon/Inverted" />
             </SliderThumb>
           </SliderTrack>
         </Slider>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx
index 373d68254..2e87a8cea 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/ShowMoreButton/index.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import { ChevronDownIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 
 import styles from "./button.module.css"
@@ -24,7 +25,11 @@ export default function ShowMoreButton({
         theme="base"
         intent="text"
       >
-        <ChevronDownIcon width={20} height={20} />
+        <MaterialIcon
+          icon="keyboard_arrow_down"
+          size={20}
+          color="CurrentColor"
+        />
         {intl.formatMessage({ id: "Show more" })}
       </Button>
     </div>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx
index fee95429c..bb28d9d65 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/Soonest/EmptyUpcomingStays/index.tsx
@@ -1,7 +1,8 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { homeHrefs } from "@/constants/homeHrefs"
 import { env } from "@/env/server"
 
-import { ArrowRightIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import { getIntl } from "@/i18n"
@@ -33,7 +34,7 @@ export default async function EmptyUpcomingStaysBlock() {
         color="peach80"
       >
         {intl.formatMessage({ id: "Get inspired" })}
-        <ArrowRightIcon color="peach80" />
+        <MaterialIcon icon="arrow_forward" color="CurrentColor" />
       </Link>
     </section>
   )
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Stays/StayCard/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Stays/StayCard/index.tsx
index 59c768156..13ff1ad67 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/StayCard/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/StayCard/index.tsx
@@ -2,9 +2,10 @@
 
 import { useState } from "react"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
-import { CalendarIcon } from "@/components/Icons"
 import Image from "@/components/Image"
 import LoadingSpinner from "@/components/LoadingSpinner"
 import Link from "@/components/TempDesignSystem/Link"
@@ -51,7 +52,10 @@ export default function StayCard({ stay }: StayCardProps) {
             {hotelInformation.hotelName}
           </Title>
           <div className={styles.date}>
-            <CalendarIcon color="burgundy" height={24} width={24} />
+            <MaterialIcon
+              icon="calendar_month"
+              color="Icon/Interactive/Default"
+            />
             <Caption asChild>
               <time dateTime={arrivalDateTime}>{arrivalDate}</time>
             </Caption>
diff --git a/apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx b/apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx
index fee95429c..ead9793a7 100644
--- a/apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx
+++ b/apps/scandic-web/components/Blocks/DynamicContent/Stays/Upcoming/EmptyUpcomingStays/index.tsx
@@ -1,7 +1,8 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { homeHrefs } from "@/constants/homeHrefs"
 import { env } from "@/env/server"
 
-import { ArrowRightIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import { getIntl } from "@/i18n"
@@ -33,7 +34,8 @@ export default async function EmptyUpcomingStaysBlock() {
         color="peach80"
       >
         {intl.formatMessage({ id: "Get inspired" })}
-        <ArrowRightIcon color="peach80" />
+
+        <MaterialIcon color="CurrentColor" icon="arrow_forward" />
       </Link>
     </section>
   )
diff --git a/apps/scandic-web/components/Blocks/HotelListing/HotelListingItem/index.tsx b/apps/scandic-web/components/Blocks/HotelListing/HotelListingItem/index.tsx
index b7524347f..98ed4f074 100644
--- a/apps/scandic-web/components/Blocks/HotelListing/HotelListingItem/index.tsx
+++ b/apps/scandic-web/components/Blocks/HotelListing/HotelListingItem/index.tsx
@@ -1,4 +1,5 @@
-import HotelLogo from "@/components/Icons/Logos"
+import { HotelLogo } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
diff --git a/apps/scandic-web/components/Blocks/JoinScandicFriends/index.tsx b/apps/scandic-web/components/Blocks/JoinScandicFriends/index.tsx
index 6cc7514c6..1135c0566 100644
--- a/apps/scandic-web/components/Blocks/JoinScandicFriends/index.tsx
+++ b/apps/scandic-web/components/Blocks/JoinScandicFriends/index.tsx
@@ -1,5 +1,6 @@
+import { SurpriseIcon } from "@scandic-hotels/design-system/Icons"
+
 import { auth } from "@/auth"
-import { SurpriseIcon } from "@/components/Icons"
 import Image from "@/components/Image"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
diff --git a/apps/scandic-web/components/Blocks/ShortcutsList/ShortcutsListItems/index.tsx b/apps/scandic-web/components/Blocks/ShortcutsList/ShortcutsListItems/index.tsx
index 3abfe475d..73922e4a2 100644
--- a/apps/scandic-web/components/Blocks/ShortcutsList/ShortcutsListItems/index.tsx
+++ b/apps/scandic-web/components/Blocks/ShortcutsList/ShortcutsListItems/index.tsx
@@ -1,4 +1,5 @@
-import { ArrowRightIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
@@ -23,7 +24,7 @@ export default function ShortcutsListItems({
             <Body textTransform="bold" color="burgundy">
               <span>{shortcut.text || shortcut.title}</span>
             </Body>
-            <ArrowRightIcon color="burgundy" width={24} height={24} />
+            <MaterialIcon color="CurrentColor" icon="arrow_forward" />
           </Link>
         </li>
       ))}
diff --git a/apps/scandic-web/components/Blocks/UspGrid/index.tsx b/apps/scandic-web/components/Blocks/UspGrid/index.tsx
index 2f24f1117..4122dc8a9 100644
--- a/apps/scandic-web/components/Blocks/UspGrid/index.tsx
+++ b/apps/scandic-web/components/Blocks/UspGrid/index.tsx
@@ -1,4 +1,4 @@
-import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
+import { IconByIconName } from "@/components/Icons/IconByIconName"
 import JsonToHtml from "@/components/JsonToHtml"
 
 import { renderOptions } from "./renderOptions"
@@ -10,8 +10,9 @@ import type { UspGridProps, UspIcon } from "@/types/components/blocks/uspGrid"
 
 function UspIcon({ icon }: { icon: UspIcon }) {
   const iconName = getUspIconName(icon)
-  const Icon = iconName ? getIconByIconName(iconName) : null
-  return Icon ? <Icon color="red" /> : null
+  return iconName ? (
+    <IconByIconName iconName={iconName} color="Icon/Interactive/Accent" />
+  ) : null
 }
 
 export default function UspGrid({ usp_grid }: UspGridProps) {
diff --git a/apps/scandic-web/components/Blocks/UspGrid/utils.ts b/apps/scandic-web/components/Blocks/UspGrid/utils.ts
index 47d5ce76c..b6c064799 100644
--- a/apps/scandic-web/components/Blocks/UspGrid/utils.ts
+++ b/apps/scandic-web/components/Blocks/UspGrid/utils.ts
@@ -1,5 +1,6 @@
+import { IconName } from "@/components/Icons/iconName"
+
 import type { UspIcon } from "@/types/components/blocks/uspGrid"
-import { IconName } from "@/types/components/icon"
 
 export function getUspIconName(icon?: UspIcon | null) {
   switch (icon) {
diff --git a/apps/scandic-web/components/BookingWidget/Client.tsx b/apps/scandic-web/components/BookingWidget/Client.tsx
index ed2c258a0..6c0fdbf19 100644
--- a/apps/scandic-web/components/BookingWidget/Client.tsx
+++ b/apps/scandic-web/components/BookingWidget/Client.tsx
@@ -4,6 +4,8 @@ import { zodResolver } from "@hookform/resolvers/zod"
 import { use, useEffect, useRef, useState } from "react"
 import { FormProvider, useForm } from "react-hook-form"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { REDEMPTION } from "@/constants/booking"
 import { dt } from "@/lib/dt"
 import { trpc } from "@/lib/trpc/client"
@@ -13,7 +15,6 @@ import Form, {
   BookingWidgetFormSkeleton,
 } from "@/components/Forms/BookingWidget"
 import { bookingWidgetSchema } from "@/components/Forms/BookingWidget/schema"
-import { CloseLargeIcon } from "@/components/Icons"
 import useLang from "@/hooks/useLang"
 import useStickyPosition from "@/hooks/useStickyPosition"
 import { debounce } from "@/utils/debounce"
@@ -211,7 +212,7 @@ export default function BookingWidgetClient({
             onClick={closeMobileSearch}
             type="button"
           >
-            <CloseLargeIcon />
+            <MaterialIcon icon="close" />
           </button>
           <Form locations={locations} type={type} onClose={closeMobileSearch} />
         </div>
diff --git a/apps/scandic-web/components/BookingWidget/MobileToggleButton/index.tsx b/apps/scandic-web/components/BookingWidget/MobileToggleButton/index.tsx
index 779c0ea04..57950b27b 100644
--- a/apps/scandic-web/components/BookingWidget/MobileToggleButton/index.tsx
+++ b/apps/scandic-web/components/BookingWidget/MobileToggleButton/index.tsx
@@ -3,9 +3,10 @@
 import { useWatch } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
-import { EditIcon, SearchIcon } from "@/components/Icons"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -115,7 +116,7 @@ export default function MobileToggleButton({
             </Body>
           </div>
           <div className={styles.icon}>
-            <SearchIcon color="white" />
+            <MaterialIcon icon="search" color="Icon/Inverted" />
           </div>
         </>
       )}
@@ -139,7 +140,7 @@ export default function MobileToggleButton({
             </Caption>
           </div>
           <div className={styles.icon}>
-            <EditIcon color="white" />
+            <MaterialIcon icon="edit_square" color="Icon/Inverted" />
           </div>
         </>
       )}
@@ -169,7 +170,7 @@ export function MobileToggleButtonSkeleton() {
         <SkeletonShimmer height="24px" />
       </div>
       <div className={styles.icon}>
-        <SearchIcon color="white" />
+        <MaterialIcon icon="search" color="Icon/Inverted" />
       </div>
     </div>
   )
diff --git a/apps/scandic-web/components/Carousel/CarouselNavigation.tsx b/apps/scandic-web/components/Carousel/CarouselNavigation.tsx
index a367f13fc..125f36162 100644
--- a/apps/scandic-web/components/Carousel/CarouselNavigation.tsx
+++ b/apps/scandic-web/components/Carousel/CarouselNavigation.tsx
@@ -3,7 +3,7 @@
 import { cx } from "class-variance-authority"
 import { useIntl } from "react-intl"
 
-import { ArrowRightIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import { useCarousel } from "./CarouselContext"
 
@@ -25,7 +25,7 @@ export function CarouselPrevious({ className, ...props }: CarouselButtonProps) {
       aria-label={intl.formatMessage({ id: "Previous slide" })}
       {...props}
     >
-      <ArrowRightIcon color="burgundy" className={styles.prevIcon} />
+      <MaterialIcon color="Icon/Interactive/Default" icon="arrow_back" />
     </button>
   )
 }
@@ -44,7 +44,7 @@ export function CarouselNext({ className, ...props }: CarouselButtonProps) {
       aria-label={intl.formatMessage({ id: "Next slide" })}
       {...props}
     >
-      <ArrowRightIcon color="burgundy" />
+      <MaterialIcon color="Icon/Interactive/Default" icon="arrow_forward" />
     </button>
   )
 }
diff --git a/apps/scandic-web/components/Carousel/carousel.module.css b/apps/scandic-web/components/Carousel/carousel.module.css
index ef10b75a9..e6735b794 100644
--- a/apps/scandic-web/components/Carousel/carousel.module.css
+++ b/apps/scandic-web/components/Carousel/carousel.module.css
@@ -41,10 +41,6 @@
   right: -20px;
 }
 
-.prevIcon {
-  transform: rotate(180deg);
-}
-
 .dots {
   display: flex;
   justify-content: center;
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/index.tsx
index d80613eaf..f3670eb20 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationCityPage/CityMap/HotelListItem/index.tsx
@@ -4,11 +4,11 @@ import Link from "next/link"
 import { useCallback, useEffect, useRef } from "react"
 import { useIntl } from "react-intl"
 
+import { HotelLogo, TripadvisorIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useDestinationPageHotelsMapStore } from "@/stores/destination-page-hotels-map"
 
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
-import { TripAdvisorIcon } from "@/components/Icons"
-import HotelLogo from "@/components/Icons/Logos"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import ImageGallery from "@/components/ImageGallery"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
@@ -76,7 +76,7 @@ export default function HotelListItem({ hotel, url }: HotelListItemProps) {
         />
         {hotel.ratings?.tripAdvisor.rating && (
           <div className={styles.tripAdvisor}>
-            <TripAdvisorIcon color="burgundy" />
+            <TripadvisorIcon color="Icon/Interactive/Default" />
             <Caption color="burgundy">
               {hotel.ratings.tripAdvisor.rating}
             </Caption>
@@ -110,12 +110,12 @@ export default function HotelListItem({ hotel, url }: HotelListItemProps) {
         </div>
         <ul className={styles.amenityList}>
           {amenities.map((amenity) => {
-            const IconComponent = mapFacilityToIcon(amenity.id)
+            const Icon = (
+              <FacilityToIcon id={amenity.id} color="Icon/Default" size={20} />
+            )
             return (
               <li className={styles.amenityItem} key={amenity.id}>
-                {IconComponent && (
-                  <IconComponent color="grey80" width={20} height={20} />
-                )}
+                {Icon && Icon}
                 <span className={styles.amenityName}>{amenity.name}</span>
               </li>
             )
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx
index 6df3c2ef5..1dfcd02d6 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/DestinationOverviewPage/HotelsSection/DestinationsList/Destination/index.tsx
@@ -1,4 +1,5 @@
-import { ArrowRightIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -50,7 +51,7 @@ export default async function Destination({
               },
               { country: country }
             )}
-            <ArrowRightIcon color="burgundy" />
+            <MaterialIcon icon="arrow_forward" color="CurrentColor" />
           </Link>
         )}
       </div>
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/index.tsx
index 8c8f51b99..eaadf20fb 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/index.tsx
@@ -21,7 +21,7 @@ export default function ExperienceList({ experiences }: ExperienceListProps) {
       {experienceList.map(({ Icon, name }) => (
         <li key={name}>
           <Chip variant="tag">
-            <Icon width={20} height={20} />
+            <Icon size={20} />
             {name}
           </Chip>
         </li>
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/utils.ts b/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/utils.ts
deleted file mode 100644
index a29d38611..000000000
--- a/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/utils.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-import {
-  BikeIcon,
-  CityIcon,
-  FamilyIcon,
-  KayakingIcon,
-  MuseumIcon,
-  NightlifeIcon,
-  StarFilledIcon,
-} from "@/components/Icons"
-
-import type { FC } from "react"
-import type { IntlShape } from "react-intl"
-
-import type { IconProps } from "@/types/components/icon"
-
-export function mapExperiencesToListData(
-  experiences: string[],
-  intl: IntlShape
-): { Icon: FC<IconProps>; name: string }[] {
-  return experiences.map((experience) => {
-    switch (experience) {
-      case "Hiking":
-        return {
-          Icon: StarFilledIcon,
-          name: intl.formatMessage({ id: "Hiking" }),
-        }
-      case "Kayaking":
-        return {
-          Icon: KayakingIcon,
-          name: intl.formatMessage({ id: "Kayaking" }),
-        }
-      case "Bike friendly":
-        return {
-          Icon: BikeIcon,
-          name: intl.formatMessage({ id: "Bike friendly" }),
-        }
-      case "Museums":
-        return { Icon: MuseumIcon, name: intl.formatMessage({ id: "Museums" }) }
-      case "Family friendly":
-        return {
-          Icon: FamilyIcon,
-          name: intl.formatMessage({ id: "Family friendly" }),
-        }
-      case "City pulse":
-        return {
-          Icon: CityIcon,
-          name: intl.formatMessage({ id: "City pulse" }),
-        }
-      case "Nightlife":
-        return {
-          Icon: NightlifeIcon,
-          name: intl.formatMessage({ id: "Nightlife" }),
-        }
-      default:
-        return { Icon: StarFilledIcon, name: experience }
-    }
-  })
-}
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/utils.tsx b/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/utils.tsx
new file mode 100644
index 000000000..b8a32c291
--- /dev/null
+++ b/apps/scandic-web/components/ContentType/DestinationPage/ExperienceList/utils.tsx
@@ -0,0 +1,73 @@
+import {
+  MaterialIcon,
+  type MaterialIconSetIconProps,
+} from "@scandic-hotels/design-system/Icons"
+
+import type { FC } from "react"
+import type { IntlShape } from "react-intl"
+
+export function mapExperiencesToListData(
+  experiences: string[],
+  intl: IntlShape
+): { Icon: FC<MaterialIconSetIconProps>; name: string }[] {
+  return experiences.map((experience) => {
+    switch (experience) {
+      case "Hiking":
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="hiking" {...props} />
+          ),
+          name: intl.formatMessage({ id: "Hiking" }),
+        }
+      case "Kayaking":
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="kayaking" {...props} />
+          ),
+          name: intl.formatMessage({ id: "Kayaking" }),
+        }
+      case "Bike friendly":
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="pedal_bike" {...props} />
+          ),
+          name: intl.formatMessage({ id: "Bike friendly" }),
+        }
+      case "Museums":
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="museum" {...props} />
+          ),
+          name: intl.formatMessage({ id: "Museums" }),
+        }
+      case "Family friendly":
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="family_restroom" {...props} />
+          ),
+          name: intl.formatMessage({ id: "Family friendly" }),
+        }
+      case "City pulse":
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="location_city" {...props} />
+          ),
+          name: intl.formatMessage({ id: "City pulse" }),
+        }
+      case "Nightlife":
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="nightlife" {...props} />
+          ),
+          name: intl.formatMessage({ id: "Nightlife" }),
+        }
+      default:
+        return {
+          Icon: (props: MaterialIconSetIconProps) => (
+            <MaterialIcon icon="star" isFilled {...props} />
+          ),
+          name: experience,
+        }
+    }
+  })
+}
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/index.tsx
index e483683ad..0df2189d1 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/HotelListingItem/index.tsx
@@ -5,11 +5,15 @@ import { useParams } from "next/navigation"
 import { useEffect, useState } from "react"
 import { useIntl } from "react-intl"
 
+import {
+  HotelLogo,
+  MaterialIcon,
+  TripadvisorIcon,
+} from "@scandic-hotels/design-system/Icons"
+
 import { useDestinationPageHotelsMapStore } from "@/stores/destination-page-hotels-map"
 
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
-import { ChevronRightSmallIcon, TripAdvisorIcon } from "@/components/Icons"
-import HotelLogo from "@/components/Icons/Logos"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import ImageGallery from "@/components/ImageGallery"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
@@ -59,7 +63,7 @@ export default function HotelListingItem({
         />
         {hotel.ratings?.tripAdvisor.rating && (
           <div className={styles.tripAdvisor}>
-            <TripAdvisorIcon color="burgundy" />
+            <TripadvisorIcon color="Icon/Interactive/Default" />
             <Caption color="burgundy">
               {hotel.ratings.tripAdvisor.rating}
             </Caption>
@@ -92,12 +96,12 @@ export default function HotelListingItem({
         <Body>{hotel.hotelContent.texts.descriptions?.short}</Body>
         <ul className={styles.amenityList}>
           {amenities.map((amenity) => {
-            const IconComponent = mapFacilityToIcon(amenity.id)
+            const Icon = (
+              <FacilityToIcon id={amenity.id} color="Icon/Default" size={20} />
+            )
             return (
               <li className={styles.amenityItem} key={amenity.id}>
-                {IconComponent && (
-                  <IconComponent color="grey80" width={20} height={20} />
-                )}
+                {Icon && Icon}
                 {amenity.name}
               </li>
             )
@@ -111,7 +115,11 @@ export default function HotelListingItem({
               onClick={() => setActiveMarker(hotel.operaId)}
             >
               {intl.formatMessage({ id: "See on map" })}
-              <ChevronRightSmallIcon />
+              <MaterialIcon
+                icon="chevron_right"
+                size={20}
+                color="CurrentColor"
+              />
             </Link>
           </Button>
         )}
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/index.tsx
index 55bf835f4..f1997acb5 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelListing/index.tsx
@@ -5,10 +5,11 @@ import { useParams } from "next/navigation"
 import { useEffect, useRef, useState } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useDestinationDataStore } from "@/stores/destination-data"
 
 import DestinationFilterAndSort from "@/components/DestinationFilterAndSort"
-import { MapIcon } from "@/components/Icons"
 import Alert from "@/components/TempDesignSystem/Alert"
 import { BackToTopButton } from "@/components/TempDesignSystem/BackToTopButton"
 import Button from "@/components/TempDesignSystem/Button"
@@ -66,7 +67,7 @@ export default function HotelListing() {
               theme="base"
             >
               <Link href={mapUrl}>
-                <MapIcon />
+                <MaterialIcon icon="map" color="CurrentColor" />
                 {intl.formatMessage({ id: "See on map" })}
               </Link>
             </Button>
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/DialogImage/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/DialogImage/index.tsx
index 6f610e30f..5047315b8 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/DialogImage/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/DialogImage/index.tsx
@@ -1,4 +1,5 @@
-import { TripAdvisorIcon } from "@/components/Icons"
+import { TripadvisorIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Chip from "@/components/TempDesignSystem/Chip"
 
@@ -32,7 +33,7 @@ export default function DialogImage({
       )}
       <div className={styles.tripAdvisor}>
         <Chip className={styles.tripAdvisor}>
-          <TripAdvisorIcon color="burgundy" />
+          <TripadvisorIcon color="Icon/Interactive/Default" />
           {ratings}
         </Chip>
       </div>
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/index.tsx
index 8856f465c..a6f9e9149 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/HotelMapCard/index.tsx
@@ -3,14 +3,15 @@ import Link from "next/link"
 import { useState } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useDestinationPageHotelsMapStore } from "@/stores/destination-page-hotels-map"
 
-import CloseLargeIcon from "@/components/Icons/CloseLarge"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
 
-import { mapFacilityToIcon } from "../../HotelPage/data"
+import { FacilityToIcon } from "../../HotelPage/data"
 import { usePageType } from "../Map/PageTypeProvider"
 import DialogImage from "./DialogImage"
 
@@ -56,7 +57,12 @@ export default function HotelMapCard({
           onClick={handleClose}
           aria-label={intl.formatMessage({ id: "Close" })}
         >
-          <CloseLargeIcon className={styles.closeIcon} width={16} height={16} />
+          <MaterialIcon
+            icon="close"
+            size={16}
+            className={styles.closeIcon}
+            color="CurrentColor"
+          />
         </Button>
         {image ? (
           <DialogImage
@@ -84,12 +90,16 @@ export default function HotelMapCard({
             }
           >
             {amenities.map((facility) => {
-              const IconComponent = mapFacilityToIcon(facility.id)
+              const Icon = (
+                <FacilityToIcon
+                  id={facility.id}
+                  size={16}
+                  color="Icon/Default"
+                />
+              )
               return (
                 <div className={styles.facilitiesItem} key={facility.id}>
-                  {IconComponent && (
-                    <IconComponent width={16} height={16} color="grey80" />
-                  )}
+                  {Icon && Icon}
                   <Footnote
                     className={styles.iconFootnote}
                     color="uiTextMediumContrast"
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/Map/DynamicMap/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/Map/DynamicMap/index.tsx
index cdf25de3a..d427ff89a 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/Map/DynamicMap/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/Map/DynamicMap/index.tsx
@@ -6,10 +6,11 @@ import { Map, type MapProps, useMap } from "@vis.gl/react-google-maps"
 import { type PropsWithChildren, useEffect, useRef } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useDestinationPageHotelsMapStore } from "@/stores/destination-page-hotels-map"
 
 import ErrorBoundary from "@/components/ErrorBoundary/ErrorBoundary"
-import { CloseLargeIcon, MinusIcon, PlusIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import { useHandleKeyUp } from "@/hooks/useHandleKeyUp"
 
@@ -118,7 +119,7 @@ export default function DynamicMap({
             className={styles.closeButton}
             onClick={onClose}
           >
-            <CloseLargeIcon color="burgundy" />
+            <MaterialIcon icon="close" color="CurrentColor" />
             <span>{intl.formatMessage({ id: "Close the map" })}</span>
           </Button>
         )}
@@ -132,7 +133,7 @@ export default function DynamicMap({
             onClick={zoomIn}
             aria-label={intl.formatMessage({ id: "Zoom out" })}
           >
-            <PlusIcon color="burgundy" width={20} height={20} />
+            <MaterialIcon icon="add" color="CurrentColor" size={20} />
           </Button>
           <Button
             theme="base"
@@ -143,7 +144,7 @@ export default function DynamicMap({
             onClick={zoomOut}
             aria-label={intl.formatMessage({ id: "Zoom in" })}
           >
-            <MinusIcon color="burgundy" width={20} height={20} />
+            <MaterialIcon icon="remove" color="CurrentColor" size={20} />
           </Button>
         </div>
       </div>
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/Map/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/Map/index.tsx
index 8fdbe99c6..363feb9ad 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/Map/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/Map/index.tsx
@@ -12,11 +12,12 @@ import {
 import { Dialog, Modal } from "react-aria-components"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useDestinationDataStore } from "@/stores/destination-data"
 import { useDestinationPageHotelsMapStore } from "@/stores/destination-page-hotels-map"
 
 import DestinationFilterAndSort from "@/components/DestinationFilterAndSort"
-import { ChevronLeftSmallIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import { debounce } from "@/utils/debounce"
 
@@ -154,7 +155,11 @@ export default function Map({
                 variant="icon"
                 onClick={handleClose}
               >
-                <ChevronLeftSmallIcon color="baseTextHighcontrast" />
+                <MaterialIcon
+                  icon="chevron_left"
+                  size={20}
+                  color="CurrentColor"
+                />
                 {intl.formatMessage({ id: "Back" })}
               </Button>
               <DestinationFilterAndSort
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/Sidepeek/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/Sidepeek/index.tsx
index 5b23c08dd..0ac80dbc1 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/Sidepeek/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/Sidepeek/index.tsx
@@ -3,7 +3,8 @@
 import { useState } from "react"
 import { useIntl } from "react-intl"
 
-import { ChevronRightSmallIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import JsonToHtml from "@/components/JsonToHtml"
 import Button from "@/components/TempDesignSystem/Button"
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
@@ -45,7 +46,7 @@ export default function DestinationPageSidepeek({
         wrapping
       >
         {buttonText || intl.formatMessage({ id: "Read more" })}
-        <ChevronRightSmallIcon />
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
       </Button>
       <SidePeek
         title={heading}
diff --git a/apps/scandic-web/components/ContentType/DestinationPage/StaticMap/MapButton/index.tsx b/apps/scandic-web/components/ContentType/DestinationPage/StaticMap/MapButton/index.tsx
index 6baf5d569..f85c4e34d 100644
--- a/apps/scandic-web/components/ContentType/DestinationPage/StaticMap/MapButton/index.tsx
+++ b/apps/scandic-web/components/ContentType/DestinationPage/StaticMap/MapButton/index.tsx
@@ -5,7 +5,8 @@ import { useParams } from "next/navigation"
 import { useEffect, useState } from "react"
 import { useIntl } from "react-intl"
 
-import { MapIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 
 interface MapButtonProps {
@@ -37,7 +38,7 @@ export default function MapButton({ className = "" }: MapButtonProps) {
       asChild
     >
       <Link href={mapUrl} scroll={true}>
-        <MapIcon />
+        <MaterialIcon icon="map" color="CurrentColor" />
         {intl.formatMessage({ id: "See on map" })}
       </Link>
     </Button>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx
index 6cc93f62f..7d5196168 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/AmenitiesList/index.tsx
@@ -1,7 +1,7 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
-import { ChevronRightSmallIcon } from "@/components/Icons"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import Link from "@/components/TempDesignSystem/Link"
 import { getIntl } from "@/i18n"
 
@@ -23,17 +23,17 @@ export default async function AmenitiesList({
       </Typography>
       <div className={styles.amenityItemList}>
         {facilities.map((facility) => {
-          const IconComponent = mapFacilityToIcon(facility.id)
+          const Icon = (
+            <FacilityToIcon
+              id={facility.id}
+              className={styles.icon}
+              color="Icon/Feedback/Neutral"
+              size={20}
+            />
+          )
           return (
             <div className={styles.amenityItem} key={facility.id}>
-              {IconComponent && (
-                <IconComponent
-                  className={styles.icon}
-                  color="grey80"
-                  width={20}
-                  height={20}
-                />
-              )}
+              {Icon && Icon}
               <Typography
                 variant="Body/Paragraph/mdRegular"
                 className={styles.facility}
@@ -53,7 +53,7 @@ export default async function AmenitiesList({
         className={styles.showAllAmenities}
       >
         {intl.formatMessage({ id: "See all amenities" })}
-        <ChevronRightSmallIcon color="burgundy" />
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
       </Link>
     </section>
   )
diff --git a/apps/scandic-web/components/ContentType/HotelPage/IntroSection/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/IntroSection/index.tsx
index f0c8672b3..83068d431 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/IntroSection/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/IntroSection/index.tsx
@@ -1,6 +1,9 @@
+import {
+  MaterialIcon,
+  TripadvisorIcon,
+} from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import { ChevronRightSmallIcon, TripAdvisorIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import { getIntl } from "@/i18n"
 import { getSingleDecimal } from "@/utils/numberFormatting"
@@ -54,7 +57,7 @@ export default async function IntroSection({
         </Typography>
         {formattedTripAdvisorText && (
           <span className={styles.tripAdvisorText}>
-            <TripAdvisorIcon />
+            <TripadvisorIcon color="Icon/Interactive/Secondary" />
             {formattedTripAdvisorText}
           </span>
         )}
@@ -72,7 +75,12 @@ export default async function IntroSection({
           scroll={false}
         >
           {intl.formatMessage({ id: "Read more" })}
-          <ChevronRightSmallIcon color="burgundy" />
+          <MaterialIcon
+            icon="chevron_right"
+            size={20}
+            color="CurrentColor"
+            className={styles.introLink}
+          />
         </Link>
       </div>
     </section>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/Map/DynamicMap/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/Map/DynamicMap/index.tsx
index 4976246b7..55d5e7a35 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/Map/DynamicMap/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/Map/DynamicMap/index.tsx
@@ -5,7 +5,8 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react"
 import { Dialog, Modal } from "react-aria-components"
 import { useIntl } from "react-intl"
 
-import CloseLargeIcon from "@/components/Icons/CloseLarge"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import InteractiveMap from "@/components/Maps/InteractiveMap"
 import Button from "@/components/TempDesignSystem/Button"
 import { debounce } from "@/utils/debounce"
@@ -92,7 +93,7 @@ export default function DynamicMap({
       className={styles.closeButton}
       onClick={handleClose}
     >
-      <CloseLargeIcon color="burgundy" />
+      <MaterialIcon icon="close" color="CurrentColor" />
       <span>{intl.formatMessage({ id: "Close the map" })}</span>
     </Button>
   )
diff --git a/apps/scandic-web/components/ContentType/HotelPage/Map/MobileMapToggle/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/Map/MobileMapToggle/index.tsx
index 635f85e66..05d0ddadf 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/Map/MobileMapToggle/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/Map/MobileMapToggle/index.tsx
@@ -4,9 +4,9 @@ import { useParams, useSearchParams } from "next/navigation"
 import { useEffect, useMemo, useState } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import { HouseIcon, MapIcon } from "@/components/Icons"
 import { trackHotelMapClick } from "@/utils/tracking"
 
 import styles from "./mobileToggle.module.css"
@@ -36,10 +36,9 @@ export default function MobileMapToggle() {
       <span
         className={`${styles.iconWrapper} ${!isMapView ? styles.active : ""}`}
       >
-        <HouseIcon
-          color={!isMapView ? "white" : "red"}
-          height={24}
-          width={24}
+        <MaterialIcon
+          icon="home"
+          color={!isMapView ? "Icon/Inverted" : "Icon/Accent"}
         />
         <Typography variant="Body/Supporting text (caption)/smBold">
           <span>{intl.formatMessage({ id: "Hotel" })}</span>
@@ -54,7 +53,10 @@ export default function MobileMapToggle() {
           scroll={true}
           onClick={trackHotelMapClick}
         >
-          <MapIcon color={isMapView ? "white" : "red"} height={24} width={24} />
+          <MaterialIcon
+            icon="map"
+            color={isMapView ? "Icon/Inverted" : "Icon/Interactive/Accent"}
+          />
           <Typography variant="Body/Supporting text (caption)/smBold">
             <span>{intl.formatMessage({ id: "Map" })}</span>
           </Typography>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/Rooms/RoomCard/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/Rooms/RoomCard/index.tsx
index 947a5bfdc..4131ace2f 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/Rooms/RoomCard/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/Rooms/RoomCard/index.tsx
@@ -3,7 +3,8 @@
 import Link from "next/link"
 import { useIntl } from "react-intl"
 
-import { ChevronRightSmallIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import ImageGallery from "@/components/ImageGallery"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -66,7 +67,7 @@ export function RoomCard({ room }: RoomCardProps) {
         <Button intent="text" type="button" size="medium" theme="base" asChild>
           <Link scroll={false} href={`#s-room-${getRoomNameAsParam(name)}`}>
             {intl.formatMessage({ id: "See room details" })}
-            <ChevronRightSmallIcon color="burgundy" width={20} height={20} />
+            <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
           </Link>
         </Button>
       </div>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/Rooms/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/Rooms/index.tsx
index 8c2443ffc..7308ca1b3 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/Rooms/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/Rooms/index.tsx
@@ -62,12 +62,6 @@ export function Rooms({ rooms, preamble }: RoomsProps) {
         <ShowMoreButton
           loadMoreData={handleShowMore}
           showLess={allRoomsVisible}
-          textShowMore={intl.formatMessage({
-            id: "Show more",
-          })}
-          textShowLess={intl.formatMessage({
-            id: "Show less",
-          })}
         />
       ) : null}
     </SectionContainer>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx
index 74f6ff9e6..65f76202a 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/AboutTheHotel/ContactInformation/index.tsx
@@ -1,4 +1,8 @@
-import { FacebookIcon, InstagramIcon } from "@/components/Icons"
+import {
+  FacebookIcon,
+  InstagramIcon,
+} from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -81,12 +85,12 @@ export default async function ContactInformation({
           <div className={styles.socialIcons}>
             {socials.instagram && (
               <Link href={socials.instagram}>
-                <InstagramIcon color="burgundy" />
+                <InstagramIcon color="Icon/Interactive/Default" />
               </Link>
             )}
             {socials.facebook && (
               <Link href={socials.facebook}>
-                <FacebookIcon color="burgundy" />
+                <FacebookIcon color="Icon/Interactive/Default" />
               </Link>
             )}
           </div>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Accessibility/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Accessibility/index.tsx
index 8a5d11418..e8f2e885a 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Accessibility/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Accessibility/index.tsx
@@ -1,4 +1,7 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import ButtonLink from "@/components/ButtonLink"
+import { IconName } from "@/components/Icons/iconName"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import { getIntl } from "@/i18n"
@@ -6,7 +9,6 @@ import { getIntl } from "@/i18n"
 import styles from "./accessibilityAmenity.module.css"
 
 import type { AccessibilityAmenityProps } from "@/types/components/hotelPage/sidepeek/accessibility"
-import { IconName } from "@/types/components/icon"
 
 export default async function AccessibilityAmenity({
   elevatorPitch,
@@ -32,6 +34,8 @@ export default async function AccessibilityAmenity({
             appendToCurrentPath
           >
             {intl.formatMessage({ id: "About accessibility" })}
+
+            <MaterialIcon icon="arrow_forward" color="CurrentColor" />
           </ButtonLink>
         )}
       </div>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Breakfast/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Breakfast/index.tsx
index cff521b52..0bd9c2ce2 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Breakfast/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Breakfast/index.tsx
@@ -1,10 +1,10 @@
+import { IconName } from "@/components/Icons/iconName"
 import OpeningHours from "@/components/OpeningHours"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import { getIntl } from "@/i18n"
 
 import type { BreakfastAmenityProps } from "@/types/components/hotelPage/sidepeek/amenities"
-import { IconName } from "@/types/components/icon"
 import { HotelTypeEnum } from "@/types/enums/hotelType"
 
 export default async function BreakfastAmenity({
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/CheckIn/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/CheckIn/index.tsx
index 05a67140e..3f4af708b 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/CheckIn/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/CheckIn/index.tsx
@@ -1,9 +1,9 @@
+import { IconName } from "@/components/Icons/iconName"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import { getIntl } from "@/i18n"
 
 import type { CheckInAmenityProps } from "@/types/components/hotelPage/sidepeek/checkIn"
-import { IconName } from "@/types/components/icon"
 
 export default async function CheckInAmenity({
   checkInInformation,
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Parking/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Parking/index.tsx
index d55b4b3ba..b6d02a6cb 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Parking/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/AccordionAmenities/Parking/index.tsx
@@ -1,4 +1,5 @@
 import ButtonLink from "@/components/ButtonLink"
+import { IconName } from "@/components/Icons/iconName"
 import ParkingInformation from "@/components/ParkingInformation"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import { getIntl } from "@/i18n"
@@ -6,7 +7,6 @@ import { getIntl } from "@/i18n"
 import styles from "./parkingAmenity.module.css"
 
 import type { ParkingAmenityProps } from "@/types/components/hotelPage/sidepeek/parking"
-import { IconName } from "@/types/components/icon"
 
 export default async function ParkingAmenity({
   parking,
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/filteredAmenities.module.css b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/filteredAmenities.module.css
index 81dc4f43b..ab3adb722 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/filteredAmenities.module.css
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/filteredAmenities.module.css
@@ -7,4 +7,5 @@
   display: flex;
   gap: var(--Spacing-x1);
   padding: var(--Spacing-x-one-and-half) var(--Spacing-x1);
+  align-items: center;
 }
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/index.tsx
index 92df26178..d8a8b82c4 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Amenities/FilteredAmenities/index.tsx
@@ -1,7 +1,8 @@
-import { HeartIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 
-import { mapFacilityToIcon } from "../../../data"
+import { FacilityToIcon } from "../../../data"
 
 import styles from "./filteredAmenities.module.css"
 
@@ -13,14 +14,23 @@ export default function FilteredAmenities({
   return (
     <>
       {filteredAmenities?.map((amenity) => {
-        const Icon = mapFacilityToIcon(amenity.id)
+        const Icon = (
+          <FacilityToIcon
+            id={amenity.id}
+            color="Icon/Interactive/Default"
+            size={24}
+          />
+        )
         return (
           <li key={amenity.name} className={styles.wrapper}>
             <div className={styles.amenity}>
               {Icon ? (
-                <Icon color="burgundy" width={24} height={24} />
+                Icon
               ) : (
-                <HeartIcon color="burgundy" width={24} height={24} />
+                <MaterialIcon
+                  icon="favorite"
+                  color="Icon/Interactive/Default"
+                />
               )}
               <Subtitle color="burgundy" type="two">
                 {amenity.name}
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx
index 5d3b0c09d..c77711585 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/RestaurantBar/RestaurantBarItem/index.tsx
@@ -1,7 +1,8 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import ButtonLink from "@/components/ButtonLink"
-import { OpenInNewSmallIcon } from "@/components/Icons"
 import Image from "@/components/Image"
 import OpeningHours from "@/components/OpeningHours"
 import Link from "@/components/TempDesignSystem/Link"
@@ -85,7 +86,11 @@ export default async function RestaurantBarItem({
                   color="baseTextMediumContrast"
                 >
                   {name}
-                  <OpenInNewSmallIcon />
+                  <MaterialIcon
+                    icon="open_in_new"
+                    size={20}
+                    color="CurrentColor"
+                  />
                 </Link>
               </li>
             ))}
diff --git a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Room/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Room/index.tsx
index c03b34191..8387a1a64 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Room/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelPage/SidePeeks/Room/index.tsx
@@ -1,14 +1,15 @@
 import { cx } from "class-variance-authority"
 import Link from "next/link"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { selectRateWithParams } from "@/constants/routes/hotelReservation"
 import { dt } from "@/lib/dt"
 
 import ImageGallery from "@/components/ImageGallery"
-import { getBedIcon } from "@/components/SidePeeks/RoomSidePeek/bedIcon"
-import { getFacilityIcon } from "@/components/SidePeeks/RoomSidePeek/facilityIcon"
+import { getBedIconName } from "@/components/SidePeeks/RoomSidePeek/bedIcon"
+import { FacilityIcon } from "@/components/SidePeeks/RoomSidePeek/facilityIcon"
 import Button from "@/components/TempDesignSystem/Button"
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
 import { getIntl } from "@/i18n"
@@ -97,16 +98,16 @@ export default async function RoomSidePeek({
             {room.roomFacilities
               .sort((a, b) => a.sortOrder - b.sortOrder)
               .map((facility) => {
-                const Icon = getFacilityIcon(facility.icon)
+                const Icon = (
+                  <FacilityIcon
+                    name={facility.icon}
+                    size={24}
+                    color="Icon/Default"
+                  />
+                )
                 return (
                   <li className={styles.listItem} key={facility.name}>
-                    {Icon && (
-                      <Icon
-                        width={24}
-                        height={24}
-                        color="uiTextMediumContrast"
-                      />
-                    )}
+                    {Icon && Icon}
                     <Typography
                       variant="Body/Paragraph/mdRegular"
                       className={cx(styles.iconText, {
@@ -132,20 +133,14 @@ export default async function RoomSidePeek({
           </div>
           <ul className={styles.bedOptions}>
             {room.roomTypes.map((roomType) => {
-              const BedIcon = getBedIcon(roomType.mainBed.type)
+              const bedIcon = getBedIconName(roomType.mainBed.type)
               return (
                 <li className={styles.listItem} key={roomType.code}>
-                  {BedIcon && (
-                    <BedIcon
-                      color="uiTextMediumContrast"
-                      width={24}
-                      height={24}
-                    />
-                  )}
+                  <MaterialIcon color="Icon/Default" icon={bedIcon} />
                   <Typography
                     variant="Body/Paragraph/mdRegular"
                     className={cx(styles.iconText, {
-                      [styles.noIcon]: !BedIcon,
+                      [styles.noIcon]: !bedIcon,
                     })}
                   >
                     <span>{roomType.mainBed.description}</span>
diff --git a/apps/scandic-web/components/ContentType/HotelPage/data.ts b/apps/scandic-web/components/ContentType/HotelPage/data.tsx
similarity index 71%
rename from apps/scandic-web/components/ContentType/HotelPage/data.ts
rename to apps/scandic-web/components/ContentType/HotelPage/data.tsx
index e58c73ab5..61b56dfa0 100644
--- a/apps/scandic-web/components/ContentType/HotelPage/data.ts
+++ b/apps/scandic-web/components/ContentType/HotelPage/data.tsx
@@ -1,69 +1,15 @@
-import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
+import { IconByIconName } from "@/components/Icons/IconByIconName"
+import { IconName } from "@/components/Icons/iconName"
 
-import type { FC } from "react"
+import type {
+  IconProps,
+  MaterialIconSetIconProps,
+  NucleoIconProps,
+} from "@scandic-hotels/design-system/Icons"
 
-import { IconName, type IconProps } from "@/types/components/icon"
 import { FacilityEnum } from "@/types/enums/facilities"
 
 const facilityToIconMap: Record<FacilityEnum, IconName> = {
-  [FacilityEnum.Bar]: IconName.LocalBar,
-  [FacilityEnum.Skybar]: IconName.LocalBar,
-  [FacilityEnum.RooftopBar]: IconName.LocalBar,
-  [FacilityEnum.BikesForLoan]: IconName.Biking,
-  [FacilityEnum.Gym]: IconName.Fitness,
-  [FacilityEnum.GymTrainingFacilities]: IconName.Fitness,
-  [FacilityEnum.KeyAccessOnlyToHealthClubGym]: IconName.Fitness,
-  [FacilityEnum.FreeWiFi]: IconName.Wifi,
-  [FacilityEnum.MeetingArea]: IconName.Business,
-  [FacilityEnum.MeetingRooms]: IconName.Business,
-  [FacilityEnum.MeetingConferenceFacilities]: IconName.Business,
-  [FacilityEnum.PetFriendlyRooms]: IconName.Pets,
-  [FacilityEnum.Sauna]: IconName.Sauna,
-  [FacilityEnum.Restaurant]: IconName.Restaurant,
-  [FacilityEnum.ParkingGarage]: IconName.Garage,
-  [FacilityEnum.ParkingElectricCharging]: IconName.ElectricCar,
-  [FacilityEnum.ParkingFreeParking]: IconName.Parking,
-  [FacilityEnum.ParkingOutdoor]: IconName.Parking,
-  [FacilityEnum.ParkingAdditionalCost]: IconName.Parking,
-  [FacilityEnum.DisabledParking]: IconName.Parking,
-  [FacilityEnum.OutdoorTerrace]: IconName.OutdoorFurniture,
-  [FacilityEnum.RoomService]: IconName.RoomService,
-  [FacilityEnum.LateCheckOutUntil1400Guaranteed]: IconName.Business,
-  [FacilityEnum.LaundryRoom]: IconName.LaundryMachine,
-  [FacilityEnum.LaundryService]: IconName.LaundryMachine,
-  [FacilityEnum.LaundryServiceExpress]: IconName.LaundryMachine,
-  [FacilityEnum.ScandicShop24Hrs]: IconName.ConvenienceStore24h,
-  [FacilityEnum.ServesBreakfastAlwaysIncluded]: IconName.CoffeeAlt,
-  [FacilityEnum.ServesBreakfastNotAlwaysIncluded]: IconName.CoffeeAlt,
-  [FacilityEnum.ServesOrganicBreakfastAlwaysIncluded]: IconName.CoffeeAlt,
-  [FacilityEnum.ServesOrganicBreakfastNotAlwaysIncluded]: IconName.CoffeeAlt,
-  [FacilityEnum.Breakfast]: IconName.CoffeeAlt,
-  [FacilityEnum.EBikesChargingStation]: IconName.ElectricBike,
-  [FacilityEnum.Shopping]: IconName.Shopping,
-  [FacilityEnum.Golf]: IconName.Golf,
-  [FacilityEnum.GolfCourse0To30Km]: IconName.Golf,
-  [FacilityEnum.TVWithChromecast1]: IconName.TvCasting,
-  [FacilityEnum.TVWithChromecast2]: IconName.TvCasting,
-  [FacilityEnum.DJLiveMusic]: IconName.Nightlife,
-  [FacilityEnum.DiscoNightClub]: IconName.Nightlife,
-  [FacilityEnum.CoffeeInReceptionAtCharge]: IconName.CoffeeAlt,
-  [FacilityEnum.CoffeeShop]: IconName.CoffeeAlt,
-  [FacilityEnum.CoffeeTeaFacilities]: IconName.CoffeeAlt,
-  [FacilityEnum.SkateboardsForLoan]: IconName.Skateboarding,
-  [FacilityEnum.KayaksForLoan]: IconName.Kayaking,
-  [FacilityEnum.LifestyleConcierge]: IconName.Concierge,
-  [FacilityEnum.WellnessAndSaunaEntranceFeeAdmission16PlusYears]:
-    IconName.Sauna,
-  [FacilityEnum.WellnessPoolSaunaEntranceFeeAdmission16PlusYears]:
-    IconName.Sauna,
-  [FacilityEnum.Cafe]: IconName.Restaurant,
-  [FacilityEnum.Pool]: IconName.Swim,
-  [FacilityEnum.PoolSwimmingPoolJacuzziAtHotel]: IconName.Swim,
-  [FacilityEnum.VendingMachineWithNecessities]: IconName.Groceries,
-
-  [FacilityEnum.Jacuzzi]: IconName.StarFilled,
-  [FacilityEnum.JacuzziInRoom]: IconName.StarFilled,
-
   [FacilityEnum.AccessibleBathingControls]: IconName.StarFilled,
   [FacilityEnum.AccessibleBathtubs]: IconName.StarFilled,
   [FacilityEnum.AccessibleElevators]: IconName.StarFilled,
@@ -73,10 +19,10 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.AccessibleToilets]: IconName.StarFilled,
   [FacilityEnum.AccessibleWashBasins]: IconName.StarFilled,
   [FacilityEnum.AdaptedRoomDoors]: IconName.StarFilled,
-  [FacilityEnum.AdjoiningConventionCentre]: IconName.StarFilled,
-  [FacilityEnum.AirConAirCooling]: IconName.StarFilled,
-  [FacilityEnum.AirConditioningInRoom]: IconName.StarFilled,
-  [FacilityEnum.AirportMaxDistance8Km]: IconName.StarFilled,
+  [FacilityEnum.AdjoiningConventionCentre]: IconName.ConventionCentre,
+  [FacilityEnum.AirConAirCooling]: IconName.AirConAirCooling,
+  [FacilityEnum.AirConditioningInRoom]: IconName.AirConditioningInRoom,
+  [FacilityEnum.AirportMaxDistance8Km]: IconName.Airplane,
   [FacilityEnum.AlarmsContinuouslyMonitored]: IconName.StarFilled,
   [FacilityEnum.AlarmsHaveStrobeLightsForDeafHardHearingInAllGuestRooms]:
     IconName.StarFilled,
@@ -92,7 +38,7 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.AllParkingAreasPatrolled]: IconName.StarFilled,
   [FacilityEnum.AllParkingAreasWellLit]: IconName.StarFilled,
   [FacilityEnum.AllStairsWellsVentilated]: IconName.StarFilled,
-  [FacilityEnum.ArmchairBed]: IconName.StarFilled,
+  [FacilityEnum.ArmchairBed]: IconName.ArmChair,
   [FacilityEnum.AudibleAlarms]: IconName.StarFilled,
   [FacilityEnum.AudibleSmokeAlarmsInAllHalls]: IconName.StarFilled,
   [FacilityEnum.AudibleSmokeAlarmsInAllPublicAreas]: IconName.StarFilled,
@@ -105,41 +51,53 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.BalconiesAccessibleToAdjoiningRooms]: IconName.StarFilled,
   [FacilityEnum.Ballroom]: IconName.StarFilled,
   [FacilityEnum.Banquet]: IconName.StarFilled,
+  [FacilityEnum.Bar]: IconName.LocalBar,
   [FacilityEnum.BasicMedicalEquipmentOnSite]: IconName.StarFilled,
   [FacilityEnum.BathroomsAdaptedForDisabledGuests]: IconName.StarFilled,
-  [FacilityEnum.Beach]: IconName.StarFilled,
-  [FacilityEnum.Beach0To1Km]: IconName.StarFilled,
-  [FacilityEnum.BeautySalon]: IconName.StarFilled,
+  [FacilityEnum.Beach]: IconName.Beach,
+  [FacilityEnum.Beach0To1Km]: IconName.Beach,
+  [FacilityEnum.BeautySalon]: IconName.BeautySalon,
   [FacilityEnum.BedroomsWithWheelchairAccess]: IconName.StarFilled,
-  [FacilityEnum.Bowling]: IconName.StarFilled,
+  [FacilityEnum.BikesForLoan]: IconName.Bike,
+  [FacilityEnum.Bowling]: IconName.Bowling,
   [FacilityEnum.BrailleLargePrintHotelLiterature]: IconName.StarFilled,
   [FacilityEnum.BrailleLargePrintMenus]: IconName.StarFilled,
-  [FacilityEnum.Business1]: IconName.StarFilled,
-  [FacilityEnum.Business2]: IconName.StarFilled,
-  [FacilityEnum.BusinessCentre]: IconName.StarFilled,
-  [FacilityEnum.CashFree8pmTill6am]: IconName.StarFilled,
-  [FacilityEnum.CashFreeHotel]: IconName.StarFilled,
+  [FacilityEnum.Breakfast]: IconName.Breakfast,
+  [FacilityEnum.Business1]: IconName.BusinessCentre,
+  [FacilityEnum.Business2]: IconName.BusinessCentre,
+  [FacilityEnum.BusinessCentre]: IconName.BusinessCentre,
+  [FacilityEnum.Cafe]: IconName.Restaurant,
+  [FacilityEnum.CashFree8pmTill6am]: IconName.CashFree,
+  [FacilityEnum.CashFreeHotel]: IconName.CashFree,
   [FacilityEnum.ChildrenWelcome]: IconName.StarFilled,
-  [FacilityEnum.City]: IconName.StarFilled,
+  [FacilityEnum.City]: IconName.City,
+  [FacilityEnum.CoffeeInReceptionAtCharge]: IconName.CoffeeInReceptionAtCharge,
+  [FacilityEnum.CoffeeShop]: IconName.CoffeeShop,
+  [FacilityEnum.CoffeeTeaFacilities]: IconName.CoffeeAlt,
   [FacilityEnum.ColourTVInRoomsAllScandicHotels]: IconName.StarFilled,
-  [FacilityEnum.ComplimentaryColdRefreshments]: IconName.StarFilled,
+  [FacilityEnum.ComplimentaryColdRefreshments]:
+    IconName.ComplimentaryColdRefreshments,
   [FacilityEnum.CongressHall]: IconName.StarFilled,
-  [FacilityEnum.ConventionCentre]: IconName.StarFilled,
+  [FacilityEnum.ConventionCentre]: IconName.ConventionCentre,
   [FacilityEnum.Couples]: IconName.StarFilled,
   [FacilityEnum.DeadboltsOnConnectingDoors]: IconName.StarFilled,
   [FacilityEnum.DeadboltsSecondaryLocksOnAllGuestRoomDoors]:
     IconName.StarFilled,
   [FacilityEnum.Defibrillator]: IconName.StarFilled,
-  [FacilityEnum.Desk]: IconName.StarFilled,
-  [FacilityEnum.DirectDialPhoneInRoomsAllScandic]: IconName.StarFilled,
+  [FacilityEnum.Desk]: IconName.Desk,
+  [FacilityEnum.DirectDialPhoneInRoomsAllScandic]: IconName.DirectDial,
   [FacilityEnum.DisabledEmergencyPlan1]: IconName.StarFilled,
   [FacilityEnum.DisabledEmergencyPlan2]: IconName.StarFilled,
+  [FacilityEnum.DisabledParking]: IconName.Wheelchair,
+  [FacilityEnum.DiscoNightClub]: IconName.Nightlife,
+  [FacilityEnum.DJLiveMusic]: IconName.Nightlife,
   [FacilityEnum.DO_NOT_USE_Restaurant]: IconName.StarFilled,
   [FacilityEnum.Downtown]: IconName.StarFilled,
   [FacilityEnum.DrinkableTapWater]: IconName.StarFilled,
   [FacilityEnum.DVDPlayer]: IconName.StarFilled,
+  [FacilityEnum.EBikesChargingStation]: IconName.ElectricBike,
   [FacilityEnum.ElectronicKeyCards]: IconName.StarFilled,
-  [FacilityEnum.Elevator]: IconName.StarFilled,
+  [FacilityEnum.Elevator]: IconName.Elevator,
   [FacilityEnum.EmergencyBackUpGenerators]: IconName.StarFilled,
   [FacilityEnum.EmergencyCallButtonOnPhone]: IconName.StarFilled,
   [FacilityEnum.EmergencyCodesOrButtonsInRooms]: IconName.StarFilled,
@@ -150,14 +108,14 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.EmergencyLightingAllScandic]: IconName.StarFilled,
   [FacilityEnum.EmergencyLightningInAllPublicAreas]: IconName.StarFilled,
   [FacilityEnum.EmergencyServiceResponseTimeInMinutes]: IconName.StarFilled,
-  [FacilityEnum.Entertainment]: IconName.StarFilled,
+  [FacilityEnum.Entertainment]: IconName.Theatre,
   [FacilityEnum.EventVenue]: IconName.StarFilled,
   [FacilityEnum.ExchangeFacility]: IconName.StarFilled,
   [FacilityEnum.ExitMapsInRooms]: IconName.StarFilled,
   [FacilityEnum.ExitSignsLit]: IconName.StarFilled,
-  [FacilityEnum.ExtraFamilyFriendly]: IconName.StarFilled,
-  [FacilityEnum.Families]: IconName.StarFilled,
-  [FacilityEnum.FaxFacilityInRoom]: IconName.StarFilled,
+  [FacilityEnum.ExtraFamilyFriendly]: IconName.ExtraFamilyFriendly,
+  [FacilityEnum.Families]: IconName.ExtraFamilyFriendly,
+  [FacilityEnum.FaxFacilityInRoom]: IconName.Fax,
   [FacilityEnum.Financial]: IconName.StarFilled,
   [FacilityEnum.FireDetectorsAllScandic]: IconName.StarFilled,
   [FacilityEnum.FireDetectorsInAllHalls]: IconName.StarFilled,
@@ -167,24 +125,29 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.FireExtinguishersInPublicAreasAllScandic]: IconName.StarFilled,
   [FacilityEnum.FireSafetyAllScandic]: IconName.StarFilled,
   [FacilityEnum.FirstAidAvailable]: IconName.StarFilled,
-  [FacilityEnum.FoodDrinks247]: IconName.StarFilled,
-  [FacilityEnum.GiftShop]: IconName.StarFilled,
+  [FacilityEnum.FoodDrinks247]: IconName.FoodDrinks247,
+  [FacilityEnum.FreeWiFi]: IconName.Wifi,
+  [FacilityEnum.GiftShop]: IconName.Gift,
+  [FacilityEnum.Golf]: IconName.Golf,
+  [FacilityEnum.GolfCourse0To30Km]: IconName.Golf,
   [FacilityEnum.GuestRoomDoorsHaveASecondLock]: IconName.StarFilled,
-  [FacilityEnum.Hairdresser]: IconName.StarFilled,
-  [FacilityEnum.HairdryerInRoomAllScandic]: IconName.StarFilled,
+  [FacilityEnum.Gym]: IconName.Fitness,
+  [FacilityEnum.GymTrainingFacilities]: IconName.Fitness,
+  [FacilityEnum.Hairdresser]: IconName.Hairdresser,
+  [FacilityEnum.HairdryerInRoomAllScandic]: IconName.HairdryerInRoomAllScandic,
   [FacilityEnum.HandicapFacilities]: IconName.StarFilled,
   [FacilityEnum.HandrailsInBathrooms]: IconName.StarFilled,
   [FacilityEnum.HearingInductionLoops]: IconName.StarFilled,
   [FacilityEnum.Highway1]: IconName.StarFilled,
   [FacilityEnum.Highway2]: IconName.StarFilled,
-  [FacilityEnum.Hiking0To3Km]: IconName.StarFilled,
+  [FacilityEnum.Hiking0To3Km]: IconName.Hiking,
   [FacilityEnum.HotelCompliesWithAAASecurityStandards]: IconName.StarFilled,
   [FacilityEnum.HotelIsFollowingScandicsSafetySecurityPolicy]:
     IconName.StarFilled,
   [FacilityEnum.HotelWorksAccordingToScandicsAccessibilityConcepts]:
     IconName.StarFilled,
-  [FacilityEnum.IceMachine]: IconName.StarFilled,
-  [FacilityEnum.IceMachineReception]: IconName.StarFilled,
+  [FacilityEnum.IceMachine]: IconName.IceMachine,
+  [FacilityEnum.IceMachineReception]: IconName.IceMachine,
   [FacilityEnum.IDRequiredToReplaceAGuestRoomKey]: IconName.StarFilled,
   [FacilityEnum.IfNoWhatAreTheHoursUse24ClockEx0000To0600]: IconName.StarFilled,
   [FacilityEnum.InCountry]: IconName.StarFilled,
@@ -192,60 +155,93 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.InternetHighSpeedInternetConnectionAllScandic]:
     IconName.StarFilled,
   [FacilityEnum.InternetHotSpotsAllScandic]: IconName.StarFilled,
-  [FacilityEnum.IroningRoom]: IconName.StarFilled,
-  [FacilityEnum.IronIroningBoardAllScandic]: IconName.StarFilled,
+  [FacilityEnum.IroningRoom]: IconName.Ironing,
+  [FacilityEnum.IronIroningBoardAllScandic]: IconName.Ironing,
+  [FacilityEnum.Jacuzzi]: IconName.Jacuzzi,
+  [FacilityEnum.JacuzziInRoom]: IconName.Jacuzzi,
+  [FacilityEnum.KayaksForLoan]: IconName.Kayaking,
   [FacilityEnum.KeyAccessOnlySecuredFloorsAvailable]: IconName.StarFilled,
+  [FacilityEnum.KeyAccessOnlyToHealthClubGym]: IconName.Fitness,
   [FacilityEnum.KidsPlayRoom]: IconName.StarFilled,
   [FacilityEnum.KidsUpToAndIncluding12YearsStayForFree]: IconName.StarFilled,
-  [FacilityEnum.KitchenInRoom]: IconName.StarFilled,
+  [FacilityEnum.KitchenInRoom]: IconName.Kitchen,
   [FacilityEnum.Lake0To1Km]: IconName.StarFilled,
   [FacilityEnum.LakeOrSea0To1Km]: IconName.StarFilled,
-  [FacilityEnum.LaptopSafe]: IconName.StarFilled,
+  [FacilityEnum.LaptopSafe]: IconName.LaptopSafe,
+  [FacilityEnum.LateCheckOutUntil1400Guaranteed]: IconName.Business,
+  [FacilityEnum.LaundryRoom]: IconName.LaundryMachine,
+  [FacilityEnum.LaundryService]: IconName.LaundryMachine,
+  [FacilityEnum.LaundryServiceExpress]: IconName.TshirtWash,
   [FacilityEnum.Leisure]: IconName.StarFilled,
-  [FacilityEnum.LuggageLockers]: IconName.StarFilled,
-  [FacilityEnum.LuggageStorageAdditionalCost]: IconName.StarFilled,
-  [FacilityEnum.LuggageStorageNoCost]: IconName.StarFilled,
-  [FacilityEnum.Massage]: IconName.StarFilled,
-  [FacilityEnum.MinibarInRoom]: IconName.StarFilled,
+  [FacilityEnum.LifestyleConcierge]: IconName.Concierge,
+  [FacilityEnum.LuggageLockers]: IconName.LuggageLockers,
+  [FacilityEnum.LuggageStorageAdditionalCost]: IconName.Luggage,
+  [FacilityEnum.LuggageStorageNoCost]: IconName.Luggage,
+  [FacilityEnum.Massage]: IconName.Massage,
+  [FacilityEnum.MeetingArea]: IconName.Business,
+  [FacilityEnum.MeetingConferenceFacilities]: IconName.Business,
+  [FacilityEnum.MeetingRooms]: IconName.Business,
+  [FacilityEnum.MinibarInRoom]: IconName.Minibar,
   [FacilityEnum.MobileLift]: IconName.StarFilled,
   [FacilityEnum.Mountains0To1Km]: IconName.StarFilled,
-  [FacilityEnum.MovieChannelsInRoomAllScandic]: IconName.StarFilled,
+  [FacilityEnum.MovieChannelsInRoomAllScandic]: IconName.TVRemote,
   [FacilityEnum.MultipleExitsOnEachFloor]: IconName.StarFilled,
-  [FacilityEnum.NonSmokingRoomsAllScandic]: IconName.StarFilled,
-  [FacilityEnum.OnSiteTrainingFacilities]: IconName.StarFilled,
+  [FacilityEnum.NonSmokingRoomsAllScandic]: IconName.NonSmoking,
+  [FacilityEnum.OnSiteTrainingFacilities]: IconName.Fitness,
   [FacilityEnum.OtherExplainInBriefDescription]: IconName.StarFilled,
-  [FacilityEnum.OvernightSecurity]: IconName.StarFilled,
+  [FacilityEnum.OutdoorTerrace]: IconName.Deck,
+  [FacilityEnum.OvernightSecurity]: IconName.Guard,
+  [FacilityEnum.ParkingAdditionalCost]: IconName.Parking,
   [FacilityEnum.ParkingAttendant]: IconName.StarFilled,
+  [FacilityEnum.ParkingElectricCharging]: IconName.ElectricCar,
+  [FacilityEnum.ParkingFreeParking]: IconName.Parking,
+  [FacilityEnum.ParkingGarage]: IconName.Garage,
+  [FacilityEnum.ParkingOutdoor]: IconName.ParkingOutdoor,
   [FacilityEnum.PCHookUpInRoom]: IconName.StarFilled,
+  [FacilityEnum.PetFriendlyRooms]: IconName.Pets,
   [FacilityEnum.PillowAlarmsAvailable]: IconName.StarFilled,
-  [FacilityEnum.PlayStationInPlayArea]: IconName.StarFilled,
+  [FacilityEnum.PlayStationInPlayArea]: IconName.Gaming,
+  [FacilityEnum.Pool]: IconName.Swim,
+  [FacilityEnum.PoolSwimmingPoolJacuzziAtHotel]: IconName.Swim,
   [FacilityEnum.PrintingService]: IconName.StarFilled,
   [FacilityEnum.PropertyMeetsRequirementsFireSafety]: IconName.StarFilled,
   [FacilityEnum.PublicAddressSystem]: IconName.StarFilled,
   [FacilityEnum.RelaxationSuite]: IconName.StarFilled,
+  [FacilityEnum.Restaurant]: IconName.Restaurant,
   [FacilityEnum.RestrictedRoomAccessAllScandic]: IconName.StarFilled,
+  [FacilityEnum.RooftopBar]: IconName.Deck,
   [FacilityEnum.RoomsAccessibleFromTheInterior]: IconName.StarFilled,
+  [FacilityEnum.RoomService]: IconName.RoomService,
   [FacilityEnum.RoomWindowsOpen]: IconName.StarFilled,
   [FacilityEnum.RoomWindowsThatOpenHaveLockingDevice]: IconName.StarFilled,
   [FacilityEnum.Rural1]: IconName.StarFilled,
   [FacilityEnum.Rural2]: IconName.StarFilled,
-  [FacilityEnum.SafeDepositBoxInRoomsAllScandic]: IconName.StarFilled,
-  [FacilityEnum.SafeDepositBoxInRoomsCanHoldA17InchLaptop]: IconName.StarFilled,
-  [FacilityEnum.SafeDepositBoxInRoomsCannotHoldALaptop]: IconName.StarFilled,
+  [FacilityEnum.SafeDepositBoxInRoomsAllScandic]: IconName.SafetyBox,
+  [FacilityEnum.SafeDepositBoxInRoomsCanHoldA17InchLaptop]: IconName.SafetyBox,
+  [FacilityEnum.SafeDepositBoxInRoomsCannotHoldALaptop]: IconName.SafetyBox,
   [FacilityEnum.SafetyChainsOnGuestRoomDoor]: IconName.StarFilled,
+  [FacilityEnum.Sauna]: IconName.Sauna,
+  [FacilityEnum.ScandicShop24Hrs]: IconName.ConvenienceStore24h,
   [FacilityEnum.SecondaryLocksOnSlidingGlassDoors]: IconName.StarFilled,
   [FacilityEnum.SecondaryLocksOnWindows]: IconName.StarFilled,
-  [FacilityEnum.Security24Hours]: IconName.StarFilled,
-  [FacilityEnum.SecurityEscortsAvailableOnRequest]: IconName.StarFilled,
-  [FacilityEnum.SecurityPersonnelOnSite]: IconName.StarFilled,
+  [FacilityEnum.Security24Hours]: IconName.Guard,
+  [FacilityEnum.SecurityEscortsAvailableOnRequest]: IconName.Guard,
+  [FacilityEnum.SecurityPersonnelOnSite]: IconName.Guard,
   [FacilityEnum.SeparateFloorsForWomen]: IconName.StarFilled,
+  [FacilityEnum.ServesBreakfastAlwaysIncluded]: IconName.Breakfast,
+  [FacilityEnum.ServesBreakfastNotAlwaysIncluded]: IconName.Breakfast,
+  [FacilityEnum.ServesOrganicBreakfastAlwaysIncluded]: IconName.Breakfast,
+  [FacilityEnum.ServesOrganicBreakfastNotAlwaysIncluded]: IconName.Breakfast,
   [FacilityEnum.ServiceGuideDogsAllowed]: IconName.StarFilled,
-  [FacilityEnum.ServiceSecurity24Hrs]: IconName.StarFilled,
-  [FacilityEnum.Skiing0To1Km]: IconName.StarFilled,
+  [FacilityEnum.ServiceSecurity24Hrs]: IconName.Guard,
+  [FacilityEnum.Shopping]: IconName.Shopping,
+  [FacilityEnum.SkateboardsForLoan]: IconName.Skateboarding,
+  [FacilityEnum.Skiing0To1Km]: IconName.Skiing,
+  [FacilityEnum.Skybar]: IconName.LocalBar,
   [FacilityEnum.SmokeDetectorsAllScandic]: IconName.StarFilled,
   [FacilityEnum.Solarium]: IconName.StarFilled,
   [FacilityEnum.SpecialNeedsMenus]: IconName.StarFilled,
-  [FacilityEnum.Sports]: IconName.StarFilled,
+  [FacilityEnum.Sports]: IconName.Sports,
   [FacilityEnum.SprinklersAllScandic]: IconName.StarFilled,
   [FacilityEnum.SprinklersInAllHalls]: IconName.StarFilled,
   [FacilityEnum.SprinklersInAllPublicAreas]: IconName.StarFilled,
@@ -264,13 +260,16 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.SwingboltLock]: IconName.StarFilled,
   [FacilityEnum.TeleConferencingFacilitiesAvailable]: IconName.StarFilled,
   [FacilityEnum.TelevisionsWithSubtitlesOrClosedCaptions]: IconName.StarFilled,
-  [FacilityEnum.Tennis1]: IconName.StarFilled,
-  [FacilityEnum.Tennis2]: IconName.StarFilled,
-  [FacilityEnum.TennisPadel]: IconName.StarFilled,
-  [FacilityEnum.Theatre]: IconName.StarFilled,
-  [FacilityEnum.TrouserPress]: IconName.StarFilled,
+  [FacilityEnum.Tennis1]: IconName.Sports,
+  [FacilityEnum.Tennis2]: IconName.Sports,
+  [FacilityEnum.TennisPadel]: IconName.Sports,
+  [FacilityEnum.Theatre]: IconName.Theatre,
+  [FacilityEnum.TrouserPress]: IconName.Ironing,
+  [FacilityEnum.TVWithChromecast1]: IconName.TvCasting,
+  [FacilityEnum.TVWithChromecast2]: IconName.TvCasting,
   [FacilityEnum.UniformSecurityOnPremises]: IconName.StarFilled,
-  [FacilityEnum.UtilityRoomForIroning]: IconName.StarFilled,
+  [FacilityEnum.UtilityRoomForIroning]: IconName.Ironing,
+  [FacilityEnum.VendingMachineWithNecessities]: IconName.Dining,
   [FacilityEnum.VideoSurveillanceInHallways]: IconName.StarFilled,
   [FacilityEnum.VideoSurveillanceInPublicAreas]: IconName.StarFilled,
   [FacilityEnum.VideoSurveillanceMonitored24HrsADay]: IconName.StarFilled,
@@ -278,16 +277,29 @@ const facilityToIconMap: Record<FacilityEnum, IconName> = {
   [FacilityEnum.VideoSurveillanceOfExteriorFrontEntrance]: IconName.StarFilled,
   [FacilityEnum.VideoSurveillanceRecorded24HrsADayParkingArea]:
     IconName.StarFilled,
-  [FacilityEnum.WallMountedCycleRack]: IconName.StarFilled,
+  [FacilityEnum.WallMountedCycleRack]: IconName.Bike,
   [FacilityEnum.WellLitWalkways]: IconName.StarFilled,
-  [FacilityEnum.WheelchairAccess]: IconName.StarFilled,
+  [FacilityEnum.WellnessAndSaunaEntranceFeeAdmission16PlusYears]: IconName.Spa,
+  [FacilityEnum.WellnessPoolSaunaEntranceFeeAdmission16PlusYears]: IconName.Spa,
+  [FacilityEnum.WheelchairAccess]: IconName.Wheelchair,
   [FacilityEnum.WideCorridors]: IconName.StarFilled,
   [FacilityEnum.WideEntrance]: IconName.StarFilled,
   [FacilityEnum.WideRestaurantEntrance]: IconName.StarFilled,
   [FacilityEnum.WiFiWirelessInternetAccessAllScandic]: IconName.StarFilled,
 }
 
-export function mapFacilityToIcon(id: FacilityEnum): FC<IconProps> | null {
-  const iconName = facilityToIconMap[id]
-  return getIconByIconName(iconName) || null
+interface mapFacilityToIconProps {
+  id: FacilityEnum
+}
+export function FacilityToIcon({
+  id,
+  ...props
+}: mapFacilityToIconProps &
+  (
+    | MaterialIconSetIconProps
+    | NucleoIconProps
+    | IconProps
+  )): JSX.Element | null {
+  const iconName = facilityToIconMap[id]
+  return <IconByIconName iconName={iconName} {...props} />
 }
diff --git a/apps/scandic-web/components/ContentType/HotelSubpage/AdditionalContent/Meetings/index.tsx b/apps/scandic-web/components/ContentType/HotelSubpage/AdditionalContent/Meetings/index.tsx
index 1d6846769..28639343c 100644
--- a/apps/scandic-web/components/ContentType/HotelSubpage/AdditionalContent/Meetings/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelSubpage/AdditionalContent/Meetings/index.tsx
@@ -1,6 +1,5 @@
 "use client"
 import { useRef, useState } from "react"
-import { useIntl } from "react-intl"
 
 import Grids from "@/components/TempDesignSystem/Grids"
 import MeetingRoomCard from "@/components/TempDesignSystem/MeetingRoomCard"
@@ -17,7 +16,6 @@ interface MeetingsAdditionalContentProps {
 export default function MeetingsAdditionalContent({
   rooms,
 }: MeetingsAdditionalContentProps) {
-  const intl = useIntl()
   const showToggleButton = rooms.length > 3
   const [allRoomsVisible, setAllRoomsVisible] = useState(!showToggleButton)
 
@@ -43,12 +41,6 @@ export default function MeetingsAdditionalContent({
         <ShowMoreButton
           loadMoreData={handleShowMore}
           showLess={allRoomsVisible}
-          textShowMore={intl.formatMessage({
-            id: "Show more",
-          })}
-          textShowLess={intl.formatMessage({
-            id: "Show less",
-          })}
         />
       ) : null}
     </div>
diff --git a/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx b/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx
index 021fb204d..360eae16d 100644
--- a/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx
+++ b/apps/scandic-web/components/ContentType/HotelSubpage/HtmlContent/index.tsx
@@ -95,6 +95,7 @@ function renderNode(domNode: Node, idx: number) {
         return <br key={domNode.name + idx} />
 
       case NodeNames.a:
+        console.log(domNode.attribs.target)
         return (
           <Link
             key={domNode.name + idx}
diff --git a/apps/scandic-web/components/ContentType/HotelSubpage/Sidebar/RestaurantSidebar.tsx b/apps/scandic-web/components/ContentType/HotelSubpage/Sidebar/RestaurantSidebar.tsx
index b3c354d59..407842b71 100644
--- a/apps/scandic-web/components/ContentType/HotelSubpage/Sidebar/RestaurantSidebar.tsx
+++ b/apps/scandic-web/components/ContentType/HotelSubpage/Sidebar/RestaurantSidebar.tsx
@@ -1,6 +1,6 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import { OpenInNewSmallIcon } from "@/components/Icons"
 import OpeningHours from "@/components/OpeningHours"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
@@ -66,7 +66,11 @@ export default async function RestaurantSidebar({
                   variant="icon"
                 >
                   {name}
-                  <OpenInNewSmallIcon color="peach80" />
+                  <MaterialIcon
+                    icon="open_in_new"
+                    size={20}
+                    color="CurrentColor"
+                  />
                 </Link>
               </li>
             ))}
diff --git a/apps/scandic-web/components/DatePicker/Range/Desktop.tsx b/apps/scandic-web/components/DatePicker/Range/Desktop.tsx
index c6c71cf1a..ca4d1c0b3 100644
--- a/apps/scandic-web/components/DatePicker/Range/Desktop.tsx
+++ b/apps/scandic-web/components/DatePicker/Range/Desktop.tsx
@@ -4,10 +4,11 @@ import { useState } from "react"
 import { DayPicker } from "react-day-picker"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { Lang } from "@/constants/languages"
 import { dt } from "@/lib/dt"
 
-import { ChevronLeftIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -88,10 +89,10 @@ export default function DatePickerRangeDesktop({
       components={{
         Chevron(props) {
           return (
-            <ChevronLeftIcon
+            <MaterialIcon
+              icon="chevron_left"
               className={props.className}
-              height={20}
-              width={20}
+              size={20}
             />
           )
         },
diff --git a/apps/scandic-web/components/DatePicker/Range/Mobile.tsx b/apps/scandic-web/components/DatePicker/Range/Mobile.tsx
index d0150583d..d562049e4 100644
--- a/apps/scandic-web/components/DatePicker/Range/Mobile.tsx
+++ b/apps/scandic-web/components/DatePicker/Range/Mobile.tsx
@@ -2,10 +2,11 @@
 import { DayPicker } from "react-day-picker"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { Lang } from "@/constants/languages"
 import { dt } from "@/lib/dt"
 
-import { CloseLargeIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -38,7 +39,7 @@ export default function DatePickerRangeMobile({
     <div className={styles.container}>
       <header className={styles.header}>
         <button className={styles.close} onClick={close} type="button">
-          <CloseLargeIcon />
+          <MaterialIcon icon="close" />
         </button>
       </header>
       <DayPicker
diff --git a/apps/scandic-web/components/DatePicker/Single/Desktop.tsx b/apps/scandic-web/components/DatePicker/Single/Desktop.tsx
index 09e1aa16d..34e0bf665 100644
--- a/apps/scandic-web/components/DatePicker/Single/Desktop.tsx
+++ b/apps/scandic-web/components/DatePicker/Single/Desktop.tsx
@@ -4,10 +4,11 @@ import { useState } from "react"
 import { DayPicker } from "react-day-picker"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { Lang } from "@/constants/languages"
 import { dt } from "@/lib/dt"
 
-import { ChevronLeftIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -89,10 +90,10 @@ export default function DatePickerSingleDesktop({
       components={{
         Chevron(props) {
           return (
-            <ChevronLeftIcon
+            <MaterialIcon
+              icon="chevron_left"
               className={props.className}
-              height={20}
-              width={20}
+              size={20}
             />
           )
         },
diff --git a/apps/scandic-web/components/DatePicker/Single/Mobile.tsx b/apps/scandic-web/components/DatePicker/Single/Mobile.tsx
index 6c5d597d2..18a5cc568 100644
--- a/apps/scandic-web/components/DatePicker/Single/Mobile.tsx
+++ b/apps/scandic-web/components/DatePicker/Single/Mobile.tsx
@@ -2,6 +2,8 @@
 import { DayPicker } from "react-day-picker"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { Lang } from "@/constants/languages"
 import { dt } from "@/lib/dt"
 
diff --git a/apps/scandic-web/components/DestinationFilterAndSort/Filter/Checkbox/index.tsx b/apps/scandic-web/components/DestinationFilterAndSort/Filter/Checkbox/index.tsx
index d8a558f5a..33cc233a9 100644
--- a/apps/scandic-web/components/DestinationFilterAndSort/Filter/Checkbox/index.tsx
+++ b/apps/scandic-web/components/DestinationFilterAndSort/Filter/Checkbox/index.tsx
@@ -2,7 +2,8 @@
 
 import { Checkbox as AriaCheckbox } from "react-aria-components"
 
-import CheckIcon from "@/components/Icons/Check"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Body from "@/components/TempDesignSystem/Text/Body"
 
 import styles from "./checkbox.module.css"
@@ -29,7 +30,7 @@ export default function Checkbox({
       {({ isSelected }) => (
         <>
           <span className={styles.checkbox}>
-            {isSelected && <CheckIcon color="white" />}
+            {isSelected && <MaterialIcon icon="check" color="Icon/Inverted" />}
           </span>
           <Body asChild>
             <span>{name}</span>
diff --git a/apps/scandic-web/components/DestinationFilterAndSort/index.tsx b/apps/scandic-web/components/DestinationFilterAndSort/index.tsx
index e4f87d677..b6a5e852e 100644
--- a/apps/scandic-web/components/DestinationFilterAndSort/index.tsx
+++ b/apps/scandic-web/components/DestinationFilterAndSort/index.tsx
@@ -10,9 +10,10 @@ import {
 } from "react-aria-components"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useDestinationDataStore } from "@/stores/destination-data"
 
-import { CloseLargeIcon, FilterIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
@@ -114,7 +115,7 @@ export default function DestinationFilterAndSort({
       <DialogTrigger onOpenChange={handleClose}>
         <div className={styles.buttonWrapper}>
           <Button intent="text" theme="base" variant="icon">
-            <FilterIcon color="baseTextHighcontrast" />
+            <MaterialIcon icon="filter_alt" color="CurrentColor" />
             {intl.formatMessage({ id: "Filter and sort" })}
           </Button>
           {activeFilters.length > 0 && (
@@ -145,7 +146,7 @@ export default function DestinationFilterAndSort({
                       type="button"
                       className={styles.close}
                     >
-                      <CloseLargeIcon />
+                      <MaterialIcon icon="close" />
                     </button>
                   </header>
                   <div className={styles.content}>
diff --git a/apps/scandic-web/components/Footer/Details/SocialLink/index.tsx b/apps/scandic-web/components/Footer/Details/SocialLink/index.tsx
index 2303c7a24..7940c9b24 100644
--- a/apps/scandic-web/components/Footer/Details/SocialLink/index.tsx
+++ b/apps/scandic-web/components/Footer/Details/SocialLink/index.tsx
@@ -1,15 +1,17 @@
 "use client"
 
-import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
+import { IconByIconName } from "@/components/Icons/IconByIconName"
 import { trackSocialMediaClick } from "@/utils/tracking"
 
 import type { SocialIconsProps } from "@/types/components/footer/socialIcons"
 import type { SocialLinkProps } from "@/types/components/footer/socialLink"
-import type { IconName } from "@/types/components/icon"
+import type { IconName } from "@/components/Icons/iconName"
 
 function SocialIcon({ iconName }: SocialIconsProps) {
-  const SocialIcon = getIconByIconName(iconName as IconName)
-  return SocialIcon ? <SocialIcon color="white" /> : <span>{iconName}</span>
+  const SocialIcon = (
+    <IconByIconName iconName={iconName} color="Icon/Inverted" />
+  )
+  return SocialIcon ? SocialIcon : <span>{iconName}</span>
 }
 
 export default function SocialLink({ link }: SocialLinkProps) {
@@ -23,7 +25,7 @@ export default function SocialLink({ link }: SocialLinkProps) {
       aria-label={title}
       onClick={() => trackSocialMediaClick(title)}
     >
-      <SocialIcon iconName={title} />
+      <SocialIcon iconName={title as IconName} />
     </a>
   )
 }
diff --git a/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx b/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx
index 6e7b4a861..73884bb2f 100644
--- a/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx
+++ b/apps/scandic-web/components/Footer/Navigation/MainNav/index.tsx
@@ -1,6 +1,7 @@
 "use client"
 
-import { ArrowRightIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Link from "@/components/TempDesignSystem/Link"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -25,7 +26,10 @@ export default function FooterMainNav({ mainLinks }: FooterMainNavProps) {
                 onClick={() => trackFooterClick("main", link.title)}
               >
                 {link.title}
-                <ArrowRightIcon color="peach80" />
+                <MaterialIcon
+                  icon="arrow_forward"
+                  color="Icon/Interactive/Secondary"
+                />
               </Link>
             </Subtitle>
           </li>
@@ -46,7 +50,10 @@ export function FooterMainNavSkeleton() {
             <Subtitle color="baseTextHighContrast" type="two" asChild>
               <span className={styles.mainNavigationLink}>
                 <SkeletonShimmer width="80%" />
-                <ArrowRightIcon color="peach80" />
+                <MaterialIcon
+                  icon="arrow_forward"
+                  color="Icon/Interactive/Secondary"
+                />
               </span>
             </Subtitle>
           </li>
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
index 32456bf77..d4dd7f3ab 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/BookingCode/index.tsx
@@ -4,9 +4,10 @@ import { type FieldError, useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 import { useMediaQuery } from "usehooks-ts"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { REDEMPTION } from "@/constants/booking"
 
-import { ErrorCircleIcon, InfoCircleIcon } from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
@@ -212,7 +213,11 @@ function CodeRulesModal() {
     <Modal
       trigger={
         <Button intent="text">
-          <InfoCircleIcon color="uiTextPlaceholder" height={20} width={20} />
+          <MaterialIcon
+            icon="info"
+            color="Icon/Interactive/Placeholder"
+            size={20}
+          />
         </Button>
       }
       title={codeVoucher}
@@ -257,8 +262,11 @@ function BookingCodeError({ codeError }: { codeError: FieldError }) {
   return (
     <div className={styles.errorContainer}>
       <Caption color={isInvalidErr ? "red" : "blue"} className={styles.error}>
-        <ErrorCircleIcon
-          color={isInvalidErr ? "red" : "blue"}
+        <MaterialIcon
+          icon="error"
+          color={
+            isInvalidErr ? "Icon/Feedback/Information" : "Icon/Feedback/Error"
+          }
           className={styles.errorIcon}
         />
         {intl.formatMessage({ id: codeError.message })}
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/RewardNight/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/RewardNight/index.tsx
index 35356938b..6e7a21f90 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/RewardNight/index.tsx
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/RewardNight/index.tsx
@@ -4,9 +4,10 @@ import { useCallback, useEffect, useRef } from "react"
 import { useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { REDEMPTION } from "@/constants/booking"
 
-import { InfoCircleIcon } from "@/components/Icons"
 import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
@@ -87,7 +88,12 @@ export default function RewardNight() {
       {redemptionErr && (
         <div className={styles.errorContainer}>
           <Caption className={styles.error} type="regular" color="blue">
-            <InfoCircleIcon color="blue" className={styles.errorIcon} />
+            <MaterialIcon
+              icon="error"
+              size={24}
+              color="Icon/Feedback/Information"
+              className={styles.errorIcon}
+            />
             {intl.formatMessage({ id: redemptionErr.message })}
           </Caption>
           {isMultiRoomError ? <RemoveExtraRooms /> : null}
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/ClearSearchButton/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/ClearSearchButton/index.tsx
index ae1f8f4d0..0c3c1ca19 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/ClearSearchButton/index.tsx
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/ClearSearchButton/index.tsx
@@ -1,7 +1,8 @@
 "use client"
 import { useIntl } from "react-intl"
 
-import { DeleteIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import { buttonVariants } from "./variants"
@@ -32,7 +33,7 @@ export default function ClearSearchButton({
       tabIndex={0}
       type="button"
     >
-      <DeleteIcon color="burgundy" height={20} width={20} />
+      <MaterialIcon icon="delete" color="Icon/Interactive/Default" size={20} />
       <Caption color="burgundy" type="bold" asChild>
         <span>{intl.formatMessage({ id: "Clear searches" })}</span>
       </Caption>
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/index.tsx
index cce0e571f..43ed506ab 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/index.tsx
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/Search/SearchList/index.tsx
@@ -3,7 +3,8 @@ import { useEffect, useState } from "react"
 import { useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 
-import { ErrorCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Divider from "@/components/TempDesignSystem/Divider"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -71,7 +72,7 @@ export default function SearchList({
               variant="error"
             >
               <Caption className={styles.heading} color="red">
-                <ErrorCircleIcon color="red" />
+                <MaterialIcon icon="error" color="Icon/Interactive/Accent" />
                 {intl.formatMessage({ id: "Enter destination or hotel" })}
               </Caption>
               <Body>
@@ -89,7 +90,7 @@ export default function SearchList({
               variant="error"
             >
               <Caption className={styles.heading} color="red">
-                <ErrorCircleIcon color="red" />
+                <MaterialIcon icon="error" color="Icon/Interactive/Accent" />
                 {intl.formatMessage({ id: "No results" })}
               </Caption>
               <Body>
diff --git a/apps/scandic-web/components/Forms/BookingWidget/FormContent/index.tsx b/apps/scandic-web/components/Forms/BookingWidget/FormContent/index.tsx
index 3012fcd6e..6ee9a2bf8 100644
--- a/apps/scandic-web/components/Forms/BookingWidget/FormContent/index.tsx
+++ b/apps/scandic-web/components/Forms/BookingWidget/FormContent/index.tsx
@@ -2,11 +2,12 @@
 import { useFormContext, useWatch } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
 import DatePicker from "@/components/DatePicker"
 import GuestsRoomsPickerForm from "@/components/GuestsRoomsPicker"
-import { SearchIcon } from "@/components/Icons"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Button from "@/components/TempDesignSystem/Button"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -77,7 +78,7 @@ export default function FormContent({
             type="submit"
           >
             <span className={styles.icon}>
-              <SearchIcon color="white" width={28} height={28} />
+              <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
             </span>
           </Button>
         </div>
@@ -109,7 +110,7 @@ export default function FormContent({
               <span>{intl.formatMessage({ id: "Search" })}</span>
             </Caption>
             <span className={styles.icon}>
-              <SearchIcon color="white" width={28} height={28} />
+              <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
             </span>
           </Button>
         </div>
@@ -163,7 +164,7 @@ export function BookingWidgetFormContentSkeleton() {
             <span>{intl.formatMessage({ id: "Search" })}</span>
           </Caption>
           <span className={styles.icon}>
-            <SearchIcon color="white" width={28} height={28} />
+            <MaterialIcon icon="search" color="Icon/Inverted" size={28} />
           </span>
         </Button>
       </div>
diff --git a/apps/scandic-web/components/GuestsRoomsPicker/ChildSelector/ChildInfoSelector.tsx b/apps/scandic-web/components/GuestsRoomsPicker/ChildSelector/ChildInfoSelector.tsx
index ceac4dad7..e74b21643 100644
--- a/apps/scandic-web/components/GuestsRoomsPicker/ChildSelector/ChildInfoSelector.tsx
+++ b/apps/scandic-web/components/GuestsRoomsPicker/ChildSelector/ChildInfoSelector.tsx
@@ -3,7 +3,8 @@
 import { useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 
-import { ErrorCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Select from "@/components/TempDesignSystem/Select"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
@@ -120,14 +121,14 @@ export default function ChildInfoSelector({
 
       {roomErrors && roomErrors.message ? (
         <Caption color="red" className={styles.error}>
-          <ErrorCircleIcon color="red" />
+          <MaterialIcon icon="error" color="Icon/Interactive/Accent" />
           {roomErrors.message}
         </Caption>
       ) : null}
 
       {ageError || bedError ? (
         <Caption color="red" className={styles.error}>
-          <ErrorCircleIcon color="red" />
+          <MaterialIcon icon="error" color="Icon/Interactive/Accent" />
           {errorMessage}
         </Caption>
       ) : null}
diff --git a/apps/scandic-web/components/GuestsRoomsPicker/Counter/index.tsx b/apps/scandic-web/components/GuestsRoomsPicker/Counter/index.tsx
index 30c8e35fe..84e89742f 100644
--- a/apps/scandic-web/components/GuestsRoomsPicker/Counter/index.tsx
+++ b/apps/scandic-web/components/GuestsRoomsPicker/Counter/index.tsx
@@ -1,6 +1,7 @@
 "use client"
 
-import { MinusIcon, PlusIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
@@ -27,7 +28,7 @@ export default function Counter({
         wrapping={true}
         disabled={disableDecrease}
       >
-        <MinusIcon color="burgundy" />
+        <MaterialIcon icon="remove" color="CurrentColor" />
       </Button>
       <Body color="baseTextHighContrast" textAlign="center">
         {count}
@@ -42,7 +43,7 @@ export default function Counter({
         size="small"
         disabled={disableIncrease}
       >
-        <PlusIcon color="burgundy" />
+        <MaterialIcon icon="add" color="CurrentColor" />
       </Button>
     </div>
   )
diff --git a/apps/scandic-web/components/GuestsRoomsPicker/Form.tsx b/apps/scandic-web/components/GuestsRoomsPicker/Form.tsx
index b1b93e470..2ed699ca9 100644
--- a/apps/scandic-web/components/GuestsRoomsPicker/Form.tsx
+++ b/apps/scandic-web/components/GuestsRoomsPicker/Form.tsx
@@ -4,9 +4,10 @@ import { useCallback, useEffect } from "react"
 import { useFormContext, useWatch } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { REDEMPTION } from "@/constants/booking"
 
-import { CloseLargeIcon, PlusCircleIcon, PlusIcon } from "../Icons"
 import Button from "../TempDesignSystem/Button"
 import { Tooltip } from "../TempDesignSystem/Tooltip"
 import { GuestsRoom } from "./GuestsRoom"
@@ -83,7 +84,7 @@ export default function GuestsRoomsPickerDialog({
       <section className={styles.contentWrapper}>
         <header className={styles.header}>
           <button type="button" className={styles.close} onClick={onClose}>
-            <CloseLargeIcon />
+            <MaterialIcon icon="close" />
           </button>
         </header>
 
@@ -113,7 +114,7 @@ export default function GuestsRoomsPickerDialog({
                   onPress={handleAddRoom}
                   disabled
                 >
-                  <PlusIcon />
+                  <MaterialIcon icon="add" color="CurrentColor" />
                   {addRoomLabel}
                 </Button>
               </Tooltip>
@@ -129,7 +130,7 @@ export default function GuestsRoomsPickerDialog({
                   fullWidth
                   onPress={handleAddRoom}
                 >
-                  <PlusIcon />
+                  <MaterialIcon icon="add" color="CurrentColor" />
                   {addRoomLabel}
                 </Button>
               </div>
@@ -153,7 +154,7 @@ export default function GuestsRoomsPickerDialog({
                 disabled
                 onPress={handleAddRoom}
               >
-                <PlusCircleIcon />
+                <MaterialIcon icon="add_circle" color="CurrentColor" />
                 {addRoomLabel}
               </Button>
             </Tooltip>
@@ -168,7 +169,7 @@ export default function GuestsRoomsPickerDialog({
                 theme="base"
                 onPress={handleAddRoom}
               >
-                <PlusCircleIcon />
+                <MaterialIcon icon="add_circle" color="CurrentColor" />
                 {addRoomLabel}
               </Button>
             </div>
diff --git a/apps/scandic-web/components/GuestsRoomsPicker/GuestsRoom/index.tsx b/apps/scandic-web/components/GuestsRoomsPicker/GuestsRoom/index.tsx
index 84f53ed8c..9d5931fc9 100644
--- a/apps/scandic-web/components/GuestsRoomsPicker/GuestsRoom/index.tsx
+++ b/apps/scandic-web/components/GuestsRoomsPicker/GuestsRoom/index.tsx
@@ -1,6 +1,7 @@
 import { useIntl } from "react-intl"
 
-import { DeleteIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -63,7 +64,7 @@ export function GuestsRoom({
               size="small"
               className={styles.roomActionsButton}
             >
-              <DeleteIcon color="red" />
+              <MaterialIcon icon="delete" color="CurrentColor" />
               <span className={styles.roomActionsLabel}>
                 {intl.formatMessage({ id: "Remove room" })}
               </span>
diff --git a/apps/scandic-web/components/Header/HeaderLink/index.tsx b/apps/scandic-web/components/Header/HeaderLink/index.tsx
index b1a08b09c..eb1367dd7 100644
--- a/apps/scandic-web/components/Header/HeaderLink/index.tsx
+++ b/apps/scandic-web/components/Header/HeaderLink/index.tsx
@@ -2,7 +2,7 @@
 
 import Link from "next/link"
 
-import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
+import { IconByIconName } from "@/components/Icons/IconByIconName"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./headerLink.module.css"
@@ -16,12 +16,15 @@ export default function HeaderLink({
   iconSize = 20,
   onClick = () => undefined,
 }: HeaderLinkProps) {
-  const Icon = getIconByIconName(iconName)
   return (
     <Caption type="regular" color="textMediumContrast" asChild>
       <Link href={href} className={styles.headerLink} onClick={onClick}>
-        {Icon ? (
-          <Icon className={styles.icon} width={iconSize} height={iconSize} />
+        {iconName ? (
+          <IconByIconName
+            iconName={iconName}
+            className={styles.icon}
+            size={iconSize}
+          />
         ) : null}
         {children}
       </Link>
diff --git a/apps/scandic-web/components/Header/MainMenu/Avatar/index.tsx b/apps/scandic-web/components/Header/MainMenu/Avatar/index.tsx
index a11536e97..5b8d8754e 100644
--- a/apps/scandic-web/components/Header/MainMenu/Avatar/index.tsx
+++ b/apps/scandic-web/components/Header/MainMenu/Avatar/index.tsx
@@ -1,4 +1,5 @@
-import { PersonIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
 
@@ -8,7 +9,7 @@ import type { AvatarProps } from "@/types/components/header/avatar"
 
 export default function Avatar({ image, initials }: AvatarProps) {
   let classNames = [styles.avatar]
-  let element = <PersonIcon color="white" />
+  let element = <MaterialIcon icon="person" color="Icon/Inverted" />
   if (image) {
     classNames.push(styles.image)
     element = <Image src={image.src} alt={image.alt} width={28} height={28} />
diff --git a/apps/scandic-web/components/Header/MainMenu/LogoLink/index.tsx b/apps/scandic-web/components/Header/MainMenu/LogoLink/index.tsx
index 26132ee39..fe3a13b6d 100644
--- a/apps/scandic-web/components/Header/MainMenu/LogoLink/index.tsx
+++ b/apps/scandic-web/components/Header/MainMenu/LogoLink/index.tsx
@@ -2,9 +2,10 @@
 import NextLink from "next/link"
 import { useIntl } from "react-intl"
 
+import { ScandicLogoIcon } from "@scandic-hotels/design-system/Icons"
+
 import useDropdownStore from "@/stores/main-menu"
 
-import { ScandicLogoIcon } from "@/components/Icons"
 import useLang from "@/hooks/useLang"
 
 import styles from "./logoLink.module.css"
@@ -29,7 +30,11 @@ export function LogoLink() {
       onClick={handleNavigate}
       aria-label={intl.formatMessage({ id: "Back to scandichotels.com" })}
     >
-      <ScandicLogoIcon width="103px" height="22px" color="red" />
+      <ScandicLogoIcon
+        width="103px"
+        height="22px"
+        color="Icon/Interactive/Accent"
+      />
     </NextLink>
   )
 }
diff --git a/apps/scandic-web/components/Header/MainMenu/MobileMenu/index.tsx b/apps/scandic-web/components/Header/MainMenu/MobileMenu/index.tsx
index e69cefc4b..70155ffad 100644
--- a/apps/scandic-web/components/Header/MainMenu/MobileMenu/index.tsx
+++ b/apps/scandic-web/components/Header/MainMenu/MobileMenu/index.tsx
@@ -9,6 +9,7 @@ import { customerService } from "@/constants/currentWebHrefs"
 import { findMyBooking } from "@/constants/routes/findMyBooking"
 import useDropdownStore from "@/stores/main-menu"
 
+import { IconName } from "@/components/Icons/iconName"
 import LanguageSwitcher from "@/components/LanguageSwitcher"
 import { useHandleKeyUp } from "@/hooks/useHandleKeyUp"
 import useLang from "@/hooks/useLang"
@@ -20,7 +21,6 @@ import styles from "./mobileMenu.module.css"
 
 import { DropdownTypeEnum } from "@/types/components/dropdown/dropdown"
 import type { MobileMenuProps } from "@/types/components/header/mobileMenu"
-import { IconName } from "@/types/components/icon"
 
 export default function MobileMenu({
   children,
diff --git a/apps/scandic-web/components/Header/MainMenu/MyPagesMenu/index.tsx b/apps/scandic-web/components/Header/MainMenu/MyPagesMenu/index.tsx
index 224c9751a..d004a69dd 100644
--- a/apps/scandic-web/components/Header/MainMenu/MyPagesMenu/index.tsx
+++ b/apps/scandic-web/components/Header/MainMenu/MyPagesMenu/index.tsx
@@ -3,9 +3,10 @@
 import { useRef } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useDropdownStore from "@/stores/main-menu"
 
-import { ChevronDownSmallIcon } from "@/components/Icons"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import useClickOutside from "@/hooks/useClickOutside"
@@ -65,9 +66,11 @@ export default function MyPagesMenu({
             )}
           </span>
         </Body>
-        <ChevronDownSmallIcon
+        <MaterialIcon
+          icon="keyboard_arrow_down"
+          size={20}
           className={`${styles.chevron} ${isMyPagesMenuOpen ? styles.isExpanded : ""}`}
-          color="red"
+          color="Icon/Interactive/Accent"
         />
       </MainMenuButton>
       {isMyPagesMenuOpen ? (
@@ -92,7 +95,12 @@ export function MyPagesMenuSkeleton() {
       <MainMenuButton>
         <Avatar />
         <SkeletonShimmer width="10ch" />
-        <ChevronDownSmallIcon className={`${styles.chevron}`} color="red" />
+        <MaterialIcon
+          icon="keyboard_arrow_down"
+          size={20}
+          className={`${styles.chevron}`}
+          color="Icon/Interactive/Accent"
+        />
       </MainMenuButton>
     </div>
   )
diff --git a/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx b/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx
index 85d0106b2..d5a05d624 100644
--- a/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx
+++ b/apps/scandic-web/components/Header/MainMenu/MyPagesMenuContent/index.tsx
@@ -3,10 +3,11 @@
 import FocusLock from "react-focus-lock"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { logout } from "@/constants/routes/handleAuth"
 import { trpc } from "@/lib/trpc/client"
 
-import { ArrowRightIcon } from "@/components/Icons"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Link from "@/components/TempDesignSystem/Link"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -100,7 +101,11 @@ function PrimaryLinks({
             className={styles.link}
           >
             {link.text}
-            <ArrowRightIcon className={styles.arrow} color="burgundy" />
+            <MaterialIcon
+              icon="arrow_forward"
+              className={styles.arrow}
+              color="CurrentColor"
+            />
           </Link>
         </li>
       ))}
@@ -130,7 +135,11 @@ function SecondaryLinks({
             className={styles.link}
           >
             {link.text}
-            <ArrowRightIcon className={styles.arrow} color="burgundy" />
+            <MaterialIcon
+              icon="arrow_forward"
+              className={styles.arrow}
+              color="Icon/Interactive/Default"
+            />
           </Link>
         </li>
       ))}
diff --git a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx
index d9eff0f88..542a84562 100644
--- a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx
+++ b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/MegaMenu/index.tsx
@@ -2,9 +2,10 @@
 
 import FocusLock from "react-focus-lock"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useDropdownStore from "@/stores/main-menu"
 
-import { ArrowRightIcon, ChevronLeftIcon } from "@/components/Icons"
 import Card from "@/components/TempDesignSystem/Card"
 import Link from "@/components/TempDesignSystem/Link"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -43,7 +44,11 @@ export default function MegaMenu({
               className={styles.backButton}
               onClick={() => toggleMegaMenu(false)}
             >
-              <ChevronLeftIcon color="red" height={20} width={20} />
+              <MaterialIcon
+                icon="chevron_left"
+                size={20}
+                color="Icon/Interactive/Accent"
+              />
               <Subtitle type="one" color="burgundy" asChild>
                 <span>{title}</span>
               </Subtitle>
@@ -61,7 +66,7 @@ export default function MegaMenu({
                 onClick={handleNavigate}
               >
                 {seeAllLink.title}
-                <ArrowRightIcon color="burgundy" />
+                <MaterialIcon icon="arrow_forward" color="CurrentColor" />
               </Link>
             ) : null}
           </div>
@@ -87,8 +92,9 @@ export default function MegaMenu({
                           onClick={handleNavigate}
                         >
                           {title}
-                          <ArrowRightIcon
-                            color="burgundy"
+                          <MaterialIcon
+                            icon="arrow_forward"
+                            color="Icon/Interactive/Default"
                             className={styles.arrow}
                           />
                         </Link>
diff --git a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx
index 22725115b..e9ed245ea 100644
--- a/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx
+++ b/apps/scandic-web/components/Header/MainMenu/NavigationMenu/NavigationMenuItem/index.tsx
@@ -2,9 +2,10 @@
 
 import { useRef } from "react"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useDropdownStore from "@/stores/main-menu"
 
-import { ChevronDownSmallIcon, ChevronRightIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import useClickOutside from "@/hooks/useClickOutside"
 import { useHandleKeyUp } from "@/hooks/useHandleKeyUp"
@@ -49,16 +50,18 @@ export default function MenuItem({ item, isMobile }: NavigationMenuItemProps) {
       >
         {title}
         {isMobile ? (
-          <ChevronRightIcon
+          <MaterialIcon
+            icon="chevron_right"
+            size={20}
             className={`${styles.chevron}`}
-            color="red"
-            height={20}
-            width={20}
+            color="Icon/Interactive/Accent"
           />
         ) : (
-          <ChevronDownSmallIcon
+          <MaterialIcon
+            icon="keyboard_arrow_down"
+            size={20}
             className={`${styles.chevron} ${isMegaMenuOpen ? styles.isExpanded : ""}`}
-            color="red"
+            color="Icon/Interactive/Accent"
           />
         )}
       </MainMenuButton>
diff --git a/apps/scandic-web/components/Header/TopLink/index.tsx b/apps/scandic-web/components/Header/TopLink/index.tsx
index fe4594f5c..a8a6c0e1d 100644
--- a/apps/scandic-web/components/Header/TopLink/index.tsx
+++ b/apps/scandic-web/components/Header/TopLink/index.tsx
@@ -1,7 +1,8 @@
+import { IconName } from "@/components/Icons/iconName"
+
 import HeaderLink from "../HeaderLink"
 
 import type { TopLinkProps } from "@/types/components/header/topLink"
-import { IconName } from "@/types/components/icon"
 
 export default function TopLink({
   isLoggedIn,
diff --git a/apps/scandic-web/components/Header/TopMenu/index.tsx b/apps/scandic-web/components/Header/TopMenu/index.tsx
index c88dd77e3..1f4526cee 100644
--- a/apps/scandic-web/components/Header/TopMenu/index.tsx
+++ b/apps/scandic-web/components/Header/TopMenu/index.tsx
@@ -2,6 +2,7 @@ import { findMyBooking } from "@/constants/routes/findMyBooking"
 import { getHeader } from "@/lib/trpc/memoizedRequests"
 
 import { auth } from "@/auth"
+import { IconName } from "@/components/Icons/iconName"
 import LanguageSwitcher from "@/components/LanguageSwitcher"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -14,8 +15,6 @@ import TopLink from "../TopLink"
 
 import styles from "./topMenu.module.css"
 
-import { IconName } from "@/types/components/icon"
-
 export default async function TopMenu() {
   // cached
   const intl = await getIntl()
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/AddToCalendarButton.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/AddToCalendarButton.tsx
index a82e696cc..6da52999b 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/AddToCalendarButton.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/AddToCalendarButton.tsx
@@ -1,7 +1,8 @@
 "use client"
 import { useIntl } from "react-intl"
 
-import { CalendarAddIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 
 export default function AddToCalendarButton({
@@ -13,7 +14,7 @@ export default function AddToCalendarButton({
 
   return (
     <Button intent="text" size="small" theme="base" wrapping onPress={onPress}>
-      <CalendarAddIcon />
+      <MaterialIcon icon="calendar_add_on" color="CurrentColor" />
       {intl.formatMessage({ id: "Add to calendar" })}
     </Button>
   )
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/DownloadInvoice.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/DownloadInvoice.tsx
index 9fe883683..94931b918 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/DownloadInvoice.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/DownloadInvoice.tsx
@@ -2,7 +2,8 @@
 import { useIntl } from "react-intl"
 import { useReactToPrint } from "react-to-print"
 
-import { DownloadIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 
 import type { DownloadInvoiceProps } from "@/types/components/hotelReservation/bookingConfirmation/actions/downloadInvoice"
@@ -24,7 +25,7 @@ export default function DownloadInvoice({ mainRef }: DownloadInvoiceProps) {
       variant="icon"
       wrapping
     >
-      <DownloadIcon />
+      <MaterialIcon icon="download" color="CurrentColor" />
       {intl.formatMessage({ id: "Download invoice" })}
     </Button>
   )
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/ManageBooking.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/ManageBooking.tsx
index 6924db6ca..e9d3231e8 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/ManageBooking.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Header/Actions/ManageBooking.tsx
@@ -1,7 +1,8 @@
 "use client"
 import { useIntl } from "react-intl"
 
-import { EditIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 
@@ -20,7 +21,7 @@ export default function ManageBooking({ bookingUrl }: ManageBookingProps) {
       wrapping
     >
       <Link color="none" href={bookingUrl} weight="bold">
-        <EditIcon />
+        <MaterialIcon icon="edit_square" color="CurrentColor" />
         {intl.formatMessage({ id: "Manage booking" })}
       </Link>
     </Button>
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/PriceDetailsModal/index.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/PriceDetailsModal/index.tsx
index 85dbbf475..2eeccb516 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/PriceDetailsModal/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/PriceDetailsModal/index.tsx
@@ -2,11 +2,11 @@
 import React from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 import { useBookingConfirmationStore } from "@/stores/booking-confirmation"
 
-import { PriceTagIcon } from "@/components/Icons"
-import ChevronRightSmallIcon from "@/components/Icons/ChevronRightSmall"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -106,7 +106,7 @@ export default function PriceDetailsModal() {
           <Caption color="burgundy">
             {intl.formatMessage({ id: "Price details" })}
           </Caption>
-          <ChevronRightSmallIcon color="burgundy" height="20px" width="20px" />
+          <MaterialIcon icon="chevron_right" color="CurrentColor" size={20} />
         </Button>
       }
     >
@@ -220,7 +220,7 @@ export default function PriceDetailsModal() {
           {bookingCode && (
             <tr className={styles.row}>
               <td>
-                <PriceTagIcon />
+                <MaterialIcon icon="sell" />
                 {bookingCode}
               </td>
               <td></td>
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx
index 35735f791..607e2a37c 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/Room/index.tsx
@@ -2,10 +2,11 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { CancellationRuleEnum, ChildBedTypeEnum } from "@/constants/booking"
 import { useBookingConfirmationStore } from "@/stores/booking-confirmation"
 
-import { CheckIcon, InfoCircleIcon } from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
@@ -77,7 +78,7 @@ export default function ReceiptRoom({
                 variant="icon"
               >
                 {intl.formatMessage({ id: "Reservation policy" })}
-                <InfoCircleIcon color="peach80" />
+                <MaterialIcon icon="info" color="CurrentColor" />
               </Link>
             </Button>
           }
@@ -96,12 +97,12 @@ export default function ReceiptRoom({
                 color="uiTextHighContrast"
                 className={styles.termsText}
               >
-                <CheckIcon
-                  color="uiSemanticSuccess"
-                  width={20}
-                  height={20}
+                <MaterialIcon
+                  icon="check"
+                  color="Icon/Feedback/Success"
+                  size={20}
                   className={styles.termsIcon}
-                ></CheckIcon>
+                />
                 {info}
               </Body>
             ))}
diff --git a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
index f215eed35..9906b5231 100644
--- a/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/Room/index.tsx
@@ -2,16 +2,12 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { CancellationRuleEnum } from "@/constants/booking"
 import { dt } from "@/lib/dt"
 
-import {
-  CheckCircleIcon,
-  ChevronRightSmallIcon,
-  CrossCircle,
-} from "@/components/Icons"
 import Image from "@/components/Image"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -42,14 +38,22 @@ export default function Room({ booking, img, roomName }: RoomProps) {
         <div className={styles.benefits}>
           {booking.rateDefinition.isMemberRate ? (
             <>
-              <CheckCircleIcon color="green" height={20} width={20} />
+              <MaterialIcon
+                color="Icon/Feedback/Success"
+                icon="check_circle"
+                size={20}
+              />
               <Caption>
                 {intl.formatMessage({ id: "Membership benefits applied" })}
               </Caption>
             </>
           ) : (
             <>
-              <CrossCircle color="red" height={20} width={20} />
+              <MaterialIcon
+                color="Icon/Interactive/Accent"
+                icon="cancel"
+                size={20}
+              />
               <Caption>
                 {intl.formatMessage({ id: "No membership benefits applied" })}
               </Caption>
@@ -58,7 +62,11 @@ export default function Room({ booking, img, roomName }: RoomProps) {
         </div>
         {booking.guaranteeInfo && (
           <div className={styles.benefits}>
-            <CheckCircleIcon color="green" height={20} width={20} />
+            <MaterialIcon
+              icon="check"
+              color="Icon/Feedback/Success"
+              size={20}
+            />
             <Typography variant="Body/Supporting text (caption)/smRegular">
               <p>
                 <strong>
@@ -90,7 +98,11 @@ export default function Room({ booking, img, roomName }: RoomProps) {
             </Subtitle>
             <Link color="burgundy" href="" variant="icon">
               {intl.formatMessage({ id: "View room details" })}
-              <ChevronRightSmallIcon color="burgundy" />
+              <MaterialIcon
+                icon="chevron_right"
+                size={20}
+                color="CurrentColor"
+              />
             </Link>
           </div>
           <ul className={styles.details}>
diff --git a/apps/scandic-web/components/HotelReservation/Contact/index.tsx b/apps/scandic-web/components/HotelReservation/Contact/index.tsx
index d5a5d9bda..64f405782 100644
--- a/apps/scandic-web/components/HotelReservation/Contact/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/Contact/index.tsx
@@ -2,7 +2,11 @@
 
 import { useIntl } from "react-intl"
 
-import { FacebookIcon, InstagramIcon } from "@/components/Icons"
+import {
+  FacebookIcon,
+  InstagramIcon,
+} from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -64,12 +68,12 @@ export default function Contact({ hotel }: ContactProps) {
                 <div className={styles.soMeIcons}>
                   {hotel.socialMedia.instagram && (
                     <Link href={hotel.socialMedia.instagram} target="_blank">
-                      <InstagramIcon color="burgundy" />
+                      <InstagramIcon color="Icon/Interactive/Default" />
                     </Link>
                   )}
                   {hotel.socialMedia.facebook && (
                     <Link href={hotel.socialMedia.facebook} target="_blank">
-                      <FacebookIcon color="burgundy" />
+                      <FacebookIcon color="Icon/Interactive/Default" />
                     </Link>
                   )}
                 </div>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/BedType/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/BedType/index.tsx
index 4cc9bf705..8a67d2da5 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/BedType/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/BedType/index.tsx
@@ -18,8 +18,9 @@ import { bedTypeFormSchema } from "./schema"
 
 import styles from "./bedOptions.module.css"
 
+import type { IconProps } from "@scandic-hotels/design-system/Icons"
+
 import type { BedTypeFormSchema } from "@/types/components/hotelReservation/enterDetails/bedType"
-import type { IconProps } from "@/types/components/icon"
 
 export default function BedType() {
   const {
@@ -113,10 +114,8 @@ function BedIconRenderer({
 
   return (
     <div className={`${props.className} ${styles.iconContainer}`}>
-      <MainBedIcon height={32} color="uiTextMediumContrast" />
-      {ExtraBedIcon && (
-        <ExtraBedIcon height={32} color="uiTextMediumContrast" />
-      )}
+      <MainBedIcon size={32} />
+      {ExtraBedIcon && <ExtraBedIcon size={32} />}
     </div>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Confirm/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Confirm/index.tsx
index 5f9d66cd7..0431286ca 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Confirm/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Confirm/index.tsx
@@ -5,11 +5,11 @@ import { useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 
 import { Button } from "@scandic-hotels/design-system/Button"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { PaymentMethodEnum } from "@/constants/booking"
 
-import { InfoCircleIcon } from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
@@ -56,11 +56,7 @@ export default function ConfirmBooking({
             className={styles.infoButton}
             onPress={() => setModalOpen(true)}
           >
-            <InfoCircleIcon
-              width={20}
-              height={20}
-              color="uiTextMediumContrast"
-            />
+            <MaterialIcon icon="info" size={20} color="CurrentColor" />
             {intl.formatMessage({ id: "How does it work" })}
           </Button>
 
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/Multiroom/JoinScandicFriendsCard/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/Multiroom/JoinScandicFriendsCard/index.tsx
index a43d704ba..71eda1232 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/Multiroom/JoinScandicFriendsCard/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/Multiroom/JoinScandicFriendsCard/index.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import { CheckIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import { useRoomContext } from "@/contexts/Details/Room"
@@ -65,7 +66,12 @@ export default function JoinScandicFriendsCard({
             className={styles.listItem}
             color="uiTextPlaceholder"
           >
-            <CheckIcon color="uiTextPlaceholder" height="20" /> {item.title}
+            <MaterialIcon
+              icon="check"
+              size={20}
+              color="Icon/Interactive/Placeholder"
+            />
+            {item.title}
           </Caption>
         ))}
       </div>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/JoinScandicFriendsCard/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/JoinScandicFriendsCard/index.tsx
index 5bc3e5d6d..595ead4ee 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/JoinScandicFriendsCard/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/JoinScandicFriendsCard/index.tsx
@@ -2,9 +2,10 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { privacyPolicy } from "@/constants/currentWebHrefs"
 
-import { CheckIcon } from "@/components/Icons"
 import LoginButton from "@/components/LoginButton"
 import Checkbox from "@/components/TempDesignSystem/Form/Checkbox"
 import Link from "@/components/TempDesignSystem/Link"
@@ -85,7 +86,12 @@ export default function JoinScandicFriendsCard({
             color="uiTextPlaceholder"
             className={styles.listItem}
           >
-            <CheckIcon color="uiTextPlaceholder" height="20" /> {item.title}
+            <MaterialIcon
+              icon="check"
+              color="Icon/Interactive/Placeholder"
+              size={20}
+            />
+            {item.title}
           </Caption>
         ))}
       </div>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/MemberPriceModal/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/MemberPriceModal/index.tsx
index 0f638d797..5f861aad0 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/MemberPriceModal/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/MemberPriceModal/index.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import { MagicWandIcon } from "@/components/Icons"
+import { MagicWandIcon } from "@scandic-hotels/design-system/Icons"
+
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/SpecialRequests/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/SpecialRequests/index.tsx
index 002b7a7ca..5aeb8467e 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Details/SpecialRequests/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Details/SpecialRequests/index.tsx
@@ -1,7 +1,8 @@
 import { useState } from "react"
 import { useIntl } from "react-intl"
 
-import { ChevronDownIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Divider from "@/components/TempDesignSystem/Divider"
 import TextArea from "@/components/TempDesignSystem/Form/TextArea"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
@@ -28,7 +29,7 @@ export default function SpecialRequests() {
         >
           {intl.formatMessage({ id: "Special requests" })}
         </Footnote>
-        <ChevronDownIcon className={styles.chevron} />
+        <MaterialIcon icon="keyboard_arrow_down" className={styles.chevron} />
         <Divider className={styles.divider} color="subtle" />
       </button>
       <div className={styles.content}>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Header/ToggleSidePeek.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Header/ToggleSidePeek.tsx
index 635767498..3792be5dc 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Header/ToggleSidePeek.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Header/ToggleSidePeek.tsx
@@ -1,9 +1,10 @@
 "use client"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useSidePeekStore from "@/stores/sidepeek"
 
-import ChevronRight from "@/components/Icons/ChevronRight"
 import Button from "@/components/TempDesignSystem/Button"
 
 import styles from "./header.module.css"
@@ -29,7 +30,7 @@ export default function ToggleSidePeek({
       className={styles.toggle}
     >
       {intl.formatMessage({ id: "See hotel details" })}
-      <ChevronRight height="14" color="white" />
+      <MaterialIcon icon="chevron_right" size={14} color="Icon/Inverted" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Payment/GuaranteeDetails/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Payment/GuaranteeDetails/index.tsx
index f1f8f6783..aca6f976e 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Payment/GuaranteeDetails/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Payment/GuaranteeDetails/index.tsx
@@ -1,6 +1,7 @@
 import { useIntl } from "react-intl"
 
-import ChevronDown from "@/components/Icons/ChevronDown"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
@@ -13,7 +14,11 @@ export default function GuaranteeDetails() {
       <Caption color="burgundy" type="bold" asChild>
         <summary className={styles.summary}>
           {intl.formatMessage({ id: "How it works" })}
-          <ChevronDown color="burgundy" height={16} />
+          <MaterialIcon
+            icon="keyboard_arrow_down"
+            color="Icon/Interactive/Default"
+            size={16}
+          />
         </summary>
       </Caption>
       <section className={styles.content}>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/PriceChangeSummary/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/PriceChangeSummary/index.tsx
index d37e87656..239a4dccb 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/PriceChangeSummary/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/PriceChangeSummary/index.tsx
@@ -9,7 +9,8 @@ import {
 } from "react-aria-components"
 import { useIntl } from "react-intl"
 
-import { ChevronRightSmallIcon, CloseLargeIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -50,7 +51,7 @@ export default function PriceChangeSummary({
         onClick={() => toggleOpen((isOpen) => !isOpen)}
       >
         {intl.formatMessage({ id: "See price details" })}
-        <ChevronRightSmallIcon />
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
       </Button>
       <ModalOverlay isOpen={isOpen} onOpenChange={toggleOpen}>
         <Modal>
@@ -66,7 +67,7 @@ export default function PriceChangeSummary({
                     variant="clean"
                     className={styles.closeButton}
                   >
-                    <CloseLargeIcon height={20} width={20} />
+                    <MaterialIcon icon="close" size={20} color="CurrentColor" />
                   </Button>
                 </header>
                 <section>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/index.tsx
index 372a8eef6..7f5aaa1fa 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/PriceChangeDialog/index.tsx
@@ -1,9 +1,10 @@
 import { Dialog, Modal, ModalOverlay } from "react-aria-components"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useEnterDetailsStore } from "@/stores/enter-details"
 
-import { InfoCircleIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -75,7 +76,11 @@ export default function PriceChangeDialog({
         <Dialog aria-label={title} className={styles.dialog}>
           <header className={styles.header}>
             <div className={styles.titleContainer}>
-              <InfoCircleIcon height={48} width={48} color="burgundy" />
+              <MaterialIcon
+                icon="info"
+                size={48}
+                color="Icon/Interactive/Default"
+              />
               <Title
                 level="h1"
                 as="h3"
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx
index 166c756f7..f966cf246 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/SectionAccordion/index.tsx
@@ -2,7 +2,8 @@
 import { useEffect, useRef, useState } from "react"
 import { useIntl } from "react-intl"
 
-import { CheckIcon, ChevronDownIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { useRoomContext } from "@/contexts/Details/Room"
@@ -108,7 +109,7 @@ export default function SectionAccordion({
       <div className={styles.iconWrapper}>
         <div className={styles.circle} data-checked={isStepComplete}>
           {isStepComplete ? (
-            <CheckIcon color="white" height="16" width="16" />
+            <MaterialIcon icon="check" color="Icon/Inverted" size={16} />
           ) : null}
         </div>
       </div>
@@ -131,9 +132,10 @@ export default function SectionAccordion({
             {title}
           </Subtitle>
           {isStepComplete && (
-            <ChevronDownIcon
+            <MaterialIcon
+              icon="keyboard_arrow_down"
               className={`${styles.button} ${isOpen ? styles.buttonOpen : ""}`}
-              color="burgundy"
+              color="Icon/Interactive/Default"
             />
           )}
         </button>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/ToggleSidePeek.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/ToggleSidePeek.tsx
index 0c8d5be9d..b42eb8d49 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/ToggleSidePeek.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/ToggleSidePeek.tsx
@@ -2,9 +2,10 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useSidePeekStore from "@/stores/sidepeek"
 
-import ChevronRight from "@/components/Icons/ChevronRight"
 import Button from "@/components/TempDesignSystem/Button"
 
 import { SidePeekEnum } from "@/types/components/hotelReservation/sidePeek"
@@ -31,7 +32,7 @@ export default function ToggleSidePeek({
       wrapping
     >
       {title ? title : intl.formatMessage({ id: "See room details" })}
-      <ChevronRight height="14" />
+      <MaterialIcon icon="chevron_right" size={14} color="CurrentColor" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/index.tsx
index 6fb79d0b6..08a16d3c6 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/SelectedRoom/index.tsx
@@ -4,10 +4,11 @@ import { useRouter } from "next/navigation"
 import { useTransition } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { selectRate } from "@/constants/routes/hotelReservation"
 import { useEnterDetailsStore } from "@/stores/enter-details"
 
-import { CheckIcon, EditIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
@@ -43,7 +44,7 @@ export default function SelectedRoom() {
     <div className={styles.wrapper} data-available={room.isAvailable}>
       <div className={styles.iconWrapper}>
         <div className={styles.circle}>
-          <CheckIcon color="white" height="16" width="16" />
+          <MaterialIcon icon="check" color="Icon/Inverted" size={16} />
         </div>
       </div>
       <div className={styles.main}>
@@ -80,7 +81,7 @@ export default function SelectedRoom() {
             onClick={changeRoom}
             disabled={isPending}
           >
-            <EditIcon color="burgundy" />
+            <MaterialIcon icon="edit_square" color="CurrentColor" />
             <Caption color="burgundy" type="bold">
               {intl.formatMessage({ id: "Change room" })}
             </Caption>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/PriceDetailsTable/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/PriceDetailsTable/index.tsx
index d299b20dc..a857b5854 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/PriceDetailsTable/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/PriceDetailsTable/index.tsx
@@ -3,9 +3,10 @@
 import { Fragment } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
-import { PriceTagIcon } from "@/components/Icons"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import useLang from "@/hooks/useLang"
@@ -299,7 +300,7 @@ export default function PriceDetailsTable({
         {bookingCode && totalPrice.local.regularPrice && (
           <tr className={styles.row}>
             <td>
-              <PriceTagIcon />
+              <MaterialIcon icon="sell" />
               {bookingCode}
             </td>
             <td></td>
diff --git a/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/index.tsx b/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/index.tsx
index e1f5df2fa..204d953c7 100644
--- a/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/EnterDetails/Summary/UI/index.tsx
@@ -3,16 +3,12 @@
 import { Fragment } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
 import PriceDetailsModal from "@/components/HotelReservation/PriceDetailsModal"
 import SignupPromoDesktop from "@/components/HotelReservation/SignupPromo/Desktop"
-import {
-  ArrowRightIcon,
-  CheckIcon,
-  ChevronDownSmallIcon,
-  PriceTagIcon,
-} from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
@@ -92,7 +88,11 @@ export default function SummaryUI({
         </Subtitle>
         <Body className={styles.date} color="baseTextMediumContrast">
           {dt(booking.fromDate).locale(lang).format("ddd, D MMM")}
-          <ArrowRightIcon color="peach80" height={15} width={15} />
+          <MaterialIcon
+            icon="arrow_right"
+            color="Icon/Interactive/Secondary"
+            size={15}
+          />
           {dt(booking.toDate).locale(lang).format("ddd, D MMM")} ({nights})
         </Body>
         <Button
@@ -101,7 +101,11 @@ export default function SummaryUI({
           className={styles.chevronButton}
           onClick={handleToggleSummary}
         >
-          <ChevronDownSmallIcon height="20" width="20" />
+          <MaterialIcon
+            icon="keyboard_arrow_down"
+            size={20}
+            color="CurrentColor"
+          />
         </Button>
       </header>
       <Divider color="primaryLightSubtle" />
@@ -216,12 +220,12 @@ export default function SummaryUI({
                         color="uiTextHighContrast"
                         className={styles.termsText}
                       >
-                        <CheckIcon
-                          color="uiSemanticSuccess"
-                          width={20}
-                          height={20}
+                        <MaterialIcon
+                          icon="check"
+                          color="Icon/Feedback/Success"
+                          size={20}
                           className={styles.termsIcon}
-                        ></CheckIcon>
+                        />
                         {info}
                       </Body>
                     ))}
@@ -434,7 +438,7 @@ export default function SummaryUI({
         </div>
         {booking.bookingCode && (
           <div>
-            <PriceTagIcon />
+            <MaterialIcon icon="sell" />
             {booking.bookingCode}
           </div>
         )}
diff --git a/apps/scandic-web/components/HotelReservation/HotelCard/NoPriceAvailableCard/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCard/NoPriceAvailableCard/index.tsx
index 628fc4cf0..2bb5ce667 100644
--- a/apps/scandic-web/components/HotelReservation/HotelCard/NoPriceAvailableCard/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/NoPriceAvailableCard/index.tsx
@@ -1,6 +1,7 @@
 import { useIntl } from "react-intl"
 
-import { ErrorCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./noPriceAvailable.module.css"
@@ -11,7 +12,7 @@ export default function NoPriceAvailableCard() {
     <div className={styles.priceCard}>
       <div className={styles.noRooms}>
         <div>
-          <ErrorCircleIcon color="red" />
+          <MaterialIcon icon="error" color="Icon/Interactive/Accent" />
         </div>
         <Caption color="uiTextHighContrast">
           {intl.formatMessage({
diff --git a/apps/scandic-web/components/HotelReservation/HotelCard/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCard/index.tsx
index 7be2a24df..5ca70e796 100644
--- a/apps/scandic-web/components/HotelReservation/HotelCard/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/HotelCard/index.tsx
@@ -4,12 +4,12 @@ import { useParams } from "next/dist/client/components/navigation"
 import { memo, useCallback } from "react"
 import { useIntl } from "react-intl"
 
+import { HotelLogo, MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { selectRate } from "@/constants/routes/hotelReservation"
 import { useHotelsMapStore } from "@/stores/hotels-map"
 
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
-import { PriceTagIcon } from "@/components/Icons"
-import HotelLogo from "@/components/Icons/Logos"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import ImageGallery from "@/components/ImageGallery"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
@@ -135,10 +135,12 @@ function HotelCard({
           </Body>
           <div className={styles.facilities}>
             {amenities.map((facility) => {
-              const IconComponent = mapFacilityToIcon(facility.id)
+              const Icon = (
+                <FacilityToIcon id={facility.id} color="Icon/Default" />
+              )
               return (
                 <div className={styles.facilitiesItem} key={facility.id}>
-                  {IconComponent && <IconComponent color="grey80" />}
+                  {Icon && Icon}
                   <Caption color="uiTextMediumContrast">
                     {facility.name}
                   </Caption>
@@ -162,7 +164,7 @@ function HotelCard({
                 <span className={`${fullPrice ? styles.strikedText : ""}`}>
                   <IconChip
                     color="blue"
-                    icon={<PriceTagIcon height={20} width={20} />}
+                    icon={<MaterialIcon icon="sell" size={20} />}
                   >
                     {bookingCode}
                   </IconChip>
diff --git a/apps/scandic-web/components/HotelReservation/HotelCardDialog/HotelCardDialogImage/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCardDialog/HotelCardDialogImage/index.tsx
index 9c6ad0b3c..ff4f3db6e 100644
--- a/apps/scandic-web/components/HotelReservation/HotelCardDialog/HotelCardDialogImage/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/HotelCardDialog/HotelCardDialogImage/index.tsx
@@ -1,4 +1,5 @@
-import { TripAdvisorIcon } from "@/components/Icons"
+import { TripadvisorIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Chip from "@/components/TempDesignSystem/Chip"
 
@@ -32,7 +33,7 @@ export default function HotelCardDialogImage({
       )}
       <div className={styles.tripAdvisor}>
         <Chip className={styles.tripAdvisor}>
-          <TripAdvisorIcon color="burgundy" />
+          <TripadvisorIcon color="Icon/Interactive/Default" />
           {ratings}
         </Chip>
       </div>
diff --git a/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx
index 6c42d2b4d..e27515937 100644
--- a/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/HotelCardDialog/ListingHotelCardDialog/index.tsx
@@ -4,7 +4,7 @@ import { useIntl } from "react-intl"
 
 import { selectRate } from "@/constants/routes/hotelReservation"
 
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -68,12 +68,16 @@ export default function ListingHotelCardDialog({
           </div>
           <div className={styles.facilities}>
             {amenities.map((facility) => {
-              const IconComponent = mapFacilityToIcon(facility.id)
+              const Icon = (
+                <FacilityToIcon
+                  id={facility.id}
+                  size={20}
+                  color="Icon/Default"
+                />
+              )
               return (
                 <div className={styles.facilitiesItem} key={facility.id}>
-                  {IconComponent && (
-                    <IconComponent width={20} height={20} color="grey80" />
-                  )}
+                  {Icon && Icon}
                   <Caption color="uiTextMediumContrast">
                     {facility.name}
                   </Caption>
diff --git a/apps/scandic-web/components/HotelReservation/HotelCardDialog/StandaloneHotelCardDialog/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCardDialog/StandaloneHotelCardDialog/index.tsx
index 93f14cda5..4108a4c62 100644
--- a/apps/scandic-web/components/HotelReservation/HotelCardDialog/StandaloneHotelCardDialog/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/HotelCardDialog/StandaloneHotelCardDialog/index.tsx
@@ -4,7 +4,7 @@ import { useIntl } from "react-intl"
 
 import { selectRate } from "@/constants/routes/hotelReservation"
 
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -73,12 +73,12 @@ export default function StandaloneHotelCardDialog({
         </div>
         <div className={styles.facilities}>
           {amenities.slice(0, 3).map((facility) => {
-            const IconComponent = mapFacilityToIcon(facility.id)
+            const Icon = (
+              <FacilityToIcon id={facility.id} size={16} color="Icon/Default" />
+            )
             return (
               <div className={styles.facilitiesItem} key={facility.id}>
-                {IconComponent && (
-                  <IconComponent width={16} height={16} color="grey80" />
-                )}
+                {Icon && Icon}
                 <Footnote color="uiTextMediumContrast">
                   {facility.name}
                 </Footnote>
diff --git a/apps/scandic-web/components/HotelReservation/HotelCardDialog/index.tsx b/apps/scandic-web/components/HotelReservation/HotelCardDialog/index.tsx
index b120d478f..e43f0e88e 100644
--- a/apps/scandic-web/components/HotelReservation/HotelCardDialog/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/HotelCardDialog/index.tsx
@@ -3,7 +3,7 @@
 import { useParams } from "next/navigation"
 import { useState } from "react"
 
-import { CloseLargeIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import ListingHotelCardDialog from "./ListingHotelCardDialog"
 import StandaloneHotelCardDialog from "./StandaloneHotelCardDialog"
@@ -30,12 +30,10 @@ export default function HotelCardDialog({
   return (
     <dialog open={isOpen} className={styles.dialog}>
       <div className={styles.dialogContainer} data-type={type}>
-        <CloseLargeIcon
-          onClick={handleClose}
-          className={styles.closeIcon}
-          width={16}
-          height={16}
-        />
+        <div onClick={handleClose}>
+          <MaterialIcon icon="close" className={styles.closeIcon} size={16} />
+        </div>
+
         {type === "standalone" ? (
           <StandaloneHotelCardDialog
             data={data}
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/ActionButtons/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/ActionButtons/index.tsx
index f5e83adc9..6f842cf86 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/ActionButtons/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/ActionButtons/index.tsx
@@ -3,15 +3,14 @@ import { useIntl } from "react-intl"
 import { useMediaQuery } from "usehooks-ts"
 
 import { Button } from "@scandic-hotels/design-system/Button"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import {
   AncillaryStepEnum,
   useAddAncillaryStore,
 } from "@/stores/my-stay/add-ancillary-flow"
 
-import { ChevronDownSmallIcon, ChevronUpSmallIcon } from "@/components/Icons"
-
-import { type  AncillaryFormData,quantitySchema } from "../../schema"
+import { type AncillaryFormData, quantitySchema } from "../../schema"
 
 import styles from "./actionButtons.module.css"
 
@@ -81,16 +80,16 @@ export default function ActionButtons({
         >
           {intl.formatMessage({ id: "Price details" })}
           {isPriceDetailsOpen ? (
-            <ChevronUpSmallIcon
-              width={20}
-              height={20}
-              color="baseButtonTextOnFillNormal"
+            <MaterialIcon
+              icon="keyboard_arrow_up"
+              size={20}
+              color="Icon/Interactive/Accent"
             />
           ) : (
-            <ChevronDownSmallIcon
-              width={20}
-              height={20}
-              color="baseButtonTextOnFillNormal"
+            <MaterialIcon
+              icon="keyboard_arrow_down"
+              size={20}
+              color="Icon/Interactive/Accent"
             />
           )}
         </Button>
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectQuantityStep/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectQuantityStep/index.tsx
index 8160e36be..e2a10579a 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectQuantityStep/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddAncillaryFlow/AddAncillaryFlowModal/Steps/SelectQuantityStep/index.tsx
@@ -1,11 +1,11 @@
 import { useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { useAddAncillaryStore } from "@/stores/my-stay/add-ancillary-flow"
 
-import { DiamondIcon } from "@/components/Icons"
 import ErrorMessage from "@/components/TempDesignSystem/Form/ErrorMessage"
 import Select from "@/components/TempDesignSystem/Form/Select"
 
@@ -63,7 +63,7 @@ export default function SelectQuantityStep({ user }: SelectQuantityStepProps) {
           </Typography>
           <div className={styles.totalPointsContainer}>
             <div className={styles.totalPoints}>
-              <DiamondIcon />
+              <MaterialIcon icon="diamond" />
               <Typography variant="Title/Overline/sm">
                 <h2>{intl.formatMessage({ id: "Total points" })}</h2>
               </Typography>
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/RemoveButton.tsx b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/RemoveButton.tsx
index eb4903646..653a560a9 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/RemoveButton.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/RemoveButton.tsx
@@ -1,9 +1,10 @@
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { trpc } from "@/lib/trpc/client"
 
 import Dialog from "@/components/Dialog"
-import { DeleteIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import { toast } from "@/components/TempDesignSystem/Toasts"
 import useLang from "@/hooks/useLang"
@@ -34,7 +35,7 @@ export default function RemoveButton({
       titleText={`${intl.formatMessage({ id: "Remove" })} ${title}`}
       trigger={
         <Button intent="text" size="small" variant="icon" theme="base">
-          <DeleteIcon />
+          <MaterialIcon icon="delete" color="CurrentColor" />
           {intl.formatMessage({ id: "Remove" })}
         </Button>
       }
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/index.tsx
index b6bdae0c2..69ab6c262 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/AddedAncillaries/index.tsx
@@ -1,7 +1,8 @@
 import { useRouter } from "next/navigation"
 import { useIntl } from "react-intl"
 
-import { CheckCircleIcon, EditIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Accordion from "@/components/TempDesignSystem/Accordion"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Button from "@/components/TempDesignSystem/Button"
@@ -48,7 +49,12 @@ export function AddedAncillaries({
             <Accordion className={styles.ancillaryMobile}>
               <AccordionItem
                 title={ancillaryTitle}
-                icon={<CheckCircleIcon color="uiSemanticSuccess" />}
+                icon={
+                  <MaterialIcon
+                    icon="check_circle"
+                    color="Icon/Feedback/Success"
+                  />
+                }
               >
                 <div>
                   {ancillary.comment && (
@@ -84,7 +90,7 @@ export function AddedAncillaries({
                         variant="icon"
                         theme="base"
                       >
-                        <EditIcon />
+                        <MaterialIcon icon="edit_square" color="CurrentColor" />
                         {intl.formatMessage({ id: "Modify" })}
                       </Button>
                       <Divider
@@ -105,7 +111,10 @@ export function AddedAncillaries({
             <div className={styles.ancillaryDesktop}>
               <div className={styles.specification}>
                 <div className={styles.name}>
-                  <CheckCircleIcon color="uiSemanticSuccess" />
+                  <MaterialIcon
+                    icon="check_circle"
+                    color="Icon/Feedback/Success"
+                  />
                   <Body textTransform="bold">{ancillaryTitle}</Body>
                   <Body textTransform="bold">{`X${ancillary.totalUnit}`}</Body>
                 </div>
@@ -140,7 +149,7 @@ export function AddedAncillaries({
                       variant="icon"
                       theme="base"
                     >
-                      <EditIcon />
+                      <MaterialIcon icon="edit_square" color="CurrentColor" />
                       {intl.formatMessage({ id: "Modify" })}
                     </Button>
                     <Divider
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/ViewAllAncillaries/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/ViewAllAncillaries/index.tsx
index 294e597de..2e5ea7672 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/ViewAllAncillaries/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Ancillaries/ViewAllAncillaries/index.tsx
@@ -1,8 +1,9 @@
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useAddAncillaryStore } from "@/stores/my-stay/add-ancillary-flow"
 
-import { ChevronRightSmallIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 
 export default function ViewAllAncillaries() {
@@ -17,11 +18,7 @@ export default function ViewAllAncillaries() {
       onClick={openModal}
     >
       {intl.formatMessage({ id: "View all" })}
-      <ChevronRightSmallIcon
-        width={20}
-        height={20}
-        color="baseButtonTextOnFillNormal"
-      />
+      <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/index.tsx
index 733e0753a..8ebaa7dee 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/BookingSummary/index.tsx
@@ -2,19 +2,13 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { CancellationRuleEnum } from "@/constants/booking"
 import { dt } from "@/lib/dt"
 import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsStore"
 
-import {
-  CheckCircleIcon,
-  DirectionsIcon,
-  EmailIcon,
-  LinkIcon,
-} from "@/components/Icons"
-import CrossCircleIcon from "@/components/Icons/CrossCircle"
 import IconChip from "@/components/TempDesignSystem/IconChip"
 import { Toast } from "@/components/TempDesignSystem/Toasts"
 import useLang from "@/hooks/useLang"
@@ -81,8 +75,14 @@ export default function BookingSummary({ hotel }: BookingSummaryProps) {
           chip={
             isCancelled ? (
               <IconChip
-                color={"red"}
-                icon={<CrossCircleIcon width={20} height={20} color="red" />}
+                color="red"
+                icon={
+                  <MaterialIcon
+                    icon="cancel"
+                    size={20}
+                    color="Icon/Feedback/Error"
+                  />
+                }
               >
                 <Typography variant="Body/Supporting text (caption)/smBold">
                   <span>{intl.formatMessage({ id: "Cancelled" })}</span>
@@ -93,9 +93,17 @@ export default function BookingSummary({ hotel }: BookingSummaryProps) {
                 color={isPaid ? "green" : "red"}
                 icon={
                   isPaid ? (
-                    <CheckCircleIcon width={20} height={20} color="green" />
+                    <MaterialIcon
+                      icon="check_circle"
+                      size={20}
+                      color="Icon/Feedback/Success"
+                    />
                   ) : (
-                    <CrossCircleIcon width={20} height={20} color="red" />
+                    <MaterialIcon
+                      icon="cancel"
+                      size={20}
+                      color="Icon/Interactive/Accent"
+                    />
                   )
                 }
               >
@@ -136,19 +144,37 @@ export default function BookingSummary({ hotel }: BookingSummaryProps) {
             {
               href: directionsUrl,
               text: intl.formatMessage({ id: "Directions" }),
-              icon: <DirectionsIcon width={20} height={20} color="burgundy" />,
+              icon: (
+                <MaterialIcon
+                  icon="directions"
+                  size={20}
+                  color="Icon/Interactive/Default"
+                />
+              ),
               onClick: () => trackMyStayPageLink("see on map"),
             },
             {
               href: `mailto:${hotel.contactInformation.email}`,
               text: intl.formatMessage({ id: "Email" }),
-              icon: <EmailIcon width={20} height={20} color="burgundy" />,
+              icon: (
+                <MaterialIcon
+                  icon="mail"
+                  size={20}
+                  color="Icon/Interactive/Default"
+                />
+              ),
               onClick: () => trackMyStayPageLink("email us"),
             },
             {
               href: hotel.contactInformation.websiteUrl,
               text: intl.formatMessage({ id: "Homepage" }),
-              icon: <LinkIcon width={20} height={20} color="burgundy" />,
+              icon: (
+                <MaterialIcon
+                  icon="link"
+                  size={20}
+                  color="Icon/Interactive/Default"
+                />
+              ),
               onClick: () => trackMyStayPageLink("hotel homepage"),
             },
           ]}
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/GuestDetails/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/GuestDetails/index.tsx
index 1a4079b6b..74c33c388 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/GuestDetails/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/GuestDetails/index.tsx
@@ -6,12 +6,12 @@ import { Dialog } from "react-aria-components"
 import { FormProvider, useForm } from "react-hook-form"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { trpc } from "@/lib/trpc/client"
 import { type Room } from "@/stores/my-stay/myStayRoomDetailsStore"
 
-import { DiamondIcon, EditIcon } from "@/components/Icons"
 import MembershipLevelIcon from "@/components/Levels/Icon"
 import Modal from "@/components/Modal"
 import { ModalContentWithActions } from "@/components/Modal/ModalContentWithActions"
@@ -140,7 +140,7 @@ export default function GuestDetails({
           </div>
           <div className={styles.totalPoints}>
             <div className={styles.totalPointsText}>
-              <DiamondIcon color="uiTextHighContrast" />
+              <MaterialIcon icon="diamond" color="Icon/Intense" />
 
               <Typography variant="Title/Overline/sm">
                 <p>{intl.formatMessage({ id: "Total points" })}</p>
@@ -197,7 +197,11 @@ export default function GuestDetails({
           disabled={booking.isCancelled}
           size="small"
         >
-          <EditIcon color="burgundy" width={20} height={20} />
+          <MaterialIcon
+            icon="edit"
+            color="Icon/Interactive/Default"
+            size={20}
+          />
           <Typography variant="Body/Paragraph/mdRegular">
             <span>{intl.formatMessage({ id: "Modify guest details" })}</span>
           </Typography>
@@ -214,7 +218,11 @@ export default function GuestDetails({
             disabled={booking.isCancelled}
             size="small"
           >
-            <EditIcon color="burgundy" width={20} height={20} />
+            <MaterialIcon
+              icon="edit"
+              color="Icon/Interactive/Default"
+              size={20}
+            />
             <Typography variant="Body/Paragraph/mdRegular">
               <span>{intl.formatMessage({ id: "Modify guest details" })}</span>
             </Typography>
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/AddToCalendarButton.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/AddToCalendarButton.tsx
index 315d7502a..83cd00fc6 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/AddToCalendarButton.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/AddToCalendarButton.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import { CalendarAddIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import { trackMyStayPageLink } from "@/utils/tracking"
 
@@ -29,7 +30,7 @@ export default function AddToCalendarButton({
       onPress={handleAddToCalendar}
     >
       {intl.formatMessage({ id: "Add to calendar" })}
-      <CalendarAddIcon width={24} height={24} color="burgundy" />
+      <MaterialIcon icon="calendar_add_on" color="CurrentColor" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/NewDates/CalendarButton/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/NewDates/CalendarButton/index.tsx
index d661c516f..e49bd27a1 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/NewDates/CalendarButton/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/Actions/ModifyStay/NewDates/CalendarButton/index.tsx
@@ -2,10 +2,9 @@
 
 import { Button as ButtonRAC } from "react-aria-components"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import { CalendarIcon } from "@/components/Icons"
-
 import styles from "./calendarButton.module.css"
 
 interface CalendarButtonProps {
@@ -19,7 +18,7 @@ export default function CalendarButton({ text, onClick }: CalendarButtonProps) {
       <Typography variant="Body/Paragraph/mdRegular">
         <span>{text}</span>
       </Typography>
-      <CalendarIcon />
+      <MaterialIcon icon="calendar_today" />
     </ButtonRAC>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/index.tsx
index 40c9a442d..1f06afe99 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/ActionPanel/index.tsx
@@ -2,20 +2,15 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { customerService } from "@/constants/currentWebHrefs"
+import { preliminaryReceipt } from "@/constants/routes/myStay"
 import { useManageStayStore } from "@/stores/my-stay/manageStayStore"
 import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsStore"
-import { preliminaryReceipt } from "@/constants/routes/myStay"
 
 import AddToCalendar from "@/components/HotelReservation/AddToCalendar"
 import { generateDateTime } from "@/components/HotelReservation/BookingConfirmation/Header/Actions/helpers"
-import {
-  CalendarIcon,
-  ChevronRightIcon,
-  CreditCard,
-  CrossCircleOutlineIcon,
-  DownloadIcon,
-} from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -109,7 +104,7 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
           className={styles.button}
         >
           {intl.formatMessage({ id: "Modify dates" })}
-          <CalendarIcon width={24} height={24} color="burgundy" />
+          <MaterialIcon icon="calendar_month" color="CurrentColor" />
         </Button>
         {showGuaranteeButton && (
           <Button
@@ -119,7 +114,7 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
             className={styles.button}
           >
             {intl.formatMessage({ id: "Guarantee late arrival" })}
-            <CreditCard width={24} height={24} color="burgundy" />
+            <MaterialIcon icon="credit_card" color="CurrentColor" />
           </Button>
         )}
         <AddToCalendar
@@ -136,7 +131,7 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
           onClick={handleDownloadInvoice}
         >
           {intl.formatMessage({ id: "Download invoice" })}
-          <DownloadIcon width={24} height={24} color="burgundy" />
+          <MaterialIcon icon="download" color="CurrentColor" />
         </Link>
         {showCancelStayButton && (
           <Button
@@ -146,7 +141,7 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
             className={styles.button}
           >
             {intl.formatMessage({ id: "Cancel stay" })}
-            <CrossCircleOutlineIcon width={24} height={24} color="burgundy" />
+            <MaterialIcon icon="cancel" color="CurrentColor" />
           </Button>
         )}
       </div>
@@ -184,7 +179,7 @@ export default function ActionPanel({ hotel }: ActionPanelProps) {
           <Caption color="burgundy">
             {intl.formatMessage({ id: "Customer support" })}
           </Caption>
-          <ChevronRightIcon width={20} height={20} color="burgundy" />
+          <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
         </Link>
       </div>
     </div>
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/index.tsx
index 8b42f7705..28afced7e 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/ManageStay/index.tsx
@@ -2,10 +2,11 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useManageStayStore } from "@/stores/my-stay/manageStayStore"
 import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsStore"
 
-import { ChevronDownIcon } from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 
@@ -74,7 +75,7 @@ export default function ManageStay({
         disabled={allRoomsCancelled}
       >
         {intl.formatMessage({ id: "Manage stay" })}
-        <ChevronDownIcon width={24} height={24} color="burgundy" />
+        <MaterialIcon icon="keyboard_arrow_down" color="Icon/Inverted" />
       </Button>
       {isOpen && (
         <Modal
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/ToggleSidePeek.tsx b/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/ToggleSidePeek.tsx
index da9aa3061..8232f9dd6 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/ToggleSidePeek.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/ToggleSidePeek.tsx
@@ -1,8 +1,9 @@
 "use client"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useSidePeekStore from "@/stores/sidepeek"
 
-import { ExpandIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 
 import styles from "./toggleSidePeek.module.css"
@@ -36,7 +37,7 @@ export default function ToggleSidePeek({
       wrapping
     >
       <div className={styles.iconContainer}>
-        <ExpandIcon />
+        <MaterialIcon icon="pan_zoom" color="CurrentColor" />
       </div>
     </Button>
   )
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/index.tsx
index 027e906a7..e87c19ddf 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/MultiRoom/index.tsx
@@ -2,6 +2,7 @@
 import { use, useEffect } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { BookingStatusEnum } from "@/constants/booking"
@@ -9,13 +10,12 @@ import { dt } from "@/lib/dt"
 import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsStore"
 import { useMyStayTotalPriceStore } from "@/stores/my-stay/myStayTotalPrice"
 
-import CrossCircleIcon from "@/components/Icons/CrossCircle"
 import Image from "@/components/Image"
 import Divider from "@/components/TempDesignSystem/Divider"
 import IconChip from "@/components/TempDesignSystem/IconChip"
 import useLang from "@/hooks/useLang"
 
-import { getIconForFeatureCode } from "../../utils"
+import { IconForFeatureCode } from "../../utils"
 import Price from "../Price"
 import { hasBreakfastPackage } from "../utils/hasBreakfastPackage"
 import { mapRoomDetails } from "../utils/mapRoomDetails"
@@ -156,7 +156,13 @@ export default function MultiRoom({
         {isCancelled ? (
           <IconChip
             color={"red"}
-            icon={<CrossCircleIcon width={20} height={20} color="red" />}
+            icon={
+              <MaterialIcon
+                icon="cancel"
+                size={20}
+                color="Icon/Feedback/Error"
+              />
+            }
           >
             <Typography variant="Body/Supporting text (caption)/smBold">
               <span>{intl.formatMessage({ id: "Cancelled" })}</span>
@@ -216,10 +222,13 @@ export default function MultiRoom({
                 )
               )
               .map((item) => {
-                const Icon = getIconForFeatureCode(item.code)
                 return (
                   <span className={styles.package} key={item.code}>
-                    <Icon width={16} height={16} color="burgundy" />
+                    <IconForFeatureCode
+                      featureCode={item.code}
+                      size={16}
+                      color="Icon/Interactive/Default"
+                    />
                   </span>
                 )
               })}
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/PriceDetails/PriceDetailsTable/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/PriceDetails/PriceDetailsTable/index.tsx
index cd145a7d0..d6a5825df 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/PriceDetails/PriceDetailsTable/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/PriceDetails/PriceDetailsTable/index.tsx
@@ -3,11 +3,11 @@
 import { Fragment } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { dt } from "@/lib/dt"
 
-import { PriceTagIcon } from "@/components/Icons"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import useLang from "@/hooks/useLang"
@@ -286,7 +286,7 @@ export default function PriceDetailsTable({
         {bookingCode && totalPrice.local.regularPrice && (
           <tr className={styles.row}>
             <td>
-              <PriceTagIcon />
+              <MaterialIcon icon="sell" />
               {bookingCode}
             </td>
             <td></td>
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/Receipt/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/Receipt/index.tsx
index 77034c7eb..2f3798db2 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/Receipt/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/Receipt/index.tsx
@@ -1,6 +1,7 @@
 import { cookies } from "next/headers"
 import { notFound } from "next/navigation"
 
+import { ScandicLogoIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { dt } from "@/lib/dt"
@@ -11,7 +12,6 @@ import {
 } from "@/lib/trpc/memoizedRequests"
 import { decrypt } from "@/server/routers/utils/encryption"
 
-import { ScandicLogoIcon } from "@/components/Icons"
 import { getIntl } from "@/i18n"
 
 import AdditionalInfoForm from "../../FindMyBooking/AdditionalInfoForm"
@@ -60,7 +60,7 @@ export async function Receipt({ refId }: { refId: string }) {
     return (
       <main className={styles.main}>
         <div>
-          <ScandicLogoIcon width="89px" height="19px" color="red" />
+          <ScandicLogoIcon width="89px" height="19px" color="Icon/Accent" />
           <div className={styles.addresses}>
             <div>
               <Typography variant="Body/Supporting text (caption)/smRegular">
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/index.tsx
index 57d2f13f3..c106afb0d 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/index.tsx
@@ -3,6 +3,10 @@
 import { useEffect } from "react"
 import { useIntl } from "react-intl"
 
+import {
+  Discount22Icon,
+  MaterialIcon,
+} from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { BookingStatusEnum } from "@/constants/booking"
@@ -10,7 +14,6 @@ import { dt } from "@/lib/dt"
 import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsStore"
 import { useMyStayTotalPriceStore } from "@/stores/my-stay/myStayTotalPrice"
 
-import { BookingCodeIcon, CheckCircleIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
 import IconChip from "@/components/TempDesignSystem/IconChip"
@@ -244,7 +247,11 @@ export function ReferenceCard({
       {booking.guaranteeInfo && !allRoomsCancelled && (
         <>
           <div className={styles.guaranteed}>
-            <CheckCircleIcon color="green" height={20} width={20} />
+            <MaterialIcon
+              icon="check_circle"
+              color="Icon/Feedback/Success"
+              size={20}
+            />
             <Typography variant="Body/Supporting text (caption)/smRegular">
               <p className={styles.guaranteedText}>
                 <strong>
@@ -271,7 +278,10 @@ export function ReferenceCard({
           <Typography variant="Title/Overline/sm">
             <p>{intl.formatMessage({ id: "Booking code" })}</p>
           </Typography>
-          <IconChip color={"blue"} icon={<BookingCodeIcon color="blue" />}>
+          <IconChip
+            color="blue"
+            icon={<Discount22Icon color="Icon/Feedback/Information" />}
+          >
             <Typography variant="Body/Supporting text (caption)/smBold">
               <p className={styles.bookingCode}>
                 <strong>{intl.formatMessage({ id: "Booking code" })}</strong>:{" "}
@@ -281,7 +291,6 @@ export function ReferenceCard({
           </IconChip>
         </div>
       )}
-
       <div className={styles.actionArea}>
         <ManageStay
           hotel={hotel}
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/ToggleSidePeek.tsx b/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/ToggleSidePeek.tsx
index c4ecf6df7..d2cce4511 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/ToggleSidePeek.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/ToggleSidePeek.tsx
@@ -2,9 +2,10 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useSidePeekStore from "@/stores/sidepeek"
 
-import ChevronRight from "@/components/Icons/ChevronRight"
 import Button from "@/components/TempDesignSystem/Button"
 
 import { SidePeekEnum } from "@/types/components/hotelReservation/sidePeek"
@@ -35,7 +36,7 @@ export default function ToggleSidePeek({
       wrapping
     >
       {title ? title : intl.formatMessage({ id: "See room details" })}
-      <ChevronRight height="14" />
+      <MaterialIcon icon="chevron_right" size={14} color="CurrentColor" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/index.tsx b/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/index.tsx
index 3c994f2cd..7b666e654 100644
--- a/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/MyStay/SingleRoom/index.tsx
@@ -2,21 +2,16 @@
 
 import { useIntl } from "react-intl"
 
+import {
+  Discount22Icon,
+  MaterialIcon,
+} from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { dt } from "@/lib/dt"
 import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsStore"
 
-import { getIconForFeatureCode } from "@/components/HotelReservation/utils"
-import {
-  BedDoubleIcon,
-  BookingCodeIcon,
-  CoffeeIcon,
-  ContractIcon,
-  DoorOpenIcon,
-  PersonIcon,
-} from "@/components/Icons"
-import Refresh from "@/components/Icons/Refresh"
+import { IconForFeatureCode } from "@/components/HotelReservation/utils"
 import Image from "@/components/Image"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import IconChip from "@/components/TempDesignSystem/IconChip"
@@ -168,10 +163,13 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
                     )
                   )
                   .map((item) => {
-                    const Icon = getIconForFeatureCode(item.code)
                     return (
                       <span className={styles.package} key={item.code}>
-                        <Icon width={16} height={16} color="burgundy" />
+                        <IconForFeatureCode
+                          featureCode={item.code}
+                          size={16}
+                          color="Icon/Interactive/Default"
+                        />
                       </span>
                     )
                   })}
@@ -191,7 +189,11 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
               <div className={styles.bookingDetails}>
                 <div className={styles.row}>
                   <span className={styles.rowTitle}>
-                    <PersonIcon color="grey80" width={20} height={20} />
+                    <MaterialIcon
+                      icon="person"
+                      color="Icon/Default"
+                      size={20}
+                    />
                     <Typography variant="Body/Paragraph/mdBold">
                       <p>{intl.formatMessage({ id: "Guests" })}</p>
                     </Typography>
@@ -208,7 +210,11 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
                 </div>
                 <div className={styles.row}>
                   <span className={styles.rowTitle}>
-                    <ContractIcon color="grey80" width={20} height={20} />
+                    <MaterialIcon
+                      icon="contract"
+                      color="Icon/Default"
+                      size={20}
+                    />
                     <Typography variant="Body/Paragraph/mdBold">
                       <p>{intl.formatMessage({ id: "Terms" })}</p>
                     </Typography>
@@ -223,7 +229,11 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
                 </div>
                 <div className={styles.row}>
                   <span className={styles.rowTitle}>
-                    <Refresh color="grey80" width={20} height={20} />
+                    <MaterialIcon
+                      icon="refresh"
+                      color="Icon/Default"
+                      size={20}
+                    />
                     <Typography variant="Body/Paragraph/mdBold">
                       <p>{intl.formatMessage({ id: "Modify By" })}</p>
                     </Typography>
@@ -241,7 +251,11 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
                 </div>
                 <div className={styles.row}>
                   <span className={styles.rowTitle}>
-                    <CoffeeIcon color="grey80" width={20} height={20} />
+                    <MaterialIcon
+                      icon="coffee"
+                      color="Icon/Default"
+                      size={20}
+                    />
                     <Typography variant="Body/Paragraph/mdBold">
                       <p>{intl.formatMessage({ id: "Breakfast" })}</p>
                     </Typography>
@@ -263,7 +277,11 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
                 {hasPackages && (
                   <div className={styles.row}>
                     <span className={styles.rowTitle}>
-                      <DoorOpenIcon color="grey80" width={20} height={20} />
+                      <MaterialIcon
+                        icon="meeting_room"
+                        color="Icon/Default"
+                        size={20}
+                      />
                       <Typography variant="Body/Paragraph/mdBold">
                         <p>
                           {intl.formatMessage({ id: "Room classification" })}
@@ -289,7 +307,7 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
 
                 <div className={styles.row}>
                   <span className={styles.rowTitle}>
-                    <BedDoubleIcon color="grey80" width={20} height={20} />
+                    <MaterialIcon icon="bed" color="Icon/Default" size={20} />
                     <Typography variant="Body/Paragraph/mdBold">
                       <p>{intl.formatMessage({ id: "Bed preference" })}</p>
                     </Typography>
@@ -318,7 +336,10 @@ export function SingleRoom({ bedType, image, hotel, user }: RoomProps) {
           </div>
           <div className={styles.bookingInformation}>
             {bookingCode && (
-              <IconChip color={"blue"} icon={<BookingCodeIcon color="blue" />}>
+              <IconChip
+                color="blue"
+                icon={<Discount22Icon color="Icon/Feedback/Information" />}
+              >
                 <Typography variant="Body/Supporting text (caption)/smBold">
                   <p className={styles.bookingCode}>
                     <strong>
diff --git a/apps/scandic-web/components/HotelReservation/PriceDetailsModal.tsx b/apps/scandic-web/components/HotelReservation/PriceDetailsModal.tsx
index 02f7bd5bf..98684e192 100644
--- a/apps/scandic-web/components/HotelReservation/PriceDetailsModal.tsx
+++ b/apps/scandic-web/components/HotelReservation/PriceDetailsModal.tsx
@@ -1,7 +1,8 @@
 "use client"
 import { useIntl } from "react-intl"
 
-import ChevronRightSmallIcon from "@/components/Icons/ChevronRightSmall"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -19,7 +20,7 @@ export default function PriceDetailsModal({
           <Caption color="burgundy">
             {intl.formatMessage({ id: "Price details" })}
           </Caption>
-          <ChevronRightSmallIcon color="burgundy" height="20px" width="20px" />
+          <MaterialIcon icon="chevron_right" color="CurrentColor" size={20} />
         </Button>
       }
     >
diff --git a/apps/scandic-web/components/HotelReservation/ReadMore/index.tsx b/apps/scandic-web/components/HotelReservation/ReadMore/index.tsx
index dbbc4312c..2f9116ba7 100644
--- a/apps/scandic-web/components/HotelReservation/ReadMore/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/ReadMore/index.tsx
@@ -1,8 +1,9 @@
 "use client"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useSidePeekStore from "@/stores/sidepeek"
 
-import { ChevronRightIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 
 import styles from "./readMore.module.css"
@@ -23,11 +24,7 @@ export default function ReadMore({ label, hotelId, showCTA }: ReadMoreProps) {
       className={styles.detailsButton}
     >
       {label}
-      <ChevronRightIcon
-        color="baseButtonTextOnFillNormal"
-        height={20}
-        width={20}
-      />
+      <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/index.tsx
index fe544bfc2..1dbfbd6d0 100644
--- a/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectHotel/BookingCodeFilter/index.tsx
@@ -2,9 +2,10 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useBookingCodeFilterStore } from "@/stores/bookingCode-filter"
 
-import { PriceTagIcon } from "@/components/Icons"
 import Select from "@/components/TempDesignSystem/Select"
 
 import styles from "./bookingCodeFilter.module.css"
@@ -50,7 +51,7 @@ export default function BookingCodeFilter() {
           label=""
           items={bookingCodeFilterItems}
           defaultSelectedKey={activeCodeFilter}
-          optionsIcon={<PriceTagIcon />}
+          optionsIcon={<MaterialIcon icon="sell" />}
         />
       </div>
     </>
diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/FilterAndSortModal/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/FilterAndSortModal/index.tsx
index 4f8e6bcaf..de9b900c4 100644
--- a/apps/scandic-web/components/HotelReservation/SelectHotel/FilterAndSortModal/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectHotel/FilterAndSortModal/index.tsx
@@ -13,9 +13,10 @@ import {
 } from "react-aria-components"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useHotelFilterStore } from "@/stores/hotel-filters"
 
-import { CloseLargeIcon, FilterIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
 import Select from "@/components/TempDesignSystem/Select"
@@ -95,7 +96,7 @@ export default function FilterAndSortModal({
     <>
       <DialogTrigger>
         <Button intent="secondary" size="small" theme="base" variant="icon">
-          <FilterIcon color="baseTextHighcontrast" />
+          <MaterialIcon icon="filter_alt" color="Icon/Intense" />
           {intl.formatMessage({ id: "Filter and sort" })}
           {activeFilters.length > 0 && (
             <Footnote className={styles.badge}>{activeFilters.length}</Footnote>
@@ -112,7 +113,7 @@ export default function FilterAndSortModal({
                       type="button"
                       className={styles.close}
                     >
-                      <CloseLargeIcon />
+                      <MaterialIcon icon="close" />
                     </button>
                     <Subtitle
                       type="two"
diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/HotelFilter/FilterCheckbox/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/HotelFilter/FilterCheckbox/index.tsx
index 6767f666b..b7a35043a 100644
--- a/apps/scandic-web/components/HotelReservation/SelectHotel/HotelFilter/FilterCheckbox/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectHotel/HotelFilter/FilterCheckbox/index.tsx
@@ -2,7 +2,7 @@
 
 import { Checkbox as AriaCheckbox } from "react-aria-components"
 
-import CheckIcon from "@/components/Icons/Check"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import styles from "./filterCheckbox.module.css"
 
@@ -24,7 +24,9 @@ export default function FilterCheckbox({
         <>
           <span className={styles.checkboxContainer}>
             <span className={styles.checkbox}>
-              {isSelected && <CheckIcon color="white" />}
+              {isSelected && (
+                <MaterialIcon icon="check" color="Icon/Inverted" />
+              )}
             </span>
             {name}
           </span>
diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/MobileMapButtonContainer/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/MobileMapButtonContainer/index.tsx
index 031b8c65f..e6593f96e 100644
--- a/apps/scandic-web/components/HotelReservation/SelectHotel/MobileMapButtonContainer/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectHotel/MobileMapButtonContainer/index.tsx
@@ -2,12 +2,13 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import {
   alternativeHotelsMap,
   selectHotelMap,
 } from "@/constants/routes/hotelReservation"
 
-import { MapIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Link from "@/components/TempDesignSystem/Link"
 import useLang from "@/hooks/useLang"
@@ -45,7 +46,7 @@ export default function MobileMapButtonContainer({
           keepSearchParams
           weight="bold"
         >
-          <MapIcon color="baseTextHighcontrast" />
+          <MaterialIcon icon="map" color="Icon/Intense" />
           {intl.formatMessage({ id: "See on map" })}
         </Link>
       </Button>
diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx
index 49923cd55..a51417ccc 100644
--- a/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx
@@ -4,13 +4,14 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react"
 import { useIntl } from "react-intl"
 import { useMediaQuery } from "usehooks-ts"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { selectHotel } from "@/constants/routes/hotelReservation"
 import { useBookingCodeFilterStore } from "@/stores/bookingCode-filter"
 import { useHotelFilterStore } from "@/stores/hotel-filters"
 import { useHotelsMapStore } from "@/stores/hotels-map"
 
 import { RoomCardSkeleton } from "@/components/HotelReservation/RoomCardSkeleton/RoomCardSkeleton"
-import { CloseIcon, CloseLargeIcon } from "@/components/Icons"
 import InteractiveMap from "@/components/Maps/InteractiveMap"
 import { BackToTopButton } from "@/components/TempDesignSystem/BackToTopButton"
 import Button from "@/components/TempDesignSystem/Button"
@@ -134,7 +135,7 @@ export default function SelectHotelContent({
       asChild
     >
       <Link href={selectHotel(lang)} keepSearchParams prefetch>
-        <CloseIcon color="burgundy" />
+        <MaterialIcon icon="close" size={20} color="CurrentColor" />
         {intl.formatMessage({ id: "Close the map" })}
       </Link>
     </Button>
@@ -153,7 +154,7 @@ export default function SelectHotelContent({
             asChild
           >
             <Link href={selectHotel(lang)} keepSearchParams>
-              <CloseLargeIcon />
+              <MaterialIcon icon="close" color="CurrentColor" />
             </Link>
           </Button>
           <FilterAndSortModal
diff --git a/apps/scandic-web/components/HotelReservation/SelectHotel/index.tsx b/apps/scandic-web/components/HotelReservation/SelectHotel/index.tsx
index 17ec6b1e0..af8528438 100644
--- a/apps/scandic-web/components/HotelReservation/SelectHotel/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectHotel/index.tsx
@@ -2,6 +2,8 @@ import stringify from "json-stable-stringify-without-jsonify"
 import { notFound } from "next/navigation"
 import { Suspense } from "react"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import {
   alternativeHotels,
   alternativeHotelsMap,
@@ -9,7 +11,6 @@ import {
   selectHotelMap,
 } from "@/constants/routes/hotelReservation"
 
-import { ChevronRightIcon } from "@/components/Icons"
 import StaticMap from "@/components/Maps/StaticMap"
 import Breadcrumbs from "@/components/TempDesignSystem/Breadcrumbs"
 import Button from "@/components/TempDesignSystem/Button"
@@ -217,10 +218,10 @@ export default async function SelectHotel({
                 />
                 <Button wrapping size="medium" intent="text" theme="base">
                   {intl.formatMessage({ id: "See map" })}
-                  <ChevronRightIcon
-                    color="baseButtonTextOnFillNormal"
-                    width={20}
-                    height={20}
+                  <MaterialIcon
+                    icon="chevron_right"
+                    size={20}
+                    color="CurrentColor"
                   />
                 </Button>
               </div>
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx
index ee81ed1ea..9bbb1970e 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/HotelInfoCard/index.tsx
@@ -1,4 +1,4 @@
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import ImageGallery from "@/components/ImageGallery"
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import Alert from "@/components/TempDesignSystem/Alert"
@@ -67,15 +67,16 @@ export default async function HotelInfoCard({ hotel }: HotelInfoCardProps) {
                 {intl.formatMessage({ id: "At the hotel" })}
               </Body>
               {sortedFacilities?.map((facility) => {
-                const IconComponent = mapFacilityToIcon(facility.id)
+                const Icon = (
+                  <FacilityToIcon
+                    id={facility.id}
+                    className={styles.facilitiesIcon}
+                    color="Icon/Default"
+                  />
+                )
                 return (
                   <div className={styles.facilitiesItem} key={facility.id}>
-                    {IconComponent && (
-                      <IconComponent
-                        className={styles.facilitiesIcon}
-                        color="grey80"
-                      />
-                    )}
+                    {Icon && Icon}
                     <Body color="uiTextHighContrast">{facility.name}</Body>
                   </div>
                 )
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/PriceDetailsTable/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/PriceDetailsTable/index.tsx
index 367b1dab6..fde9f187d 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/PriceDetailsTable/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/PriceDetailsTable/index.tsx
@@ -3,9 +3,10 @@
 import { Fragment } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
-import { PriceTagIcon } from "@/components/Icons"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import useLang from "@/hooks/useLang"
@@ -177,7 +178,7 @@ export default function PriceDetailsTable({
         {bookingCode && totalPrice.local.regularPrice && (
           <tr className={styles.row}>
             <td>
-              <PriceTagIcon />
+              <MaterialIcon icon="sell" />
               {bookingCode}
             </td>
             <td></td>
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/Summary.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/Summary.tsx
index b5b9e9959..be8466c3f 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/Summary.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/RateSummary/MobileSummary/Summary.tsx
@@ -2,15 +2,12 @@
 import { Fragment } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { dt } from "@/lib/dt"
 
 import PriceDetailsModal from "@/components/HotelReservation/PriceDetailsModal"
 import SignupPromoDesktop from "@/components/HotelReservation/SignupPromo/Desktop"
-import {
-  ArrowRightIcon,
-  CheckIcon,
-  ChevronDownSmallIcon,
-} from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Divider from "@/components/TempDesignSystem/Divider"
@@ -75,7 +72,11 @@ export default function Summary({
         </Subtitle>
         <Body className={styles.date} color="baseTextMediumContrast">
           {dt(booking.fromDate).locale(lang).format("ddd, D MMM")}
-          <ArrowRightIcon color="peach80" height={15} width={15} />
+          <MaterialIcon
+            icon="arrow_forward"
+            size={15}
+            color="Icon/Interactive/Secondary"
+          />
           {dt(booking.toDate).locale(lang).format("ddd, D MMM")} ({nights})
         </Body>
         <Button
@@ -84,7 +85,11 @@ export default function Summary({
           className={styles.chevronButton}
           onClick={toggleSummaryOpen}
         >
-          <ChevronDownSmallIcon height="20" width="20" />
+          <MaterialIcon
+            icon="keyboard_arrow_down"
+            size={20}
+            color="CurrentColor"
+          />
         </Button>
       </header>
       <Divider color="primaryLightSubtle" />
@@ -186,12 +191,12 @@ export default function Summary({
                         color="uiTextHighContrast"
                         className={styles.termsText}
                       >
-                        <CheckIcon
-                          color="uiSemanticSuccess"
-                          width={20}
-                          height={20}
+                        <MaterialIcon
+                          icon="check"
+                          color="Icon/Feedback/Success"
+                          size={20}
                           className={styles.termsIcon}
-                        ></CheckIcon>
+                        />
                         {info}
                       </Body>
                     ))}
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/index.tsx
index 044b2f5fa..f541af37f 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/index.tsx
@@ -1,9 +1,10 @@
 "use client"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useRatesStore } from "@/stores/select-rate"
 
-import { EditIcon } from "@/components/Icons"
 import Image from "@/components/Image"
 import Button from "@/components/TempDesignSystem/Button"
 import Chip from "@/components/TempDesignSystem/Chip"
@@ -96,7 +97,7 @@ export default function SelectedRoomPanel() {
         <div className={styles.modifyButtonContainer}>
           <Button clean onClick={modifyRate}>
             <Chip size="small" variant="uiTextHighContrast">
-              <EditIcon />
+              <MaterialIcon icon="edit_square" />
               {intl.formatMessage({ id: "Modify" })}
             </Chip>
           </Button>
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/index.tsx
index 42e62326e..2686aac0e 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/index.tsx
@@ -1,9 +1,10 @@
 import { useEffect } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useRatesStore } from "@/stores/select-rate"
 
-import { ChevronUpIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { useRoomContext } from "@/contexts/SelectRate/Room"
@@ -93,7 +94,11 @@ export default function MultiRoomWrapper({
               variant="icon"
             >
               {intl.formatMessage({ id: "Close" })}
-              <ChevronUpIcon height={20} width={20} />
+              <MaterialIcon
+                icon="keyboard_arrow_up"
+                size={20}
+                color="CurrentColor"
+              />
             </Button>
           ) : null}
         </div>
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOption/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOption/index.tsx
index 0c8f121a4..5f02368f0 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOption/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOption/index.tsx
@@ -1,9 +1,10 @@
 "use client"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { useRatesStore } from "@/stores/select-rate"
 
-import { CheckIcon, InfoCircleIcon } from "@/components/Icons"
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Label from "@/components/TempDesignSystem/Form/Label"
@@ -57,7 +58,11 @@ export default function FlexibilityOption({
     return (
       <div className={styles.noPricesCard}>
         <div className={styles.header}>
-          <InfoCircleIcon width={16} height={16} color="uiTextMediumContrast" />
+          <MaterialIcon
+            icon="info"
+            size={16}
+            color="Icon/Interactive/Placeholder"
+          />
           <div className={styles.priceType}>
             <Caption>{title}</Caption>
             <Caption color="uiTextPlaceholder">({paymentTerm})</Caption>
@@ -108,10 +113,10 @@ export default function FlexibilityOption({
           <Modal
             trigger={
               <Button intent="text">
-                <InfoCircleIcon
-                  width={16}
-                  height={16}
-                  color="uiTextMediumContrast"
+                <MaterialIcon
+                  icon="info"
+                  size={16}
+                  color="Icon/Interactive/Placeholder"
                 />
               </Button>
             }
@@ -125,12 +130,12 @@ export default function FlexibilityOption({
                   color="uiTextHighContrast"
                   className={styles.termsText}
                 >
-                  <CheckIcon
-                    color="uiSemanticSuccess"
-                    width={20}
-                    height={20}
+                  <MaterialIcon
+                    icon="check"
+                    color="Icon/Feedback/Success"
+                    size={20}
                     className={styles.termsIcon}
-                  ></CheckIcon>
+                  />
                   {info}
                 </Body>
               ))}
@@ -149,7 +154,7 @@ export default function FlexibilityOption({
         />
 
         <div className={styles.checkIcon}>
-          <CheckIcon color="white" height="16" width="16" />
+          <MaterialIcon icon="check" color="Icon/Inverted" size={16} />
         </div>
       </div>
     </label>
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionCheque/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionCheque/index.tsx
index a16e0010c..49b0557b2 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionCheque/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionCheque/index.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import { CheckIcon, InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -71,11 +72,7 @@ export default function FlexibilityOptionCheque({
           <Modal
             trigger={
               <Button intent="text">
-                <InfoCircleIcon
-                  width={16}
-                  height={16}
-                  color="uiTextMediumContrast"
-                />
+                <MaterialIcon icon="info" size={16} color="Icon/Default" />
               </Button>
             }
             title={chequeRateName}
@@ -88,12 +85,12 @@ export default function FlexibilityOptionCheque({
                   color="uiTextHighContrast"
                   className={styles.termsText}
                 >
-                  <CheckIcon
-                    color="uiSemanticSuccess"
-                    width={20}
-                    height={20}
+                  <MaterialIcon
+                    icon="check"
+                    color="Icon/Feedback/Success"
+                    size={20}
                     className={styles.termsIcon}
-                  ></CheckIcon>
+                  />
                   {info}
                 </Body>
               ))}
@@ -110,7 +107,7 @@ export default function FlexibilityOptionCheque({
         />
 
         <div className={styles.checkIcon}>
-          <CheckIcon color="white" height="16" width="16" />
+          <MaterialIcon icon="check" color="Icon/Inverted" size={16} />
         </div>
       </div>
     </label>
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionPoints/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionPoints/index.tsx
index 96bb5500b..afc719910 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionPoints/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionPoints/index.tsx
@@ -1,7 +1,8 @@
 "use client"
 import { useIntl } from "react-intl"
 
-import { CheckIcon, InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Label from "@/components/TempDesignSystem/Form/Label"
@@ -38,7 +39,7 @@ export default function FlexibilityOptionPoints({
     return (
       <div className={styles.noPricesCard}>
         <div className={styles.header}>
-          <InfoCircleIcon width={16} height={16} color="uiTextMediumContrast" />
+          <MaterialIcon icon="info" size={16} />
           <div className={styles.priceType}>
             <Caption>{title}</Caption>
             <Caption color="uiTextPlaceholder">({paymentTerm})</Caption>
@@ -79,11 +80,7 @@ export default function FlexibilityOptionPoints({
           <Modal
             trigger={
               <Button intent="text">
-                <InfoCircleIcon
-                  width={16}
-                  height={16}
-                  color="uiTextMediumContrast"
-                />
+                <MaterialIcon icon="info" size={16} />
               </Button>
             }
             title={rewardNightTitle}
@@ -97,10 +94,10 @@ export default function FlexibilityOptionPoints({
                     color="uiTextHighContrast"
                     className={styles.termsText}
                   >
-                    <CheckIcon
-                      color="uiSemanticSuccess"
-                      width={20}
-                      height={20}
+                    <MaterialIcon
+                      icon="check"
+                      color="Icon/Feedback/Success"
+                      size={20}
                       className={styles.termsIcon}
                     />
                     {info}
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionVoucher/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionVoucher/index.tsx
index a07fe717b..5efecf19d 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionVoucher/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/FlexibilityOptionVoucher/index.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import { CheckIcon, InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Modal from "@/components/Modal"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -70,11 +71,7 @@ export default function FlexibilityOptionVoucher({
           <Modal
             trigger={
               <Button intent="text">
-                <InfoCircleIcon
-                  width={16}
-                  height={16}
-                  color="uiTextMediumContrast"
-                />
+                <MaterialIcon icon="info" size={16} color="Icon/Default" />
               </Button>
             }
             title={voucherRateName}
@@ -87,12 +84,12 @@ export default function FlexibilityOptionVoucher({
                   color="uiTextHighContrast"
                   className={styles.termsText}
                 >
-                  <CheckIcon
-                    color="uiSemanticSuccess"
-                    width={20}
-                    height={20}
+                  <MaterialIcon
+                    icon="check"
+                    color="Icon/Feedback/Success"
+                    size={20}
                     className={styles.termsIcon}
-                  ></CheckIcon>
+                  />
                   {info}
                 </Body>
               ))}
@@ -109,7 +106,7 @@ export default function FlexibilityOptionVoucher({
         />
 
         <div className={styles.checkIcon}>
-          <CheckIcon color="white" height="16" width="16" />
+          <MaterialIcon icon="check" color="Icon/Inverted" size={16} />
         </div>
       </div>
     </label>
diff --git a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/index.tsx b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/index.tsx
index 97aed4e26..ccacd9ac5 100644
--- a/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/index.tsx
@@ -4,12 +4,13 @@ import { useSearchParams } from "next/navigation"
 import { createElement } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { REDEMPTION } from "@/constants/booking"
 import { useRatesStore } from "@/stores/select-rate"
 
 import ToggleSidePeek from "@/components/HotelReservation/EnterDetails/SelectedRoom/ToggleSidePeek"
-import { getIconForFeatureCode } from "@/components/HotelReservation/utils"
-import { ErrorCircleIcon, PriceTagIcon } from "@/components/Icons"
+import { IconForFeatureCode } from "@/components/HotelReservation/utils"
 import ImageGallery from "@/components/ImageGallery"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
@@ -19,8 +20,8 @@ import { mapApiImagesToGalleryImages } from "@/utils/imageGallery"
 
 import { cardVariants } from "./cardVariants"
 import FlexibilityOption from "./FlexibilityOption"
-import FlexibilityOptionPoints from "./FlexibilityOptionPoints"
 import FlexibilityOptionCheque from "./FlexibilityOptionCheque"
+import FlexibilityOptionPoints from "./FlexibilityOptionPoints"
 import FlexibilityOptionVoucher from "./FlexibilityOptionVoucher"
 import RoomSize from "./RoomSize"
 
@@ -211,11 +212,12 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
             .filter((feature) => selectedPackage === feature.code)
             .map((feature) => (
               <span className={styles.chip} key={feature.code}>
-                {createElement(getIconForFeatureCode(feature.code), {
-                  color: "burgundy",
-                  height: 16,
-                  width: 16,
-                })}
+                {createElement(() => (
+                  <IconForFeatureCode
+                    featureCode={feature.code}
+                    color={"Icon/Interactive/Default"}
+                  />
+                ))}
               </span>
             ))}
         </div>
@@ -271,7 +273,11 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
             <div></div>
             <div className={styles.noRoomsContainer}>
               <div className={styles.noRooms}>
-                <ErrorCircleIcon color="red" width={16} />
+                <MaterialIcon
+                  icon="error"
+                  color="Icon/Interactive/Accent"
+                  size={16}
+                />
                 <Caption color="uiTextHighContrast" type="bold">
                   {intl.formatMessage({
                     id: "This room is not available",
@@ -288,7 +294,7 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
               )}
               {bookingCode ? (
                 <span className={!isBookingCodeRate ? styles.strikedText : ""}>
-                  <PriceTagIcon />
+                  <MaterialIcon icon="sell" />
                   {bookingCode}
                 </span>
               ) : null}
@@ -315,15 +321,18 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
                 roomTypeCode: roomConfiguration.roomTypeCode,
                 title: rateTitle,
                 rateName:
-                  isBookingCodeRate || isRedemption ||
+                  isBookingCodeRate ||
+                  isRedemption ||
                   product.voucher ||
                   product.bonusCheque
                     ? rateDefinition?.title
                     : undefined,
               }
-              return (<>
-                  {isRedemption &&
-                  <FlexibilityOptionPoints key={product.rate} {...props} />}
+              return (
+                <>
+                  {isRedemption && (
+                    <FlexibilityOptionPoints key={product.rate} {...props} />
+                  )}
                   {product.voucher ? (
                     <FlexibilityOptionVoucher
                       key={product.rate}
diff --git a/apps/scandic-web/components/HotelReservation/TripAdvisorChip/index.tsx b/apps/scandic-web/components/HotelReservation/TripAdvisorChip/index.tsx
index 199a4f70b..e0b5128ee 100644
--- a/apps/scandic-web/components/HotelReservation/TripAdvisorChip/index.tsx
+++ b/apps/scandic-web/components/HotelReservation/TripAdvisorChip/index.tsx
@@ -1,4 +1,5 @@
-import { TripAdvisorIcon } from "@/components/Icons"
+import { TripadvisorIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./tripAdvisorChip.module.css"
@@ -10,7 +11,7 @@ export default function TripAdvisorChip({ rating }: TripAdvisorProps) {
     // Wrapping the chip in a transparent container with some padding to increase the touch target
     <div className={styles.container}>
       <div className={styles.tripAdvisor}>
-        <TripAdvisorIcon color="burgundy" />
+        <TripadvisorIcon color="Icon/Interactive/Default" />
         <Caption color="burgundy">{rating}</Caption>
       </div>
     </div>
diff --git a/apps/scandic-web/components/HotelReservation/utils.ts b/apps/scandic-web/components/HotelReservation/utils.tsx
similarity index 75%
rename from apps/scandic-web/components/HotelReservation/utils.ts
rename to apps/scandic-web/components/HotelReservation/utils.tsx
index a313ec98e..f21cba4c7 100644
--- a/apps/scandic-web/components/HotelReservation/utils.ts
+++ b/apps/scandic-web/components/HotelReservation/utils.tsx
@@ -1,6 +1,9 @@
-import { ChildBedTypeEnum } from "@/constants/booking"
+import {
+  MaterialIcon,
+  type MaterialIconSetIconProps,
+} from "@scandic-hotels/design-system/Icons"
 
-import { AllergyIcon, PetsIcon, WheelchairIcon } from "@/components/Icons"
+import { ChildBedTypeEnum } from "@/constants/booking"
 
 import { ChildBedMapEnum } from "@/types/components/bookingWidget/enums"
 import {
@@ -9,15 +12,21 @@ import {
 } from "@/types/components/hotelReservation/selectRate/roomFilter"
 import type { Child } from "@/types/components/hotelReservation/selectRate/selectRate"
 
-export function getIconForFeatureCode(featureCode: RoomPackageCodes) {
+interface IconForFeatureCodeProps {
+  featureCode: RoomPackageCodes
+}
+export function IconForFeatureCode({
+  featureCode,
+  ...props
+}: IconForFeatureCodeProps & MaterialIconSetIconProps): JSX.Element {
   switch (featureCode) {
     case RoomPackageCodeEnum.ACCESSIBILITY_ROOM:
-      return WheelchairIcon
+      return <MaterialIcon icon="accessible" {...props} />
     case RoomPackageCodeEnum.ALLERGY_ROOM:
-      return AllergyIcon
+      return <MaterialIcon icon="mode_fan" {...props} />
     case RoomPackageCodeEnum.PET_ROOM:
     default:
-      return PetsIcon
+      return <MaterialIcon icon="pets" {...props} />
   }
 }
 
diff --git a/apps/scandic-web/components/Icons/Ac.tsx b/apps/scandic-web/components/Icons/Ac.tsx
deleted file mode 100644
index b8b5a781a..000000000
--- a/apps/scandic-web/components/Icons/Ac.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function AcIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M3.19995 20.8V6.13458C3.19995 5.31983 3.48554 4.62703 4.05673 4.0562C4.62791 3.48537 5.32148 3.19995 6.13745 3.19995H9.99995C10.8159 3.19995 11.5095 3.48513 12.0807 4.0555C12.6519 4.62587 12.9375 5.31846 12.9375 6.13328V20.8H3.19995ZM9.93745 15.0625H11.0625V9.93745H9.93745V15.0625ZM5.07495 18.925H11.0625V16.9375H9.93745C9.42182 16.9375 8.98041 16.7539 8.61323 16.3867C8.24604 16.0195 8.06245 15.5781 8.06245 15.0625V9.93745C8.06245 9.42182 8.24604 8.98041 8.61323 8.61323C8.98041 8.24604 9.42182 8.06245 9.93745 8.06245H11.0625V6.13745C11.0625 5.83642 10.9606 5.58408 10.757 5.38043C10.5533 5.17678 10.301 5.07495 9.99995 5.07495H6.13745C5.83642 5.07495 5.58408 5.17678 5.38043 5.38043C5.17678 5.58408 5.07495 5.83642 5.07495 6.13745V18.925ZM17.0875 13.5125C16.6671 13.5125 16.2549 13.4565 15.8507 13.3445C15.4465 13.2325 15.0505 13.0885 14.6625 12.9125L15.25 11.1375C15.5748 11.2803 15.8956 11.3994 16.2124 11.4946C16.5291 11.5898 16.8291 11.6375 17.1125 11.6375C17.318 11.6375 17.5236 11.6041 17.7291 11.5375C17.9347 11.4708 18.15 11.3666 18.375 11.225C18.7686 10.9465 19.1622 10.7581 19.5558 10.6599C19.9494 10.5616 20.3266 10.5125 20.6875 10.5125C21.0881 10.5125 21.5007 10.5666 21.9254 10.675C22.3501 10.7833 22.7541 10.9208 23.1375 11.0875L22.55 12.875C22.2333 12.7666 21.9062 12.6583 21.5687 12.55C21.2312 12.4416 20.9391 12.3875 20.6923 12.3875C20.4807 12.3875 20.252 12.427 20.0062 12.5062C19.7604 12.5854 19.5 12.7166 19.225 12.9C18.8833 13.1333 18.536 13.2937 18.1831 13.3812C17.8302 13.4687 17.465 13.5125 17.0875 13.5125ZM17.1125 9.61245C16.6958 9.61245 16.2791 9.5562 15.8625 9.4437C15.4458 9.3312 15.0458 9.18908 14.6625 9.01733L15.25 7.23745C15.675 7.42078 16.0333 7.54995 16.325 7.62495C16.6166 7.69995 16.8791 7.73745 17.1125 7.73745C17.318 7.73745 17.5236 7.7062 17.7291 7.6437C17.9347 7.5812 18.15 7.47495 18.375 7.32495C18.785 7.0465 19.1827 6.85814 19.5681 6.75988C19.9535 6.66159 20.3266 6.61245 20.6875 6.61245C21.0902 6.61245 21.493 6.66453 21.8958 6.7687C22.2986 6.87287 22.7125 7.01245 23.1375 7.18745L22.55 8.97495C22.125 8.83328 21.7666 8.71662 21.475 8.62495C21.1833 8.53328 20.9208 8.48745 20.6875 8.48745C20.4627 8.48745 20.2336 8.52078 20.0001 8.58745C19.7667 8.65412 19.5083 8.79162 19.225 8.99995C18.9333 9.20828 18.6027 9.36245 18.2332 9.46245C17.8637 9.56245 17.4902 9.61245 17.1125 9.61245ZM17.1147 17.4125C16.6882 17.4125 16.2708 17.3562 15.8625 17.2437C15.4541 17.1312 15.0541 16.9875 14.6625 16.8125L15.25 15.0375C15.6 15.1875 15.9333 15.3083 16.25 15.4C16.5666 15.4916 16.8541 15.5375 17.1125 15.5375C17.318 15.5375 17.5236 15.5062 17.7291 15.4437C17.9347 15.3812 18.15 15.275 18.375 15.125C18.7583 14.8666 19.1604 14.6833 19.5812 14.575C20.002 14.4666 20.3791 14.4125 20.7125 14.4125C21.1166 14.4125 21.5289 14.4684 21.9492 14.5802C22.3695 14.692 22.7656 14.8277 23.1375 14.9875L22.55 16.775C22.125 16.6333 21.7625 16.5166 21.4625 16.425C21.1625 16.3333 20.9041 16.2875 20.6875 16.2875C20.4541 16.2875 20.2125 16.327 19.9625 16.4062C19.7125 16.4854 19.4666 16.6166 19.225 16.8C18.95 16.9916 18.6279 17.1416 18.2588 17.25C17.8898 17.3583 17.5084 17.4125 17.1147 17.4125Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Accesories.tsx b/apps/scandic-web/components/Icons/Accesories.tsx
deleted file mode 100644
index 4ca631cee..000000000
--- a/apps/scandic-web/components/Icons/Accesories.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function AccesoriesIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6.40085 22C5.55984 22 4.80868 21.4739 4.52127 20.6835L1.56362 12.5499C1.23633 11.6499 1.593 10.6442 2.41421 10.1515L6 8V3C6 2.44772 6.44772 2 7 2H9C9.55229 2 10 2.44772 10 3V8L13.5858 10.1515C14.407 10.6442 14.7637 11.6499 14.4364 12.5499L11.4787 20.6835C11.1913 21.4739 10.4402 22 9.59915 22H6.40085ZM17 22C16.7167 22 16.4792 21.9042 16.2875 21.7125C16.0958 21.5208 16 21.2833 16 21C16 20.7167 16.0958 20.4792 16.2875 20.2875C16.4792 20.0958 16.7167 20 17 20H20V18H17C16.7167 18 16.4792 17.9042 16.2875 17.7125C16.0958 17.5208 16 17.2833 16 17C16 16.7167 16.0958 16.4792 16.2875 16.2875C16.4792 16.0958 16.7167 16 17 16H20V14H17C16.7167 14 16.4792 13.9042 16.2875 13.7125C16.0958 13.5208 16 13.2833 16 13C16 12.7167 16.0958 12.4792 16.2875 12.2875C16.4792 12.0958 16.7167 12 17 12H20V10H17C16.7167 10 16.4792 9.90417 16.2875 9.7125C16.0958 9.52083 16 9.28333 16 9C16 8.71667 16.0958 8.47917 16.2875 8.2875C16.4792 8.09583 16.7167 8 17 8H20V6H17C16.7167 6 16.4792 5.90417 16.2875 5.7125C16.0958 5.52083 16 5.28333 16 5C16 4.71667 16.0958 4.47917 16.2875 4.2875C16.4792 4.09583 16.7167 4 17 4H21C21.55 4 22.0208 4.19583 22.4125 4.5875C22.8042 4.97917 23 5.45 23 6V20C23 20.55 22.8042 21.0208 22.4125 21.4125C22.0208 21.8042 21.55 22 21 22H17ZM6.16123 19.3404C6.30454 19.7363 6.68048 20 7.10153 20H8.89847C9.31952 20 9.69546 19.7363 9.83877 19.3404L12.2691 12.6261C12.4322 12.1755 12.2527 11.6726 11.8412 11.427L9.45 10H6.55L4.15876 11.427C3.74728 11.6726 3.56783 12.1755 3.73092 12.6261L6.16123 19.3404Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Accessibility.tsx b/apps/scandic-web/components/Icons/Accessibility.tsx
deleted file mode 100644
index bf711678d..000000000
--- a/apps/scandic-web/components/Icons/Accessibility.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function AccessibilityIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12.0001 6.0499C11.4584 6.0499 10.998 5.86032 10.6188 5.48115C10.2397 5.10199 10.0501 4.64157 10.0501 4.0999C10.0501 3.55824 10.2397 3.09782 10.6188 2.71865C10.998 2.33949 11.4584 2.1499 12.0001 2.1499C12.5418 2.1499 13.0022 2.33949 13.3813 2.71865C13.7605 3.09782 13.9501 3.55824 13.9501 4.0999C13.9501 4.64157 13.7605 5.10199 13.3813 5.48115C13.0022 5.86032 12.5418 6.0499 12.0001 6.0499ZM9.1251 20.8624V8.9749H4.1626C3.90426 8.9749 3.68343 8.88324 3.5001 8.6999C3.31676 8.51657 3.2251 8.29574 3.2251 8.0374C3.2251 7.77907 3.31676 7.55824 3.5001 7.3749C3.68343 7.19157 3.90426 7.0999 4.1626 7.0999H19.8376C20.0959 7.0999 20.3168 7.19157 20.5001 7.3749C20.6834 7.55824 20.7751 7.77907 20.7751 8.0374C20.7751 8.29574 20.6834 8.51657 20.5001 8.6999C20.3168 8.88324 20.0959 8.9749 19.8376 8.9749H14.8751V20.8624C14.8751 21.1207 14.7834 21.3416 14.6001 21.5249C14.4168 21.7082 14.1959 21.7999 13.9376 21.7999C13.6793 21.7999 13.4584 21.7082 13.2751 21.5249C13.0918 21.3416 13.0001 21.1207 13.0001 20.8624V15.9249H11.0001V20.8624C11.0001 21.1207 10.9084 21.3416 10.7251 21.5249C10.5418 21.7082 10.3209 21.7999 10.0626 21.7999C9.80427 21.7999 9.58343 21.7082 9.4001 21.5249C9.21676 21.3416 9.1251 21.1207 9.1251 20.8624Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/AccountCircle.tsx b/apps/scandic-web/components/Icons/AccountCircle.tsx
deleted file mode 100644
index 5dfd606ee..000000000
--- a/apps/scandic-web/components/Icons/AccountCircle.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function AccountCircleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="41"
-      viewBox="0 0 40 41"
-      width="40"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M7.1 31.75C9.2 30.2833 11.2833 29.1583 13.35 28.375C15.4167 27.5917 17.6333 27.2 20 27.2C22.3667 27.2 24.5917 27.5917 26.675 28.375C28.7583 29.1583 30.85 30.2833 32.95 31.75C34.4167 29.95 35.4583 28.1333 36.075 26.3C36.6917 24.4667 37 22.5333 37 20.5C37 15.6667 35.375 11.625 32.125 8.375C28.875 5.125 24.8333 3.5 20 3.5C15.1667 3.5 11.125 5.125 7.875 8.375C4.625 11.625 3 15.6667 3 20.5C3 22.5333 3.31667 24.4667 3.95 26.3C4.58333 28.1333 5.63333 29.95 7.1 31.75ZM19.9907 22C18.0636 22 16.4417 21.3386 15.125 20.0157C13.8083 18.6928 13.15 17.0678 13.15 15.1407C13.15 13.2136 13.8114 11.5917 15.1343 10.275C16.4572 8.95833 18.0822 8.3 20.0093 8.3C21.9364 8.3 23.5583 8.96143 24.875 10.2843C26.1917 11.6072 26.85 13.2322 26.85 15.1593C26.85 17.0864 26.1886 18.7083 24.8657 20.025C23.5428 21.3417 21.9178 22 19.9907 22ZM20.0234 40.5C17.2745 40.5 14.6833 39.975 12.25 38.925C9.81667 37.875 7.69167 36.4417 5.875 34.625C4.05833 32.8083 2.625 30.6872 1.575 28.2617C0.525 25.8362 0 23.2445 0 20.4867C0 17.7289 0.525 15.1417 1.575 12.725C2.625 10.3083 4.05833 8.19167 5.875 6.375C7.69167 4.55833 9.81277 3.125 12.2383 2.075C14.6638 1.025 17.2555 0.5 20.0133 0.5C22.7711 0.5 25.3583 1.025 27.775 2.075C30.1917 3.125 32.3083 4.55833 34.125 6.375C35.9417 8.19167 37.375 10.3089 38.425 12.7266C39.475 15.1443 40 17.7277 40 20.4766C40 23.2255 39.475 25.8167 38.425 28.25C37.375 30.6833 35.9417 32.8083 34.125 34.625C32.3083 36.4417 30.1911 37.875 27.7734 38.925C25.3557 39.975 22.7723 40.5 20.0234 40.5ZM20 37.5C21.8333 37.5 23.625 37.2333 25.375 36.7C27.125 36.1667 28.85 35.2333 30.55 33.9C28.85 32.7 27.1167 31.7833 25.35 31.15C23.5833 30.5167 21.8 30.2 20 30.2C18.2 30.2 16.4167 30.5167 14.65 31.15C12.8833 31.7833 11.15 32.7 9.45 33.9C11.15 35.2333 12.875 36.1667 14.625 36.7C16.375 37.2333 18.1667 37.5 20 37.5ZM20 19C21.1333 19 22.0583 18.6417 22.775 17.925C23.4917 17.2083 23.85 16.2833 23.85 15.15C23.85 14.0167 23.4917 13.0917 22.775 12.375C22.0583 11.6583 21.1333 11.3 20 11.3C18.8667 11.3 17.9417 11.6583 17.225 12.375C16.5083 13.0917 16.15 14.0167 16.15 15.15C16.15 16.2833 16.5083 17.2083 17.225 17.925C17.9417 18.6417 18.8667 19 20 19Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Air.tsx b/apps/scandic-web/components/Icons/Air.tsx
deleted file mode 100644
index 75b19a56c..000000000
--- a/apps/scandic-web/components/Icons/Air.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function AirIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.5125 19.8C10.9884 19.8 10.5011 19.6708 10.0507 19.4125C9.60022 19.1541 9.24167 18.8 8.975 18.35C8.8 18.0416 8.79453 17.7312 8.9586 17.4187C9.12267 17.1062 9.37657 16.95 9.7203 16.95C9.92343 16.95 10.1042 17.0104 10.2625 17.1312C10.4208 17.252 10.5583 17.3916 10.675 17.55C10.764 17.675 10.8842 17.7687 11.0355 17.8312C11.1868 17.8937 11.3458 17.925 11.5125 17.925C11.7958 17.925 12.0375 17.825 12.2375 17.625C12.4375 17.425 12.5375 17.1833 12.5375 16.9C12.5375 16.6166 12.4375 16.375 12.2375 16.175C12.0375 15.975 11.7976 15.875 11.5178 15.875H3.125C2.86667 15.875 2.64583 15.7833 2.4625 15.6C2.27917 15.4166 2.1875 15.1958 2.1875 14.9375C2.1875 14.6791 2.27917 14.4583 2.4625 14.275C2.64583 14.0916 2.86667 14 3.125 14H11.5125C12.318 14 13.0028 14.2822 13.5667 14.8467C14.1306 15.4111 14.4125 16.0965 14.4125 16.9029C14.4125 17.7093 14.1306 18.3937 13.5667 18.9562C13.0028 19.5187 12.318 19.8 11.5125 19.8ZM3.125 9.99995C2.86667 9.99995 2.64583 9.90828 2.4625 9.72495C2.27917 9.54162 2.1875 9.32078 2.1875 9.06245C2.1875 8.80412 2.27917 8.58328 2.4625 8.39995C2.64583 8.21662 2.86667 8.12495 3.125 8.12495H15.4375C15.8611 8.12495 16.2212 7.97654 16.5177 7.67973C16.8142 7.38291 16.9625 7.02249 16.9625 6.59848C16.9625 6.17446 16.8148 5.81453 16.5193 5.5187C16.2237 5.22287 15.8649 5.07495 15.4428 5.07495C15.1726 5.07495 14.9208 5.13593 14.6875 5.25788C14.4542 5.37983 14.2708 5.55463 14.1375 5.78228C14.0208 5.97739 13.8816 6.15412 13.7199 6.31245C13.5581 6.47078 13.364 6.54995 13.1375 6.54995C12.8208 6.54995 12.5688 6.42495 12.3813 6.17495C12.1938 5.92495 12.1542 5.65828 12.2625 5.37495C12.4958 4.70828 12.9038 4.17912 13.4863 3.78745C14.0689 3.39578 14.7193 3.19995 15.4375 3.19995C16.3765 3.19995 17.178 3.53213 17.8418 4.19648C18.5056 4.86083 18.8375 5.66291 18.8375 6.60273C18.8375 7.54254 18.5056 8.3437 17.8418 9.0062C17.178 9.6687 16.3765 9.99995 15.4375 9.99995H3.125ZM19.85 17.5625C19.525 17.7041 19.2125 17.6864 18.9125 17.5094C18.6125 17.3323 18.4625 17.0745 18.4625 16.7358C18.4625 16.5202 18.5375 16.3354 18.6875 16.1812C18.8375 16.027 19.0083 15.9 19.2 15.8C19.4417 15.6666 19.625 15.478 19.75 15.2341C19.875 14.9901 19.9375 14.7287 19.9375 14.45C19.9375 14.0263 19.7892 13.6663 19.4927 13.3698C19.1962 13.0732 18.8361 12.925 18.4125 12.925H3.125C2.86667 12.925 2.64583 12.8333 2.4625 12.65C2.27917 12.4666 2.1875 12.2458 2.1875 11.9875C2.1875 11.7291 2.27917 11.5083 2.4625 11.325C2.64583 11.1416 2.86667 11.05 3.125 11.05H18.4125C19.3516 11.05 20.153 11.3813 20.8168 12.044C21.4806 12.7067 21.8125 13.5067 21.8125 14.4442C21.8125 15.123 21.637 15.7433 21.286 16.3049C20.935 16.8665 20.4563 17.2857 19.85 17.5625Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Airplane.tsx b/apps/scandic-web/components/Icons/Airplane.tsx
deleted file mode 100644
index e68a911b2..000000000
--- a/apps/scandic-web/components/Icons/Airplane.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function AirplaneIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M9.9251 21.125L7.4501 16.525L2.8501 14.05L4.6251 12.3L8.2501 12.925L10.8001 10.375L2.8751 7L4.9751 4.85L14.6001 6.55L17.7001 3.45C18.0834 3.06667 18.5584 2.875 19.1251 2.875C19.6918 2.875 20.1668 3.06667 20.5501 3.45C20.9334 3.83333 21.1251 4.30417 21.1251 4.8625C21.1251 5.42083 20.9334 5.89167 20.5501 6.275L17.4251 9.4L19.1251 19L17.0001 21.125L13.6001 13.2L11.0501 15.75L11.7001 19.35L9.9251 21.125Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Allergy.tsx b/apps/scandic-web/components/Icons/Allergy.tsx
deleted file mode 100644
index dd967759d..000000000
--- a/apps/scandic-web/components/Icons/Allergy.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function AllergyIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M8.83333 18.2812C8.14543 18.2812 7.62276 18.0729 7.26533 17.6562C6.90789 17.2396 6.72569 16.7708 6.71875 16.25C6.71875 15.9028 6.79688 15.5608 6.95312 15.224C7.10938 14.8872 7.35069 14.6111 7.67708 14.3958C7.98887 14.193 8.24043 13.9322 8.43175 13.6135C8.62308 13.2948 8.75694 12.9549 8.83333 12.5938C8.73611 12.5451 8.6441 12.4983 8.55729 12.4531C8.47049 12.408 8.38542 12.3542 8.30208 12.2917L6.35904 12.988C6.11968 13.0724 5.89075 13.1424 5.67225 13.1979C5.45375 13.2535 5.22842 13.2812 4.99627 13.2812C4.13592 13.2812 3.37458 12.9036 2.71225 12.1482C2.04992 11.3928 1.71875 10.2879 1.71875 8.83333C1.71875 8.14583 1.92361 7.62153 2.33333 7.26042C2.74306 6.89931 3.20673 6.71875 3.72435 6.71875C4.07852 6.71875 4.42587 6.79691 4.76642 6.95323C5.10697 7.10956 5.38622 7.35085 5.60417 7.67708C5.80699 7.98887 6.06776 8.24043 6.3865 8.43175C6.70522 8.62308 7.04514 8.75694 7.40625 8.83333C7.45486 8.73611 7.50174 8.6441 7.54688 8.55729C7.59201 8.47049 7.64583 8.38542 7.70833 8.30208L7.01042 6.35417C6.92708 6.1235 6.85764 5.89963 6.80208 5.68254C6.74653 5.46545 6.71875 5.24835 6.71875 5.03125C6.73264 4.16319 7.11534 3.3941 7.86685 2.72396C8.61837 2.05382 9.71831 1.71875 11.1667 1.71875C11.8542 1.71875 12.3785 1.92521 12.7396 2.33812C13.1007 2.75104 13.2812 3.21472 13.2812 3.72917C13.2812 4.07639 13.2031 4.42188 13.0469 4.76562C12.8906 5.10938 12.6493 5.38889 12.3229 5.60417C12.0111 5.80699 11.7596 6.06776 11.5682 6.3865C11.3769 6.70522 11.2431 7.04514 11.1667 7.40625C11.2639 7.45486 11.3559 7.50174 11.4427 7.54688C11.5295 7.59201 11.6146 7.64583 11.6979 7.70833L13.641 6.99115C13.8803 6.90677 14.1058 6.84028 14.3175 6.79167C14.5292 6.74306 14.7511 6.71875 14.9832 6.71875C16.0894 6.71875 16.9156 7.17875 17.4619 8.09875C18.0081 9.01876 18.2812 10.0414 18.2812 11.1667C18.2812 11.8546 18.0642 12.3772 17.6302 12.7347C17.1962 13.0921 16.7153 13.2743 16.1875 13.2812C15.8542 13.2812 15.5269 13.2031 15.2057 13.0468C14.8845 12.8904 14.6145 12.6492 14.3958 12.3229C14.193 12.0111 13.9322 11.7596 13.6135 11.5682C13.2948 11.3769 12.9549 11.2431 12.5938 11.1667C12.5451 11.2639 12.4983 11.3559 12.4531 11.4427C12.408 11.5295 12.3542 11.6146 12.2917 11.6979L12.9896 13.6458C13.066 13.8611 13.1337 14.0747 13.1927 14.2865C13.2517 14.4983 13.2812 14.7083 13.2812 14.9167C13.2743 15.7917 12.8959 16.5712 12.1461 17.2552C11.3963 17.9392 10.2921 18.2812 8.83333 18.2812ZM9.9994 11.3021C10.3609 11.3021 10.6684 11.1755 10.9219 10.9225C11.1753 10.6694 11.3021 10.3621 11.3021 10.0006C11.3021 9.63909 11.1755 9.3316 10.9225 9.07812C10.6694 8.82465 10.3621 8.69792 10.0006 8.69792C9.63909 8.69792 9.3316 8.82445 9.07812 9.07752C8.82465 9.33058 8.69792 9.63787 8.69792 9.9994C8.69792 10.3609 8.82445 10.6684 9.07752 10.9219C9.33058 11.1753 9.63787 11.3021 9.9994 11.3021ZM9.01042 7.3125C9.10764 7.27778 9.20733 7.25 9.30948 7.22917C9.41165 7.20833 9.50988 7.19097 9.60417 7.17708C9.71528 6.59375 9.92708 6.04861 10.2396 5.54167C10.5521 5.03472 10.9618 4.61806 11.4688 4.29167C11.5521 4.22917 11.6146 4.15327 11.6562 4.06398C11.6979 3.9747 11.7188 3.8631 11.7188 3.72917C11.7188 3.60343 11.6727 3.49735 11.5807 3.41092C11.4887 3.32447 11.3507 3.28125 11.1667 3.28125C10.6287 3.28125 10.0202 3.39938 9.34129 3.63565C8.66237 3.87191 8.30903 4.3337 8.28125 5.02102C8.28125 5.1499 8.29861 5.2716 8.33333 5.38615C8.36806 5.5007 8.39931 5.6081 8.42708 5.70833L9.01042 7.3125ZM5 11.7188C5.19444 11.7188 5.43056 11.6701 5.70833 11.5729L7.3125 10.9896C7.27778 10.8924 7.25 10.7927 7.22917 10.6905C7.20833 10.5884 7.19097 10.4901 7.17708 10.3958C6.59375 10.2847 6.04861 10.0729 5.54167 9.76042C5.03472 9.44792 4.61806 9.03819 4.29167 8.53125C4.22917 8.44792 4.14757 8.38542 4.04688 8.34375C3.94618 8.30208 3.84028 8.28125 3.72917 8.28125C3.58772 8.28125 3.47771 8.32726 3.39913 8.41927C3.32054 8.51128 3.28125 8.64931 3.28125 8.83333C3.28125 9.59713 3.42708 10.269 3.71875 10.8489C4.01042 11.4288 4.4375 11.7188 5 11.7188ZM8.83333 16.7188C9.49321 16.7188 10.1425 16.5851 10.7814 16.3177C11.4202 16.0503 11.7326 15.5868 11.7188 14.9271C11.7188 14.8084 11.7031 14.6971 11.6719 14.5933C11.6406 14.4894 11.6076 14.3889 11.5729 14.2917L10.9896 12.6875C10.8924 12.7222 10.7927 12.75 10.6905 12.7708C10.5884 12.7917 10.4901 12.809 10.3958 12.8229C10.2847 13.4062 10.0729 13.9514 9.76042 14.4583C9.44792 14.9653 9.03819 15.3819 8.53125 15.7083C8.44792 15.7708 8.38368 15.8524 8.33854 15.9531C8.2934 16.0538 8.27431 16.1562 8.28125 16.2604C8.29703 16.3826 8.34438 16.4896 8.42329 16.5813C8.50221 16.6729 8.63889 16.7188 8.83333 16.7188ZM16.1833 11.7188C16.325 11.7188 16.4497 11.6804 16.5573 11.6037C16.6649 11.527 16.7188 11.3814 16.7188 11.1667C16.7188 10.6292 16.6046 10.0174 16.3762 9.33146C16.1478 8.64546 15.6838 8.29539 14.9844 8.28125C14.8559 8.28125 14.7326 8.29514 14.6146 8.32292C14.4965 8.35069 14.3877 8.37894 14.2881 8.40765L12.6875 9.01042C12.7222 9.10764 12.75 9.20733 12.7708 9.30948C12.7917 9.41164 12.809 9.50988 12.8229 9.60417C13.4062 9.71528 13.9514 9.92708 14.4583 10.2396C14.9653 10.5521 15.3819 10.9618 15.7083 11.4688C15.7569 11.5451 15.8247 11.6059 15.9115 11.651C15.9983 11.6962 16.0889 11.7188 16.1833 11.7188Z"
-        fill="#787472"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ArrowFrom.tsx b/apps/scandic-web/components/Icons/ArrowFrom.tsx
deleted file mode 100644
index ea887bf7e..000000000
--- a/apps/scandic-web/components/Icons/ArrowFrom.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ArrowFromIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M12 5V15M12 5C11.2998 5 9.99153 6.9943 9.5 7.5M12 5C12.7002 5 14.0085 6.9943 14.5 7.5"
-        stroke="black"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M5 19H19.0001"
-        stroke="black"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ArrowRight.tsx b/apps/scandic-web/components/Icons/ArrowRight.tsx
deleted file mode 100644
index d21fb311c..000000000
--- a/apps/scandic-web/components/Icons/ArrowRight.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ArrowRightIcon({
-  className,
-  color,
-  height = "25",
-  width = "24",
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height={height}
-      viewBox="0 0 24 25"
-      width={width}
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M16.15 13.5703H5.1875C4.92917 13.5703 4.70833 13.4786 4.525 13.2953C4.34167 13.112 4.25 12.8911 4.25 12.6328C4.25 12.3745 4.34167 12.1536 4.525 11.9703C4.70833 11.787 4.92917 11.6953 5.1875 11.6953H16.15L11.325 6.8703C11.1333 6.67863 11.0396 6.4578 11.0438 6.2078C11.0479 5.9578 11.1458 5.73697 11.3375 5.5453C11.5292 5.36197 11.75 5.26822 12 5.26405C12.25 5.25988 12.4708 5.35363 12.6625 5.5453L19.0875 11.9703C19.1792 12.062 19.2479 12.164 19.2937 12.2765C19.3396 12.389 19.3625 12.5078 19.3625 12.6328C19.3625 12.7578 19.3396 12.8765 19.2937 12.989C19.2479 13.1016 19.1792 13.2036 19.0875 13.2953L12.6625 19.7203C12.4792 19.9036 12.2604 19.9953 12.0062 19.9953C11.7521 19.9953 11.5292 19.9036 11.3375 19.7203C11.1458 19.5286 11.05 19.3057 11.05 19.0516C11.05 18.7974 11.1458 18.5745 11.3375 18.3828L16.15 13.5703Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ArrowTo.tsx b/apps/scandic-web/components/Icons/ArrowTo.tsx
deleted file mode 100644
index 4c698b441..000000000
--- a/apps/scandic-web/components/Icons/ArrowTo.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ArrowToIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5 5H19.0001"
-        stroke="black"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-      <path
-        d="M12 9V19M12 9C11.2998 9 9.99153 10.9943 9.5 11.5M12 9C12.7002 9 14.0085 10.9943 14.5 11.5"
-        stroke="black"
-        strokeWidth="1.5"
-        strokeLinecap="round"
-        strokeLinejoin="round"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ArrowUp.tsx b/apps/scandic-web/components/Icons/ArrowUp.tsx
deleted file mode 100644
index 0f8343170..000000000
--- a/apps/scandic-web/components/Icons/ArrowUp.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ArrowUpIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#4D001B"
-        d="m9.219 6.541-4.021 4.021a.74.74 0 0 1-.552.235.778.778 0 0 1-.552-.245.796.796 0 0 1-.235-.552.74.74 0 0 1 .235-.552l5.354-5.355a.77.77 0 0 1 .849-.171.77.77 0 0 1 .255.171l5.354 5.355a.782.782 0 0 1 0 1.104.764.764 0 0 1-1.114 0l-4.01-4.01v9.135c0 .215-.077.4-.23.552a.752.752 0 0 1-.552.229.752.752 0 0 1-.552-.23.752.752 0 0 1-.23-.551V6.54Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Balcony.tsx b/apps/scandic-web/components/Icons/Balcony.tsx
deleted file mode 100644
index e0fc4c020..000000000
--- a/apps/scandic-web/components/Icons/Balcony.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BalconyIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M9 11.938a.903.903 0 0 1-.662-.276.903.903 0 0 1-.275-.662c0-.258.091-.48.274-.662A.903.903 0 0 1 9 10.063c.258 0 .48.091.662.274a.903.903 0 0 1 .275.663c0 .258-.091.48-.274.662a.903.903 0 0 1-.663.275Zm6 0a.903.903 0 0 1-.662-.276.903.903 0 0 1-.275-.662c0-.258.091-.48.274-.662a.903.903 0 0 1 .663-.275c.258 0 .48.091.662.274a.903.903 0 0 1 .275.663c0 .258-.091.48-.274.662a.903.903 0 0 1-.663.275Zm-10.063 10c-.515 0-.957-.184-1.324-.551a1.806 1.806 0 0 1-.55-1.325v-4.125c0-.35.087-.672.262-.968.175-.296.42-.527.737-.694V10c0-1.091.209-2.12.625-3.087a8.055 8.055 0 0 1 1.703-2.53 7.953 7.953 0 0 1 2.526-1.7A7.75 7.75 0 0 1 12 2.063c1.091 0 2.12.206 3.088.62.968.413 1.81.98 2.53 1.699a7.965 7.965 0 0 1 1.7 2.53c.413.967.62 1.997.62 3.088v4.275c.316.167.562.398.737.694.175.296.262.619.262.969v4.124c0 .516-.183.957-.55 1.325-.367.367-.809.55-1.325.55H4.938Zm0-6v4.124h2.125v-4.125H4.938Zm4 4.124h2.126v-4.125H8.937v4.126Zm-3-6h5.125V4c-1.474.242-2.697.925-3.668 2.05C6.423 7.175 5.937 8.492 5.937 10v4.063Zm7 0h5.126V10c0-1.508-.486-2.825-1.457-3.95-.97-1.125-2.194-1.808-3.669-2.05v10.063Zm0 6h2.126v-4.125h-2.126v4.126Zm4 0h2.125v-4.125h-2.125v4.126Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Bar.tsx b/apps/scandic-web/components/Icons/Bar.tsx
deleted file mode 100644
index 8ab06dcd7..000000000
--- a/apps/scandic-web/components/Icons/Bar.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BarIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M11.0625 18.9501V13.8751L3.68755 5.5626C3.57088 5.42926 3.47713 5.28551 3.4063 5.13135C3.33547 4.97718 3.30005 4.8126 3.30005 4.6376C3.30005 4.2376 3.43963 3.90218 3.7188 3.63135C3.99797 3.36051 4.33755 3.2251 4.73755 3.2251H19.2625C19.6625 3.2251 20.0021 3.36051 20.2813 3.63135C20.5605 3.90218 20.7 4.2376 20.7 4.6376C20.7 4.8126 20.6646 4.97718 20.5938 5.13135C20.523 5.28551 20.4292 5.42926 20.3125 5.5626L12.9375 13.8751V18.9501H16.875C17.1334 18.9501 17.3542 19.0418 17.5375 19.2251C17.7209 19.4084 17.8125 19.6293 17.8125 19.8876C17.8125 20.1459 17.7209 20.3668 17.5375 20.5501C17.3542 20.7334 17.1334 20.8251 16.875 20.8251H7.12505C6.86672 20.8251 6.64588 20.7334 6.46255 20.5501C6.27922 20.3668 6.18755 20.1459 6.18755 19.8876C6.18755 19.6293 6.27922 19.4084 6.46255 19.2251C6.64588 19.0418 6.86672 18.9501 7.12505 18.9501H11.0625ZM7.52505 7.0751H16.475L18.25 5.1001H5.75005L7.52505 7.0751ZM12 12.0751L14.8125 8.9501H9.18755L12 12.0751Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Bathtub.tsx b/apps/scandic-web/components/Icons/Bathtub.tsx
deleted file mode 100644
index 52c8a0265..000000000
--- a/apps/scandic-web/components/Icons/Bathtub.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BathtubIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M7.075 9.13755C6.54563 9.13755 6.09246 8.94906 5.71548 8.57207C5.33849 8.19511 5.15 7.74193 5.15 7.21255C5.15 6.68317 5.33849 6.22999 5.71548 5.85302C6.09246 5.47604 6.54563 5.28755 7.075 5.28755C7.60438 5.28755 8.05756 5.47604 8.43453 5.85302C8.81151 6.22999 9 6.68317 9 7.21255C9 7.74193 8.81151 8.19511 8.43453 8.57207C8.05756 8.94906 7.60438 9.13755 7.075 9.13755ZM5.125 21.75C4.84167 21.75 4.60417 21.6554 4.4125 21.4661C4.22083 21.2769 4.125 21.0423 4.125 20.7625C3.60937 20.7625 3.16796 20.579 2.80077 20.2118C2.43359 19.8446 2.25 19.4032 2.25 18.8875V13.9875C2.25 13.7292 2.34167 13.5084 2.525 13.325C2.70833 13.1417 2.92917 13.05 3.1875 13.05H5.175V12.3276C5.175 11.7176 5.38444 11.2021 5.80332 10.7813C6.22222 10.3605 6.73778 10.15 7.35 10.15C7.66667 10.15 7.96667 10.2125 8.25 10.3375C8.53333 10.4625 8.78333 10.6417 9 10.875L10.35 12.375C10.475 12.5 10.6 12.6209 10.725 12.7375C10.85 12.8542 10.9833 12.9584 11.125 13.05H17.875V5.00005C17.875 4.75642 17.7892 4.54759 17.6177 4.37357C17.4461 4.19956 17.2402 4.11255 17 4.11255C16.8941 4.11255 16.7926 4.13338 16.6956 4.17505C16.5985 4.21672 16.509 4.27869 16.4269 4.36097L15.1962 5.59522C15.2782 5.87497 15.2946 6.15061 15.2454 6.42215C15.1962 6.69368 15.0977 6.94465 14.95 7.17505L12.3 4.50005C12.5333 4.35005 12.7833 4.25422 13.05 4.21255C13.3167 4.17088 13.5833 4.20005 13.85 4.30005L15.075 3.06255C15.3323 2.80373 15.6258 2.60152 15.9554 2.45592C16.2851 2.31034 16.6348 2.23755 17.0047 2.23755C17.7766 2.23755 18.4271 2.50411 18.9563 3.03722C19.4854 3.57034 19.75 4.22462 19.75 5.00005V13.05H20.8125C21.0708 13.05 21.2917 13.1417 21.475 13.325C21.6583 13.5084 21.75 13.7292 21.75 13.9875V18.8875C21.75 19.4032 21.5664 19.8446 21.1992 20.2118C20.832 20.579 20.3906 20.7625 19.875 20.7625C19.875 21.0423 19.7792 21.2769 19.5875 21.4661C19.3958 21.6554 19.1583 21.75 18.875 21.75H5.125ZM4.125 18.8875H19.875V14.925H4.125V18.8875Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/BedHotel.tsx b/apps/scandic-web/components/Icons/BedHotel.tsx
deleted file mode 100644
index d2f37b0ed..000000000
--- a/apps/scandic-web/components/Icons/BedHotel.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BedHotelIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="25"
-      height="25"
-      viewBox="0 0 25 25"
-      fill="none"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M2.188 18.8a.903.903 0 0 1-.663-.275.903.903 0 0 1-.275-.662V5.136c0-.258.092-.479.275-.662a.903.903 0 0 1 .663-.275c.258 0 .479.092.662.275a.903.903 0 0 1 .275.662v8.813h7.95v-5.9c0-.516.184-.957.55-1.324.368-.367.81-.551 1.325-.551h5.95c1.067 0 1.975.375 2.725 1.125s1.125 1.658 1.125 2.725v7.838c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275.903.903 0 0 1-.662-.275.903.903 0 0 1-.275-.662v-2.038H3.125v2.038c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275Zm4.886-5.9a2.77 2.77 0 0 1-2.037-.839 2.776 2.776 0 0 1-.837-2.037c0-.8.28-1.478.839-2.037a2.776 2.776 0 0 1 2.037-.837c.8 0 1.478.28 2.037.839.558.56.837 1.238.837 2.037a2.77 2.77 0 0 1-.839 2.037 2.777 2.777 0 0 1-2.037.837Zm5.876 1.05h7.925v-3.927c0-.54-.194-1.004-.582-1.392a1.909 1.909 0 0 0-1.4-.581H12.95v5.9Zm-5.875-2.925c.283 0 .52-.096.712-.287a.968.968 0 0 0 .288-.713.968.968 0 0 0-.287-.713.968.968 0 0 0-.713-.287.968.968 0 0 0-.713.287.968.968 0 0 0-.287.713c0 .283.096.52.287.713.192.191.43.287.713.287Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/BedroomParent.tsx b/apps/scandic-web/components/Icons/BedroomParent.tsx
deleted file mode 100644
index c7bdf7868..000000000
--- a/apps/scandic-web/components/Icons/BedroomParent.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BedroomParentIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M6.5 15.4h11v.775a.676.676 0 0 0 .698.7.684.684 0 0 0 .702-.7V13c0-.344-.07-.668-.212-.97a2.32 2.32 0 0 0-.588-.78V9.125a1.86 1.86 0 0 0-.556-1.369 1.855 1.855 0 0 0-1.365-.556h-3.184a1.77 1.77 0 0 0-.995.3 1.77 1.77 0 0 0-1-.3H7.82c-.538 0-.993.185-1.364.556A1.86 1.86 0 0 0 5.9 9.125v2.125A2.32 2.32 0 0 0 5.1 13v3.175a.677.677 0 0 0 .698.7.684.684 0 0 0 .702-.7V15.4Zm0-1.425v-1c0-.283.092-.517.275-.7A.951.951 0 0 1 7.477 12h9.046c.285 0 .519.092.702.275a.948.948 0 0 1 .275.7v1h-11Zm.825-3.4V8.6H11.3v1.975H7.325Zm5.375 0V8.6h3.975v1.975H12.7ZM4.125 21.75c-.516 0-.957-.184-1.324-.55a1.806 1.806 0 0 1-.551-1.325V4.125c0-.516.184-.957.55-1.324.368-.367.81-.551 1.325-.551h15.75c.516 0 .957.184 1.324.55.367.368.551.81.551 1.325v15.75c0 .516-.184.957-.55 1.324-.368.367-.81.551-1.325.551H4.125Zm0-1.875h15.75V4.125H4.125v15.75Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/BedDouble.tsx b/apps/scandic-web/components/Icons/Beds/BedDouble.tsx
deleted file mode 100644
index 1ede5a587..000000000
--- a/apps/scandic-web/components/Icons/Beds/BedDouble.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BedDoubleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M3.25 17.8875V13C3.25 12.575 3.3375 12.1813 3.5125 11.8188C3.6875 11.4563 3.925 11.1417 4.225 10.875V8.17505C4.225 7.38338 4.50625 6.7063 5.06875 6.1438C5.63125 5.5813 6.30833 5.30005 7.1 5.30005H10.075C10.4417 5.30005 10.7875 5.37088 11.1125 5.51255C11.4375 5.65422 11.7333 5.85005 12 6.10005C12.2667 5.85005 12.5625 5.65422 12.8875 5.51255C13.2125 5.37088 13.5583 5.30005 13.925 5.30005H16.9C17.6917 5.30005 18.3687 5.5813 18.9312 6.1438C19.4937 6.7063 19.775 7.38338 19.775 8.17505V10.875C20.075 11.1417 20.3125 11.4563 20.4875 11.8188C20.6625 12.1813 20.75 12.575 20.75 13V17.8875C20.75 18.1459 20.6583 18.3667 20.475 18.55C20.2917 18.7334 20.0708 18.825 19.8125 18.825C19.5542 18.825 19.3333 18.7334 19.15 18.55C18.9667 18.3667 18.875 18.1459 18.875 17.8875V16.85H5.125V17.8875C5.125 18.1459 5.03333 18.3667 4.85 18.55C4.66667 18.7334 4.44583 18.825 4.1875 18.825C3.92917 18.825 3.70833 18.7334 3.525 18.55C3.34167 18.3667 3.25 18.1459 3.25 17.8875ZM12.95 10.15H17.9V8.17067C17.9 7.89026 17.8046 7.65422 17.6138 7.46255C17.423 7.27088 17.1866 7.17505 16.9046 7.17505H13.923C13.641 7.17505 13.4083 7.27088 13.225 7.46255C13.0417 7.65422 12.95 7.89172 12.95 8.17505V10.15ZM6.1 10.15H11.05V8.17067C11.05 7.89026 10.9583 7.65422 10.775 7.46255C10.5917 7.27088 10.359 7.17505 10.077 7.17505H7.0954C6.81337 7.17505 6.57696 7.27088 6.38618 7.46255C6.19539 7.65422 6.1 7.89172 6.1 8.17505V10.15ZM5.125 14.975H18.875V12.9957C18.875 12.7153 18.7833 12.4834 18.6 12.3C18.4167 12.1167 18.1852 12.025 17.9057 12.025H6.09427C5.81476 12.025 5.58333 12.1167 5.4 12.3C5.21667 12.4834 5.125 12.7153 5.125 12.9957V14.975Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/BedSingle.tsx b/apps/scandic-web/components/Icons/Beds/BedSingle.tsx
deleted file mode 100644
index 8c6ceeb76..000000000
--- a/apps/scandic-web/components/Icons/Beds/BedSingle.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BedSingleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M15.0427 14.0548H4.95718V14.9742C4.95718 15.2154 4.87884 15.4189 4.72214 15.5847C4.56545 15.7505 4.37314 15.8334 4.14522 15.8334C3.9173 15.8334 3.72499 15.7505 3.56829 15.5847C3.4116 15.4189 3.33325 15.2154 3.33325 14.9742V10.9484C3.33325 10.3564 3.48757 9.83679 3.79621 9.38962C4.10486 8.94244 4.51084 8.61837 5.01416 8.41739V6.48802C5.01416 5.83485 5.22546 5.28468 5.64807 4.83751C6.07067 4.39033 6.58947 4.16675 7.20448 4.16675H12.7954C13.4104 4.16675 13.9292 4.39033 14.3518 4.83751C14.7744 5.28468 14.9857 5.83485 14.9857 6.48802V8.41739C15.489 8.61837 15.895 8.94244 16.2036 9.38962C16.5123 9.83679 16.6666 10.3564 16.6666 10.9484V14.9742C16.6666 15.2154 16.5882 15.4189 16.4315 15.5847C16.2748 15.7505 16.0825 15.8334 15.8546 15.8334C15.6267 15.8334 15.4344 15.7505 15.2777 15.5847C15.121 15.4189 15.0427 15.2154 15.0427 14.9742V14.0548ZM6.6381 8.23652V5.85495H13.3617V8.23652H6.6381ZM4.95718 10.9497V12.3364H15.0427V10.9497C15.0427 10.6683 14.9524 10.4322 14.772 10.2413C14.5916 10.0503 14.37 9.95486 14.1075 9.95486H5.89237C5.62979 9.95486 5.40828 10.0503 5.22784 10.2413C5.0474 10.4322 4.95718 10.6683 4.95718 10.9497Z"
-        fill="#57514E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/ExtraBunkBed.tsx b/apps/scandic-web/components/Icons/Beds/ExtraBunkBed.tsx
deleted file mode 100644
index 597643bfa..000000000
--- a/apps/scandic-web/components/Icons/Beds/ExtraBunkBed.tsx
+++ /dev/null
@@ -1,101 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ExtraBunkBedIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="75"
-      height="42"
-      viewBox="0 0 75 42"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M18.0731 3.44172V40.1023H21.3198V3.44172H18.0731ZM16.1792 3.35155C16.1792 2.35541 16.9867 1.54785 17.9829 1.54785H21.41C22.4061 1.54785 23.2137 2.3554 23.2137 3.35155V40.1925C23.2137 41.1886 22.4061 41.9962 21.41 41.9962H17.9829C16.9867 41.9962 16.1792 41.1886 16.1792 40.1925V3.35155Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M67.765 5.1551V40.1021H71.0117V5.1551H67.765ZM65.8711 5.06493C65.8711 4.06877 66.6786 3.26123 67.6748 3.26123H71.1019C72.098 3.26123 72.9056 4.06877 72.9056 5.06493V40.1923C72.9056 41.1885 72.098 41.996 71.1019 41.996H67.6748C66.6786 41.996 65.8711 41.1885 65.8711 40.1923V5.06493Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M21.3196 31.5352H67.7652V36.8561H21.3196V31.5352ZM23.2134 33.429V34.9622H65.8714V33.429H23.2134Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M58.4325 27.9521C52.6201 26.9387 46.6738 26.9667 40.8711 28.0346L40.8711 28.0346L34.9466 29.1249C34.9466 29.1249 34.9466 29.1249 34.9466 29.1249C34.4972 29.2076 34.171 29.5993 34.171 30.0562V30.7681C34.171 31.2911 34.595 31.7151 35.118 31.7151H65.1048C65.6278 31.7151 66.0518 31.2911 66.0518 30.7681V30.0767C66.0518 29.6165 65.7209 29.2229 65.2674 29.1439L65.4138 28.3043L65.2674 29.1439L58.4325 27.9521ZM58.7253 26.273L58.5789 27.1125L58.7253 26.273L65.5602 27.4647C66.8297 27.6861 67.7562 28.7881 67.7562 30.0767V30.7681C67.7562 32.2325 66.5691 33.4195 65.1048 33.4195H35.118C33.6536 33.4195 32.4666 32.2325 32.4666 30.7681V30.0562C32.4666 28.777 33.3799 27.6801 34.6381 27.4486L34.6381 27.4486L40.5626 26.3583C40.5626 26.3583 40.5626 26.3583 40.5626 26.3583C46.564 25.2538 52.7138 25.2248 58.7253 26.273Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M23.9798 28.9647C23.4568 28.9647 23.0328 29.3887 23.0328 29.9117V30.7685C23.0328 31.2915 23.4568 31.7154 23.9798 31.7154H30.8339C31.3569 31.7154 31.7809 31.2915 31.7809 30.7685V29.9117C31.7809 29.3887 31.3569 28.9647 30.8339 28.9647H23.9798ZM21.3284 29.9117C21.3284 28.4473 22.5155 27.2603 23.9798 27.2603H30.8339C32.2983 27.2603 33.4854 28.4473 33.4854 29.9117V30.7685C33.4854 32.2328 32.2983 33.4199 30.8339 33.4199H23.9798C22.5155 33.4199 21.3284 32.2328 21.3284 30.7685V29.9117Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M25.2138 21.2745C24.5883 21.4597 23.949 21.7397 23.4251 22.168L25.2138 21.2745ZM23.4251 22.168C22.8933 22.6025 22.3724 23.2887 22.3152 24.2343C22.2586 25.1688 22.6812 25.9307 23.1322 26.4496M23.1322 26.4496C23.5824 26.9674 24.1643 27.373 24.7538 27.6876L23.1322 26.4496Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M29.6979 20.9796C28.0609 20.8019 26.4746 20.9014 25.2138 21.2745L23.4251 22.168C22.8933 22.6025 22.3724 23.2887 22.3152 24.2343C22.2586 25.1688 22.6812 25.9307 23.1322 26.4496L24.7538 27.6876C25.9405 28.3211 27.487 28.7611 29.1256 28.9389C30.7626 29.1166 32.3489 29.0173 33.6098 28.644C34.2356 28.4588 34.8746 28.1786 35.3985 27.7506C35.9304 27.316 36.451 26.6297 36.5083 25.6843C36.676 23.9652 34.9525 22.6658 34.0698 22.231C32.883 21.5974 31.3365 21.1574 29.6979 20.9796ZM29.4935 22.8624C28.0381 22.7044 26.714 22.8056 25.7514 23.0904C25.2695 23.2332 24.8867 23.4193 24.6235 23.6344C24.3625 23.8477 24.2215 24.086 24.2056 24.3487C24.189 24.6226 24.3082 24.9157 24.5616 25.2071C24.811 25.4941 25.1814 25.7691 25.6455 26.0168C26.574 26.5125 27.8757 26.8983 29.3299 27.0561C30.7856 27.2141 32.1096 27.113 33.0722 26.8281C33.5258 26.7045 34.4698 26.2799 34.6179 25.5698C34.6345 25.2958 34.5152 25.0027 34.2619 24.7114C34.0124 24.4244 33.642 24.1494 33.1778 23.9017C32.2494 23.406 30.9477 23.0202 29.4935 22.8624Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M21.3196 10.9722H67.7652V16.2931H21.3196V10.9722ZM23.2134 12.866V14.3992H65.8714V12.866H23.2134Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M58.4323 7.39062C52.6198 6.37719 46.6735 6.4051 40.8709 7.47303L34.9464 8.56337C34.497 8.64607 34.1708 9.03779 34.1708 9.49468V10.2066C34.1708 10.7296 34.5948 11.1535 35.1178 11.1535H65.1045C65.6275 11.1535 66.0515 10.7296 66.0515 10.2066V9.51516C66.0515 9.05495 65.7206 8.66136 65.2672 8.5823L58.4323 7.39062ZM40.5624 5.7967C46.5637 4.69221 52.7136 4.66335 58.725 5.71147L65.56 6.90316C66.8295 7.1245 67.756 8.22654 67.756 9.51516V10.2066C67.756 11.6709 66.5689 12.858 65.1045 12.858H35.1178C33.6534 12.858 32.4663 11.6709 32.4663 10.2066V9.49468C32.4663 8.21543 33.3797 7.11859 34.6378 6.88704"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M23.9798 8.40223C23.4568 8.40223 23.0328 8.8262 23.0328 9.3492V10.206C23.0328 10.729 23.4568 11.1529 23.9798 11.1529H30.8339C31.3569 11.1529 31.7809 10.729 31.7809 10.206V9.3492C31.7809 8.8262 31.3569 8.40223 30.8339 8.40223H23.9798ZM21.3284 9.3492C21.3284 7.88485 22.5155 6.69775 23.9798 6.69775H30.8339C32.2983 6.69775 33.4854 7.88485 33.4854 9.3492V10.206C33.4854 11.6703 32.2983 12.8574 30.8339 12.8574H23.9798C22.5155 12.8574 21.3284 11.6703 21.3284 10.206V9.3492Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M25.2138 0.441473C24.5883 0.626692 23.949 0.906727 23.4251 1.33497L25.2138 0.441473ZM23.4251 1.33497C22.8933 1.76954 22.3724 2.45571 22.3152 3.40126C22.2586 4.33574 22.6812 5.09771 23.1322 5.6166M23.1322 5.6166C23.5824 6.13441 24.1643 6.53996 24.7538 6.85458L23.1322 5.6166Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M29.6979 0.146592C28.0609 -0.0310981 26.4746 0.0683662 25.2138 0.441473L23.4251 1.33497C22.8933 1.76954 22.3724 2.45571 22.3152 3.40126C22.2586 4.33574 22.6812 5.09771 23.1322 5.6166L24.7538 6.85458C25.9405 7.48812 27.487 7.92808 29.1256 8.10592C30.7626 8.28361 32.3489 8.18425 33.6098 7.81102C34.2356 7.6258 34.8746 7.34563 35.3985 6.91763C35.9304 6.48295 36.451 5.79672 36.5083 4.85125C36.676 3.13218 34.9525 1.83278 34.0698 1.39797C32.883 0.764411 31.3365 0.32444 29.6979 0.146592ZM29.4935 2.0294C28.0381 1.87142 26.714 1.97259 25.7514 2.25743C25.2695 2.40017 24.8867 2.58628 24.6235 2.8014C24.3625 3.01472 24.2215 3.25294 24.2056 3.51573C24.189 3.78962 24.3082 4.08266 24.5616 4.3741C24.811 4.66111 25.1814 4.93606 25.6455 5.18381C26.574 5.67946 27.8757 6.06528 29.3299 6.22311C30.7856 6.38111 32.1096 6.27998 33.0722 5.99504C33.5258 5.8715 34.4698 5.44689 34.6179 4.73679C34.6345 4.46283 34.5152 4.1697 34.2619 3.87839C34.0124 3.59138 33.642 3.31641 33.1778 3.06866C32.2494 2.57301 30.9477 2.18723 29.4935 2.0294Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M9.84337 29.9109C14.3386 29.9109 17.9826 26.2668 17.9826 21.7716C17.9826 17.2764 14.3386 13.6323 9.84337 13.6323C5.34817 13.6323 1.7041 17.2764 1.7041 21.7716C1.7041 26.2668 5.34817 29.9109 9.84337 29.9109ZM10.9449 25.931V22.3934H14.5119C15.0469 22.3934 15.4036 22.0397 15.4036 21.509C15.4036 20.9784 15.0469 20.6246 14.5119 20.6246H10.9449V17.0871C10.9449 16.5564 10.5882 16.2026 10.0532 16.2026C9.51814 16.2026 9.16145 16.5564 9.16145 17.0871V20.6246H5.59451C5.05947 20.6246 4.70277 20.9784 4.70277 21.509C4.70277 22.0397 5.05947 22.3934 5.59451 22.3934H9.16145V25.931C9.16145 26.4617 9.51814 26.8155 10.0532 26.8155C10.5882 26.8155 10.9449 26.4617 10.9449 25.931Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/ExtraPullOutBed.tsx b/apps/scandic-web/components/Icons/Beds/ExtraPullOutBed.tsx
deleted file mode 100644
index 649fb7f53..000000000
--- a/apps/scandic-web/components/Icons/Beds/ExtraPullOutBed.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ExtraPullOutBedIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="51"
-      height="32"
-      viewBox="0 0 51 32"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M43.8184 0V12.1806C43.0898 11.9742 42.2571 11.871 41.3204 11.7677C40.4878 8.25806 37.2612 5.57419 33.4102 5.57419H29.9755C25.9163 5.57419 22.5857 8.46452 21.9612 12.2839C20.7122 12.5935 19.5673 13.1097 18.5265 13.8323C18.6306 13.3161 18.7347 12.6968 18.7347 12.0774C18.7347 6.91613 14.5714 2.7871 9.36735 2.7871C4.16327 2.7871 0 6.91613 0 12.0774C0 17.2387 4.16327 21.3677 9.36735 21.3677C11.3449 21.3677 13.2184 20.7484 14.7796 19.6129C14.6755 20.2323 14.5714 20.8516 14.5714 21.6774V27.871H17.798C17.798 27.9742 17.7719 28.0516 17.7459 28.129C17.7199 28.2065 17.6939 28.2839 17.6939 28.3871C17.6939 30.3484 19.3592 32 21.3367 32C23.3143 32 24.9796 30.3484 24.9796 28.3871C24.9796 28.1806 24.9796 28.0774 24.8755 27.871H43.8184V31.7935H51V0H43.8184ZM30.0796 7.53548H33.5143C36.1163 7.53548 38.302 9.1871 39.2388 11.4581C37.7816 11.3548 36.1163 11.3548 34.3469 11.3548H30.3918C28.7265 11.3548 26.5408 11.3548 24.3551 11.6645C25.0837 9.29032 27.3735 7.53548 30.0796 7.53548ZM10.4082 17.1355V13.0065H14.5714C15.1959 13.0065 15.6122 12.5935 15.6122 11.9742C15.6122 11.3548 15.1959 10.9419 14.5714 10.9419H10.4082V6.8129C10.4082 6.19355 9.99184 5.78064 9.36735 5.78064C8.74286 5.78064 8.32653 6.19355 8.32653 6.8129V10.9419H4.16327C3.53878 10.9419 3.12245 11.3548 3.12245 11.9742C3.12245 12.5935 3.53878 13.0065 4.16327 13.0065H8.32653V17.1355C8.32653 17.7548 8.74286 18.1677 9.36735 18.1677C9.99184 18.1677 10.4082 17.7548 10.4082 17.1355ZM21.3367 29.9355C20.5041 29.9355 19.7755 29.2129 19.7755 28.3871C19.7755 28.1806 19.7755 28.0774 19.8796 27.871H22.7939C22.898 28.0774 22.898 28.1806 22.898 28.3871C22.898 29.2129 22.2735 29.9355 21.3367 29.9355ZM16.6531 25.8065H43.7143V23.7419H16.6531V25.8065ZM43.8184 21.6774H16.6531C16.6531 15.071 21.5449 13.4194 30.2878 13.4194H34.2429C38.7184 13.4194 41.7367 13.6258 43.8184 14.2452V21.6774ZM45.9 29.729H48.9184V2.06452H45.9V29.729Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/ExtraSofaBed.tsx b/apps/scandic-web/components/Icons/Beds/ExtraSofaBed.tsx
deleted file mode 100644
index 3bd95eb96..000000000
--- a/apps/scandic-web/components/Icons/Beds/ExtraSofaBed.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ExtraSofaBedIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="70"
-      height="34"
-      viewBox="0 0 70 34"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M69.5408 8.73112C69.3353 8.52568 69.0272 8.42296 68.719 8.42296C68.5136 8.42296 65.7402 8.6284 63.2749 9.75831C63.2749 6.88218 63.2749 4.82779 63.2749 4.82779C63.2749 2.1571 58.2417 0 51.9758 0C47.4562 0 43.5529 1.12991 41.7039 2.77341C39.855 1.12991 35.9517 0 31.432 0C25.1662 0 20.1329 2.1571 20.1329 4.82779C20.1329 4.82779 20.1329 6.88218 20.1329 9.75831C18.9003 9.14199 17.565 8.83384 16.5378 8.6284C14.8943 6.4713 12.2236 5.03323 9.24471 5.03323C4.10876 5.03323 0 9.14199 0 14.2779C0 19.4139 4.10876 23.5227 9.24471 23.5227C10.7855 23.5227 12.3263 23.1118 13.6616 22.3927V26.5015C13.6616 27.1178 14.1752 27.5287 14.6888 27.5287H20.1329H20.3384V28.2477C20.3384 29.3776 21.2628 30.4048 22.4955 30.4048H24.3444V32.8701C24.3444 33.4864 24.858 34 25.4743 34C26.0906 34 26.6042 33.4864 26.6042 32.8701V30.4048H57.0091V32.8701C57.0091 33.4864 57.5227 34 58.139 34C58.7553 34 59.2689 33.4864 59.2689 32.8701V30.4048H60.7069C61.8369 30.4048 62.864 29.4804 62.864 28.2477V27.5287H63.3776H68.8218C69.4381 27.5287 69.8489 27.0151 69.8489 26.5015V9.55287C69.8489 9.24471 69.7462 8.93656 69.5408 8.73112ZM49.4079 14.3807H34.5136C34.6163 13.148 34.9245 12.2236 35.6435 11.5045C36.7734 10.3746 38.7251 9.75831 41.6012 9.75831C47.9698 9.65559 49.2024 11.9154 49.4079 14.3807ZM10.2719 19.4139C10.2719 20.0302 9.86103 20.4411 9.24471 20.4411C8.6284 20.4411 8.21752 20.0302 8.21752 19.4139V15.3051H4.10876C3.49245 15.3051 3.08157 14.8943 3.08157 14.2779C3.08157 13.6616 3.49245 13.2508 4.10876 13.2508H8.21752V9.14199C8.21752 8.52568 8.6284 8.1148 9.24471 8.1148C9.86103 8.1148 10.2719 8.52568 10.2719 9.14199V13.2508H14.3807C14.997 13.2508 15.4079 13.6616 15.4079 14.2779C15.4079 14.8943 14.997 15.3051 14.3807 15.3051H10.2719V19.4139ZM22.0846 17.9758C20.3384 20.2356 20.3384 22.1873 20.3384 22.29V25.577H15.716V20.852C17.4622 19.2085 18.4894 16.8459 18.4894 14.2779C18.4894 13.148 18.284 12.1208 17.9758 11.1964C19.9275 11.8127 22.0846 12.9426 22.0846 15.2024V17.9758ZM22.29 11.1964V4.93051C22.3927 4.10876 25.7825 2.25982 31.5347 2.25982C37.0816 2.25982 40.4713 4.10876 40.6767 4.93051C40.6767 4.93051 40.6767 4.93051 40.6767 5.03323C40.6767 5.03323 40.6767 6.06042 40.6767 7.60121C37.6979 7.70393 35.5408 8.52568 34.1027 9.96375C32.9728 11.0937 32.3565 12.6344 32.3565 14.4834H29.8912C27.6314 14.4834 25.6798 14.997 24.2417 16.0242V15.3051C24.139 13.4562 23.4199 12.1208 22.29 11.1964ZM60.7069 28.4532H22.4955V25.3716H60.7069V28.4532ZM22.4955 23.1118V22.29C22.4955 22.29 22.4955 20.4411 24.5498 18.3867C25.7825 17.1541 27.6314 16.435 29.8912 16.435H53.003C55.571 16.435 57.5227 17.1541 58.7553 18.4894C60.8097 20.5438 60.7069 22.1873 60.7069 22.29V23.1118H22.4955ZM61.2205 11.1964C60.0906 12.1208 59.3716 13.4562 59.3716 15.3051V16.2296C57.7281 14.997 55.6737 14.3807 53.1057 14.3807H51.6677C51.4622 10.0665 48.4834 7.80665 42.9366 7.49849C42.9366 5.9577 42.9366 4.93051 42.9366 4.93051C42.9366 4.93051 42.9366 4.93051 42.9366 4.82779C43.2447 4.00604 46.5317 2.1571 52.0786 2.1571C57.8308 2.1571 61.1178 4.10876 61.3233 4.82779L61.2205 11.1964ZM67.7946 25.577H62.864V22.3927C62.864 22.29 62.864 20.5438 61.426 18.4894V15.3051C61.426 12.1208 65.6375 11.0937 67.6918 10.7855V25.577H67.7946Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/ExtraWallBed.tsx b/apps/scandic-web/components/Icons/Beds/ExtraWallBed.tsx
deleted file mode 100644
index b6f05c335..000000000
--- a/apps/scandic-web/components/Icons/Beds/ExtraWallBed.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ExtraWallBedIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="53"
-      height="34"
-      viewBox="0 0 53 34"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M50.9 0.149902H47H45V2.1499V13.8499C44.6 13.8499 44.2 13.8499 43.8 13.9499C43.6306 13.8168 43.4714 13.6895 43.3191 13.5678L43.319 13.5677C42.213 12.6834 41.47 12.0894 39.8 11.6499C39.1 7.9499 36 5.1499 32.1 5.1499H28.8C24.9 5.1499 21.7 7.9499 21.1 11.6499C20 11.9499 18.8 12.4499 17.9 13.0499C17.2 8.7499 13.5 5.4499 9 5.4499C4 5.4499 0 9.4499 0 14.4499C0 19.4499 4 23.4499 9 23.4499C10.9 23.4499 12.6 22.8499 14 21.9499V22.8499V24.8499V26.8499H16H45V31.8499V33.8499H47H50.9H52.9V31.8499V2.1499V0.149902H50.9ZM28.8 7.1499H32.1C34.7 7.1499 36.9 8.8499 37.6 11.1499C36 10.9499 34.4 10.8499 32.8 10.8499H29C27.4 10.8499 25.3 10.8499 23.2 11.1499C24.1 8.8499 26.3 7.1499 28.8 7.1499ZM32.9 12.8499H29.1C23.9 12.8499 20 13.5499 17.9 15.5499C17.7 17.2499 17 18.7499 16 20.0499V20.8499H38C38 18.2499 39.4 15.9499 41.5 14.7499C39.3 13.4499 37.1 12.8499 32.9 12.8499ZM10 19.4499C10 20.0499 9.6 20.4499 9 20.4499C8.4 20.4499 8 20.0499 8 19.4499V15.4499H4C3.4 15.4499 3 15.0499 3 14.4499C3 13.8499 3.4 13.4499 4 13.4499H8V9.4499C8 8.8499 8.4 8.4499 9 8.4499C9.6 8.4499 10 8.8499 10 9.4499V13.4499H14C14.6 13.4499 15 13.8499 15 14.4499C15 15.0499 14.6 15.4499 14 15.4499H10V19.4499ZM16 24.8499H45V22.8499H16V24.8499ZM45 17.9499C43.5 18.1499 42.3 19.3499 42.1 20.8499H40C40 18.0499 42.2 15.8499 45 15.8499V17.9499ZM47 31.8499H50.9V2.1499H47V20.8499V22.8499V24.8499V26.8499V31.8499Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/KingBed.tsx b/apps/scandic-web/components/Icons/Beds/KingBed.tsx
deleted file mode 100644
index 6b65cbc3f..000000000
--- a/apps/scandic-web/components/Icons/Beds/KingBed.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function KingBedIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="51"
-      height="36"
-      viewBox="0 0 51 36"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M48.1255 17.2632C49.8873 18.9211 51 21.2237 51 24.2632V24.4474V24.5395V33.75C51 34.6711 50.1655 35.5 49.1455 35.5H46.8273C45.8073 35.5 44.9727 34.6711 44.9727 33.75V29.6053H6.12V33.75C6.12 34.6711 5.28545 35.5 4.26545 35.5H1.85455C0.834545 35.5 0 34.6711 0 33.75V24.4474C0 22.0526 0.556364 20.2105 1.39091 18.6447V18.5526V1.42105C1.39091 0.960526 1.85455 0.5 2.31818 0.5H47.1982C47.7545 0.5 48.1255 0.868421 48.1255 1.42105V17.2632ZM1.85455 23.5263H49.1455C48.8673 19.8421 46.6418 17.6316 43.3036 16.1579C43.2109 16.1579 43.1182 16.1579 43.0255 16.0658C38.2036 14.2237 31.1564 14.2237 24.5727 14.2237C11.6836 14.2237 2.41091 14.9605 1.85455 23.5263ZM6.58364 14.5V13.0263C6.58364 7.4079 12.5182 6.76316 15.1145 6.76316C17.6182 6.76316 23.2745 7.31579 23.6455 12.4737C17.6182 12.4737 11.22 12.5658 6.58364 14.5ZM25.5 12.3816V12.4737C31.1564 12.4737 37.5545 12.5658 42.5618 14.2237V12.3816C42.5618 6.76316 36.6273 6.11842 34.0309 6.11842C31.4345 6.11842 25.5 6.76316 25.5 12.3816ZM46.2709 2.34211V15.7895C45.7145 15.4211 45.0655 15.1447 44.4164 14.8684V12.2895C44.4164 7.31579 40.5218 4.27632 34.0309 4.27632C29.2091 4.27632 25.7782 5.93421 24.3873 8.88158C22.8109 6.48684 19.6582 5.10526 15.2073 5.10526C8.71636 5.10526 4.82182 8.05263 4.82182 13.1184V15.4211C4.26545 15.7895 3.80182 16.1579 3.33818 16.5263V2.34211H46.2709ZM1.85455 33.75H4.26545V29.6053H1.85455V33.75ZM1.85455 27.8553V25.2763H49.1455V27.8553H1.85455ZM46.7345 29.6053V33.75H49.1455V29.6053H46.7345Z"
-        fill="currentColor"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/KingBedSmall.tsx b/apps/scandic-web/components/Icons/Beds/KingBedSmall.tsx
deleted file mode 100644
index bdd230642..000000000
--- a/apps/scandic-web/components/Icons/Beds/KingBedSmall.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function KingBedSmallIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M1.04175 10.0104C1.04175 9.57819 1.19474 9.21146 1.50073 8.91021C1.80671 8.60896 2.17455 8.45833 2.60425 8.45833H2.68758V6C2.68758 5.57031 2.84057 5.20247 3.14656 4.89648C3.45255 4.59049 3.82039 4.4375 4.25008 4.4375H15.7501C16.1798 4.4375 16.5476 4.59049 16.8536 4.89648C17.1596 5.20247 17.3126 5.57031 17.3126 6V8.45833H17.3959C17.8256 8.45833 18.1934 8.61133 18.4994 8.91731C18.8054 9.2233 18.9584 9.59114 18.9584 10.0208V12.9688C18.9584 13.2674 18.8542 13.5208 18.6459 13.7292C18.4376 13.9375 18.1843 14.0417 17.8862 14.0417H17.6459V14.9063C17.6459 15.1215 17.5695 15.3056 17.4167 15.4583C17.264 15.6111 17.0799 15.6875 16.8647 15.6875C16.6494 15.6875 16.4654 15.6111 16.3126 15.4583C16.1598 15.3056 16.0834 15.1215 16.0834 14.9063V14.0417H3.91675V14.9063C3.91675 15.1215 3.84036 15.3056 3.68758 15.4583C3.5348 15.6111 3.35078 15.6875 3.1355 15.6875C2.92022 15.6875 2.73619 15.6111 2.58341 15.4583C2.43064 15.3056 2.35425 15.1215 2.35425 14.9063V14.0417H2.11398C1.81582 14.0417 1.56258 13.9375 1.35425 13.7292C1.14591 13.5208 1.04175 13.2674 1.04175 12.9688V10.0104ZM15.7501 8.45833H10.7813V6H15.7501V8.45833ZM9.21883 8.45833H4.25008V6H9.21883V8.45833ZM17.3959 12.4792H2.60425V10.0208H17.3959V12.4792Z"
-        fill="#57514E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/QueenBed.tsx b/apps/scandic-web/components/Icons/Beds/QueenBed.tsx
deleted file mode 100644
index 2445148a8..000000000
--- a/apps/scandic-web/components/Icons/Beds/QueenBed.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function QueenBedIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="50"
-      height="32"
-      viewBox="0 0 50 32"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M49.8008 20.6355V20.3364C49.7012 15.352 47.1116 12.4611 43.2271 10.7664V8.17445C43.2271 3.09034 39.3426 0 32.7689 0C27.8884 0 25.2988 1.6947 23.9044 4.68536C22.3108 2.19315 20.0199 0.697819 15.4382 0.697819C8.76494 0.797508 4.88048 3.88785 4.88048 8.97196V11.3645C1.89243 13.1589 0 15.9502 0 20.6355V30.2056C0 31.2025 0.796813 32 1.89243 32H4.38247C5.37849 32 6.2749 31.2025 6.2749 30.2056V25.919H43.7251V30.1059C43.7251 31.1028 44.5219 31.9003 45.6175 31.9003H48.1076C49.1036 31.9003 50 31.1028 50 30.1059V20.6355H49.8008ZM1.89243 24.1246V21.5327H48.008V24.1246H1.89243ZM32.5697 1.89408C29.9801 1.89408 24.9004 2.49221 24.9004 8.27414L24.8008 8.37383V8.47352C30.4781 8.47352 36.1554 8.57321 41.2351 10.1682V8.27414C41.2351 2.49221 35.1594 1.89408 32.5697 1.89408ZM6.67331 8.97196C6.67331 3.19003 12.749 2.5919 15.3386 2.5919C17.8287 2.5919 22.6096 3.19003 23.008 8.37383C16.8327 8.37383 11.3546 8.47352 6.67331 10.3676V8.97196ZM41.7331 12.0623C36.753 10.1682 30.5777 10.1682 23.9044 10.1682C10.8566 10.1682 2.49004 10.866 1.89243 19.6386H47.9084C47.6096 15.8505 45.3187 13.5576 42.0319 12.162C41.9323 12.162 41.8327 12.162 41.7331 12.0623ZM1.89243 30.1059V25.919H4.38247V30.1059H1.89243ZM45.5179 25.919V30.1059H48.008V25.919H45.5179Z"
-        fill="currentColor"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/SingleBed.tsx b/apps/scandic-web/components/Icons/Beds/SingleBed.tsx
deleted file mode 100644
index a6122139b..000000000
--- a/apps/scandic-web/components/Icons/Beds/SingleBed.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SingleBedIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="36"
-      height="32"
-      viewBox="0 0 36 32"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M29.52 9.90228C33.3257 11.6743 35.8971 14.6971 36 19.9088V20.1173V20.2215V30.1238C36 31.1661 35.1771 32 34.1486 32H31.7829C30.7543 32 29.9314 31.1661 29.9314 30.1238V25.6417H6.06857V30.1238C6.06857 31.1661 5.24571 32 4.21714 32H1.85143C0.822857 32 0 31.1661 0 30.1238V20.1173C0 15.3225 1.85143 12.2997 4.73143 10.3192L6.58286 9.38111C7.09714 9.17264 7.71429 8.96417 8.33143 8.7557C8.33143 6.14984 9.05143 3.96091 10.4914 2.50163C12.0343 0.833876 14.5029 0 17.5886 0C24.1714 0 27.5657 3.0228 27.5657 9.0684H27.4629C27.4629 9.17264 27.5657 9.17264 27.6686 9.17264L29.52 9.90228ZM17.6914 2.08469C15.0171 2.08469 13.1657 2.7101 11.9314 3.96091C10.9029 4.89902 10.3886 6.46254 10.3886 8.33876C12.1371 8.02606 14.0914 7.71335 16.0457 7.60912L20.0571 7.71335C22.0114 7.92182 23.9657 8.23453 25.7143 8.65147C25.6114 5.4202 24.48 2.08469 17.6914 2.08469ZM16.0457 9.38111L20.0571 9.48534C23.04 9.79805 25.8171 10.215 28.1829 11.1531C28.2857 11.2573 28.3886 11.2573 28.4914 11.2573C31.7829 12.7166 33.9429 15.114 34.2514 19.0749H1.85143C2.26286 12.0912 7.71428 10.0065 16.0457 9.38111ZM1.85143 30.1238H4.21714V25.6417H1.85143V30.1238ZM16.0457 23.7655H1.85143V21.0554H34.1486V23.7655H16.0457ZM31.7829 25.6417V30.1238H34.1486V25.6417H31.7829Z"
-        fill="currentColor"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Beds/TwinBeds.tsx b/apps/scandic-web/components/Icons/Beds/TwinBeds.tsx
deleted file mode 100644
index ee55d973c..000000000
--- a/apps/scandic-web/components/Icons/Beds/TwinBeds.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function TwinBedsIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="75"
-      height="32"
-      viewBox="0 0 75 32"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M29.8958 9.90228C33.75 11.6743 36.3542 14.6971 36.4583 19.9088V20.1173V20.2215V30.1238C36.4583 31.1661 35.625 32 34.5833 32H32.1875C31.1458 32 30.3125 31.1661 30.3125 30.1238V25.6417H6.14583V30.1238C6.14583 31.1661 5.3125 32 4.27083 32H1.875C0.833333 32 0 31.1661 0 30.1238V20.1173C0 15.3225 1.875 12.2997 4.79167 10.3192L6.66667 9.38111C7.1875 9.17264 7.8125 8.96417 8.4375 8.7557C8.4375 6.14984 9.16667 3.96091 10.625 2.50163C12.1875 0.833876 14.6875 0 17.8125 0C24.4792 0 27.9167 3.0228 27.9167 9.0684H27.8125C27.8125 9.17264 27.9167 9.17264 28.0208 9.17264L29.8958 9.90228ZM17.9167 2.08469C15.2083 2.08469 13.3333 2.7101 12.0833 3.96091C11.0417 4.89902 10.5208 6.46254 10.5208 8.33876C12.2917 8.02606 14.2708 7.71335 16.25 7.60912L20.3125 7.71335C22.2917 7.92182 24.2708 8.23453 26.0417 8.65147C25.9375 5.4202 24.7917 2.08469 17.9167 2.08469ZM16.25 9.38111L20.3125 9.48534C23.3333 9.79805 26.1458 10.215 28.5417 11.1531C28.6458 11.2573 28.75 11.2573 28.8542 11.2573C32.1875 12.7166 34.375 15.114 34.6875 19.0749H1.875C2.29167 12.0912 7.8125 10.0065 16.25 9.38111ZM1.875 30.1238H4.27083V25.6417H1.875V30.1238ZM16.25 23.7655H1.875V21.0554H34.5833V23.7655H16.25ZM32.1875 25.6417V30.1238H34.5833V25.6417H32.1875ZM75 19.9088C74.8958 14.6971 72.2917 11.6743 68.4375 9.90228L66.5625 9.17264C66.4583 9.17264 66.3542 9.17264 66.3542 9.0684H66.4583C66.4583 3.0228 63.0208 0 56.3542 0C53.2292 0 50.7292 0.833876 49.1667 2.50163C47.7083 3.96091 46.9792 6.14984 46.9792 8.7557C46.3542 8.96417 45.7292 9.17264 45.2083 9.38111L43.3333 10.3192C40.4167 12.2997 38.5417 15.3225 38.5417 20.1173V30.1238C38.5417 31.1661 39.375 32 40.4167 32H42.8125C43.8542 32 44.6875 31.1661 44.6875 30.1238V25.6417H68.8542V30.1238C68.8542 31.1661 69.6875 32 70.7292 32H73.125C74.1667 32 75 31.1661 75 30.1238V20.2215V20.1173V19.9088ZM56.4583 2.08469C53.75 2.08469 51.875 2.7101 50.625 3.96091C49.5833 4.89902 49.0625 6.46254 49.0625 8.33876C50.8333 8.02606 52.8125 7.71335 54.7917 7.60912L58.8542 7.71335C60.8333 7.92182 62.8125 8.23453 64.5833 8.65147C64.4792 5.4202 63.3333 2.08469 56.4583 2.08469ZM54.7917 9.38111L58.8542 9.48534C61.875 9.79805 64.6875 10.215 67.0833 11.1531C67.1875 11.2573 67.2917 11.2573 67.3958 11.2573C70.7292 12.7166 72.9167 15.114 73.2292 19.0749H40.4167C40.8333 12.0912 46.3542 10.0065 54.7917 9.38111ZM40.4167 30.1238H42.8125V25.6417H40.4167V30.1238ZM54.7917 23.7655H40.4167V21.0554H73.125V23.7655H54.7917ZM70.7292 25.6417V30.1238H73.125V25.6417H70.7292Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Bike.tsx b/apps/scandic-web/components/Icons/Bike.tsx
deleted file mode 100644
index 131d91a99..000000000
--- a/apps/scandic-web/components/Icons/Bike.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BikeIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5.125 19.825C3.75 19.825 2.59375 19.3563 1.65625 18.4188C0.71875 17.4813 0.25 16.325 0.25 14.95C0.25 13.575 0.72775 12.4146 1.68325 11.4688C2.63875 10.5229 3.79433 10.05 5.15 10.05C6.35833 10.05 7.39792 10.4292 8.26875 11.1875C9.13958 11.9459 9.68333 12.8834 9.9 14H10.65L8.85 8.97502H8.0625C7.80417 8.97502 7.58333 8.88336 7.4 8.70002C7.21667 8.51669 7.125 8.29586 7.125 8.03752C7.125 7.77919 7.21667 7.55836 7.4 7.37502C7.58333 7.19169 7.80417 7.10002 8.0625 7.10002H11.0375C11.2958 7.10002 11.5167 7.19169 11.7 7.37502C11.8833 7.55836 11.975 7.77919 11.975 8.03752C11.975 8.29586 11.8833 8.51669 11.7 8.70002C11.5167 8.88336 11.2958 8.97502 11.0375 8.97502H10.85L11.225 10.05H16.075L14.6 6.02502H12.9875C12.7292 6.02502 12.5083 5.93336 12.325 5.75002C12.1417 5.56669 12.05 5.34586 12.05 5.08752C12.05 4.82919 12.1417 4.60836 12.325 4.42502C12.5083 4.24169 12.7292 4.15002 12.9875 4.15002H14.575C14.9922 4.15002 15.3652 4.26044 15.6941 4.48127C16.023 4.70211 16.2583 5.00836 16.4 5.40002L18.075 10.025H18.9C20.2487 10.025 21.3984 10.5005 22.3491 11.4515C23.2997 12.4024 23.775 13.5525 23.775 14.9018C23.775 16.2673 23.3021 17.4292 22.3563 18.3875C21.4104 19.3459 20.2563 19.825 18.8938 19.825C17.7259 19.825 16.7 19.4547 15.816 18.7141C14.932 17.9735 14.3683 17.0271 14.125 15.875H9.9C9.68333 17.0167 9.13489 17.9604 8.25468 18.7063C7.37446 19.4521 6.33123 19.825 5.125 19.825ZM5.125 17.95C5.80833 17.95 6.4 17.7563 6.9 17.3688C7.4 16.9813 7.75 16.4834 7.95 15.875H6.1125C5.85417 15.875 5.63333 15.7834 5.45 15.6C5.26667 15.4167 5.175 15.1959 5.175 14.9375C5.175 14.6792 5.26667 14.4584 5.45 14.275C5.63333 14.0917 5.85417 14 6.1125 14H7.95C7.75 13.375 7.4 12.8771 6.9 12.5063C6.4 12.1354 5.80833 11.95 5.125 11.95C4.275 11.95 3.5625 12.2375 2.9875 12.8125C2.4125 13.3875 2.125 14.1 2.125 14.95C2.125 15.7917 2.4125 16.5021 2.9875 17.0813C3.5625 17.6604 4.275 17.95 5.125 17.95ZM12.6747 14H14.1209C14.207 13.6167 14.3271 13.2459 14.4812 12.8875C14.6354 12.5292 14.8417 12.2084 15.1 11.925H11.9L12.6747 14ZM18.9 17.95C19.75 17.95 20.4625 17.6604 21.0375 17.0813C21.6125 16.5021 21.9 15.7917 21.9 14.95C21.9 14.1 21.6125 13.3875 21.0375 12.8125C20.4625 12.2375 19.75 11.95 18.9 11.95H18.75L19.4 13.7C19.4917 13.95 19.4831 14.1889 19.3742 14.4168C19.2653 14.6447 19.0864 14.8057 18.8375 14.9C18.5875 14.9917 18.3462 14.9831 18.1136 14.8742C17.8809 14.7653 17.7181 14.5864 17.625 14.3375L17 12.6C16.6417 12.8834 16.3688 13.225 16.1813 13.625C15.9938 14.025 15.9 14.4682 15.9 14.9546C15.9 15.7932 16.1875 16.5021 16.7625 17.0813C17.3375 17.6604 18.05 17.95 18.9 17.95Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Biking.tsx b/apps/scandic-web/components/Icons/Biking.tsx
deleted file mode 100644
index 2ed9143b5..000000000
--- a/apps/scandic-web/components/Icons/Biking.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BikingIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M15.4125 5.5751C14.8875 5.5751 14.4354 5.38551 14.0562 5.00635C13.677 4.62718 13.4875 4.1751 13.4875 3.6501C13.4875 3.1251 13.677 2.67301 14.0562 2.29385C14.4354 1.91468 14.8875 1.7251 15.4125 1.7251C15.9375 1.7251 16.3895 1.91468 16.7687 2.29385C17.1479 2.67301 17.3375 3.1251 17.3375 3.6501C17.3375 4.1751 17.1479 4.62718 16.7687 5.00635C16.3895 5.38551 15.9375 5.5751 15.4125 5.5751ZM10.7875 10.4751L12.4375 12.2376C12.6041 12.4126 12.7291 12.6084 12.8125 12.8251C12.8958 13.0418 12.9375 13.2709 12.9375 13.5126V17.9126C12.9375 18.1709 12.8458 18.3918 12.6625 18.5751C12.4791 18.7584 12.2583 18.8501 12 18.8501C11.7416 18.8501 11.5208 18.7584 11.3375 18.5751C11.1541 18.3918 11.0625 18.1709 11.0625 17.9126V13.9501L7.86245 11.1501C7.65412 10.9668 7.5062 10.7688 7.4187 10.5563C7.3312 10.3438 7.28745 10.1001 7.28745 9.8251C7.28745 9.5501 7.33328 9.31052 7.42495 9.10635C7.51662 8.90218 7.66245 8.7001 7.86245 8.5001L10.6625 5.7251C10.8625 5.5251 11.0833 5.37926 11.325 5.2876C11.5666 5.19593 11.825 5.1501 12.1 5.1501C12.375 5.1501 12.6333 5.19593 12.875 5.2876C13.1166 5.37926 13.3375 5.5251 13.5375 5.7251L15.4125 7.6001C15.7541 7.94176 16.1395 8.23551 16.5687 8.48135C16.9979 8.72718 17.4791 8.89593 18.0125 8.9876C18.2708 9.02926 18.4895 9.14593 18.6687 9.3376C18.8479 9.52926 18.9375 9.75426 18.9375 10.0126C18.9375 10.2793 18.8416 10.5001 18.65 10.6751C18.4583 10.8501 18.2333 10.9209 17.975 10.8876C17.175 10.7793 16.4395 10.5501 15.7687 10.2001C15.0979 9.8501 14.5041 9.41677 13.9875 8.9001L13.175 8.0876L10.7875 10.4751ZM5.13745 12.0251C6.51245 12.0251 7.6687 12.4938 8.6062 13.4313C9.5437 14.3688 10.0125 15.5251 10.0125 16.9001C10.0125 18.2751 9.5437 19.4313 8.6062 20.3688C7.6687 21.3063 6.51245 21.7751 5.13745 21.7751C3.76245 21.7751 2.6062 21.3063 1.6687 20.3688C0.731201 19.4313 0.262451 18.2751 0.262451 16.9001C0.262451 15.5251 0.731201 14.3688 1.6687 13.4313C2.6062 12.4938 3.76245 12.0251 5.13745 12.0251ZM5.13745 20.3501C6.07912 20.3501 6.88953 20.0105 7.5687 19.3313C8.24787 18.6522 8.58745 17.8418 8.58745 16.9001C8.58745 15.9584 8.24787 15.148 7.5687 14.4688C6.88953 13.7897 6.07912 13.4501 5.13745 13.4501C4.19578 13.4501 3.38537 13.7897 2.7062 14.4688C2.02703 15.148 1.68745 15.9584 1.68745 16.9001C1.68745 17.8418 2.02703 18.6522 2.7062 19.3313C3.38537 20.0105 4.19578 20.3501 5.13745 20.3501ZM18.8375 12.0251C20.2125 12.0251 21.3729 12.4938 22.3187 13.4313C23.2645 14.3688 23.7375 15.5251 23.7375 16.9001C23.7375 18.2751 23.2645 19.4313 22.3187 20.3688C21.3729 21.3063 20.2125 21.7751 18.8375 21.7751C17.4625 21.7751 16.3104 21.3063 15.3812 20.3688C14.452 19.4313 13.9875 18.2751 13.9875 16.9001C13.9875 15.5251 14.452 14.3688 15.3812 13.4313C16.3104 12.4938 17.4625 12.0251 18.8375 12.0251ZM18.8625 20.3501C19.8041 20.3501 20.6145 20.0105 21.2937 19.3313C21.9729 18.6522 22.3125 17.8418 22.3125 16.9001C22.3125 15.9584 21.9729 15.148 21.2937 14.4688C20.6145 13.7897 19.8041 13.4501 18.8625 13.4501C17.9208 13.4501 17.1104 13.7897 16.4312 14.4688C15.752 15.148 15.4125 15.9584 15.4125 16.9001C15.4125 17.8418 15.752 18.6522 16.4312 19.3313C17.1104 20.0105 17.9208 20.3501 18.8625 20.3501Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/BookingCode.tsx b/apps/scandic-web/components/Icons/BookingCode.tsx
deleted file mode 100644
index 94aa7dbe1..000000000
--- a/apps/scandic-web/components/Icons/BookingCode.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BookingCodeIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M12.6734 2.27895C12.3015 1.90702 11.6985 1.90702 11.3266 2.27895L8.89123 4.71429H5.66667C5.14068 4.71429 4.71428 5.14068 4.71428 5.66667V8.89123L2.27895 11.3266C1.90702 11.6985 1.90702 12.3015 2.27895 12.6734L4.71428 15.1088V18.3333C4.71428 18.8593 5.14068 19.2857 5.66667 19.2857H8.89122L11.3266 21.7211C11.6985 22.093 12.3015 22.093 12.6734 21.7211L15.1088 19.2857H18.3333C18.8593 19.2857 19.2857 18.8593 19.2857 18.3333V15.1088L21.7211 12.6734C22.093 12.3015 22.093 11.6985 21.7211 11.3266L19.2857 8.89122V5.66667C19.2857 5.14068 18.8593 4.71429 18.3333 4.71429H15.1088L12.6734 2.27895ZM15.6957 8.30441C16.1014 8.71015 16.1014 9.36798 15.6957 9.77372L9.77363 15.6958C9.36789 16.1015 8.71006 16.1015 8.30432 15.6958C7.89858 15.2901 7.89858 14.6322 8.30432 14.2265L14.2264 8.30441C14.6321 7.89867 15.29 7.89867 15.6957 8.30441ZM9.53248 11.0131C10.3502 11.0131 11.013 10.3502 11.013 9.53257C11.013 8.7149 10.3502 8.05205 9.53248 8.05205C8.71481 8.05205 8.05196 8.7149 8.05196 9.53257C8.05196 10.3502 8.71481 11.0131 9.53248 11.0131ZM15.9481 14.4676C15.9481 15.2853 15.2852 15.9482 14.4675 15.9482C13.6499 15.9482 12.987 15.2853 12.987 14.4676C12.987 13.65 13.6499 12.9871 14.4675 12.9871C15.2852 12.9871 15.9481 13.65 15.9481 14.4676Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Breakfast.tsx b/apps/scandic-web/components/Icons/Breakfast.tsx
deleted file mode 100644
index 6bd0e3705..000000000
--- a/apps/scandic-web/components/Icons/Breakfast.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BreakfastIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="33"
-      viewBox="0 0 32 33"
-      width="32"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M3 27H21.2167V28.25C21.2167 28.5944 21.0944 28.8889 20.85 29.1333C20.6056 29.3778 20.3111 29.5 19.9667 29.5H4.25C3.90556 29.5 3.61111 29.3778 3.36667 29.1333C3.12222 28.8889 3 28.5944 3 28.25V27ZM3 24.4333V23.1833C3 22.8389 3.12222 22.5444 3.36667 22.3C3.61111 22.0556 3.90556 21.9333 4.25 21.9333H9.53333V20.75C9.53333 20.4056 9.65556 20.1111 9.9 19.8667C10.1444 19.6222 10.4389 19.5 10.7833 19.5H13.4333C13.7778 19.5 14.0722 19.6222 14.3167 19.8667C14.5611 20.1111 14.6833 20.4056 14.6833 20.75V21.9333H19.9667C20.3111 21.9333 20.6056 22.0556 20.85 22.3C21.0944 22.5444 21.2167 22.8389 21.2167 23.1833V24.4333H3ZM23.9167 21.4667C23.15 20.6444 22.5278 19.7889 22.05 18.9C21.5722 18.0111 21.3333 16.9556 21.3333 15.7333V4.75C21.3333 4.40556 21.4556 4.11111 21.7 3.86667C21.9444 3.62222 22.2389 3.5 22.5833 3.5H27.75C28.0944 3.5 28.3889 3.62222 28.6333 3.86667C28.8778 4.11111 29 4.40556 29 4.75V15.7333C29 16.9556 28.7639 18.0139 28.2917 18.9083C27.8194 19.8028 27.1944 20.6556 26.4167 21.4667V27H27.7167C28.0611 27 28.3556 27.1222 28.6 27.3667C28.8444 27.6111 28.9667 27.9056 28.9667 28.25C28.9667 28.5944 28.8444 28.8889 28.6 29.1333C28.3556 29.3778 28.0611 29.5 27.7167 29.5H25.1667C24.8222 29.5 24.5278 29.3778 24.2833 29.1333C24.0389 28.8889 23.9167 28.5944 23.9167 28.25V21.4667ZM23.8333 11.3H26.5V6H23.8333V11.3ZM25.1667 19.1667C25.5667 18.7111 25.8889 18.1806 26.1333 17.575C26.3778 16.9694 26.5 16.3556 26.5 15.7333V13.8H23.8333V15.7333C23.8333 16.3556 23.95 16.9694 24.1833 17.575C24.4167 18.1806 24.7444 18.7111 25.1667 19.1667Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Business.tsx b/apps/scandic-web/components/Icons/Business.tsx
deleted file mode 100644
index 57e0e7f9f..000000000
--- a/apps/scandic-web/components/Icons/Business.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BusinessIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.125 20.75C3.60937 20.75 3.16796 20.5664 2.80077 20.1992C2.43359 19.832 2.25 19.3906 2.25 18.875V7.875C2.25 7.35937 2.43359 6.91796 2.80077 6.55078C3.16796 6.18359 3.60937 6 4.125 6H8.15V4.1239C8.15 3.60797 8.33359 3.16667 8.70078 2.8C9.06796 2.43333 9.50937 2.25 10.025 2.25H13.975C14.4906 2.25 14.932 2.43359 15.2992 2.80078C15.6664 3.16796 15.85 3.60937 15.85 4.125V6H19.875C20.3906 6 20.832 6.18359 21.1992 6.55078C21.5664 6.91796 21.75 7.35937 21.75 7.875V18.875C21.75 19.3906 21.5664 19.832 21.1992 20.1992C20.832 20.5664 20.3906 20.75 19.875 20.75H4.125ZM10.025 6H13.975V4.125H10.025V6ZM19.875 14.925H14.8625V15.9125C14.8625 16.1708 14.7708 16.3917 14.5875 16.575C14.4042 16.7583 14.1833 16.85 13.925 16.85H10.075C9.81667 16.85 9.59583 16.7583 9.4125 16.575C9.22917 16.3917 9.1375 16.1708 9.1375 15.9125V14.925H4.125V18.875H19.875V14.925ZM11.0125 14.975H12.9875V13H11.0125V14.975ZM4.125 13.05H9.1375V12.0625C9.1375 11.8042 9.22917 11.5833 9.4125 11.4C9.59583 11.2167 9.81667 11.125 10.075 11.125H13.925C14.1833 11.125 14.4042 11.2167 14.5875 11.4C14.7708 11.5833 14.8625 11.8042 14.8625 12.0625V13.05H19.875V7.875H4.125V13.05Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Cable.tsx b/apps/scandic-web/components/Icons/Cable.tsx
deleted file mode 100644
index 493994d60..000000000
--- a/apps/scandic-web/components/Icons/Cable.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CableIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M5.087 20.8a.932.932 0 0 1-.676-.266.883.883 0 0 1-.274-.659v-1H4.1a3.918 3.918 0 0 1-.625-.35.673.673 0 0 1-.313-.587v-2.963c0-.262.09-.482.266-.659a.895.895 0 0 1 .66-.266h1.05v-7c0-1.072.382-1.99 1.146-2.754.764-.764 1.683-1.146 2.756-1.146 1.073 0 1.991.382 2.754 1.146.762.763 1.143 1.682 1.143 2.754v9.85c0 .557.199 1.034.596 1.43.397.397.874.595 1.431.595s1.034-.198 1.43-.595c.396-.396.594-.873.594-1.43V9.925h-1.05a.895.895 0 0 1-.66-.266.895.895 0 0 1-.266-.659V6.038c0-.25.105-.446.313-.588.208-.142.417-.258.625-.35h.038v-1c0-.262.088-.482.265-.659a.895.895 0 0 1 .66-.266h2c.269 0 .494.089.676.266a.883.883 0 0 1 .274.659v1h.037c.208.092.417.208.625.35a.673.673 0 0 1 .313.588V9a.895.895 0 0 1-.267.66.895.895 0 0 1-.659.265h-1.05V16.9c0 1.073-.382 1.99-1.146 2.754-.764.764-1.683 1.146-2.756 1.146-1.073 0-1.991-.382-2.754-1.146-.762-.763-1.143-1.681-1.143-2.754V7.05a1.95 1.95 0 0 0-.596-1.43 1.952 1.952 0 0 0-1.431-.595c-.557 0-1.034.198-1.43.595a1.952 1.952 0 0 0-.594 1.43v7h1.05c.263 0 .482.089.66.266a.895.895 0 0 1 .265.659v2.963c0 .25-.104.445-.312.587a3.919 3.919 0 0 1-.625.35h-.038v1a.883.883 0 0 1-.273.66.932.932 0 0 1-.677.265H5.087Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Calendar.tsx b/apps/scandic-web/components/Icons/Calendar.tsx
deleted file mode 100644
index 82f4ba811..000000000
--- a/apps/scandic-web/components/Icons/Calendar.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CalendarIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M4.5 18C4.0875 18 3.73437 17.8507 3.44062 17.5521C3.14687 17.2535 3 16.9028 3 16.5V5.5C3 5.09722 3.14687 4.74653 3.44062 4.44792C3.73437 4.14931 4.0875 4 4.5 4H6V2.75C6 2.5375 6.07145 2.35937 6.21435 2.21562C6.35727 2.07187 6.53435 2 6.7456 2C6.95687 2 7.13542 2.07187 7.28125 2.21562C7.42708 2.35937 7.5 2.5375 7.5 2.75V4H12.5V2.75C12.5 2.5375 12.5715 2.35937 12.7144 2.21562C12.8573 2.07187 13.0344 2 13.2456 2C13.4569 2 13.6354 2.07187 13.7812 2.21562C13.9271 2.35937 14 2.5375 14 2.75V4H15.5C15.9125 4 16.2656 4.14931 16.5594 4.44792C16.8531 4.74653 17 5.09722 17 5.5V16.5C17 16.9028 16.8531 17.2535 16.5594 17.5521C16.2656 17.8507 15.9125 18 15.5 18H4.5ZM4.5 16.5H15.5V9H4.5V16.5ZM4.5 7.5H15.5V5.5H4.5V7.5ZM10.0044 12C9.79313 12 9.61458 11.9285 9.46875 11.7856C9.32292 11.6427 9.25 11.4656 9.25 11.2544C9.25 11.0431 9.32145 10.8646 9.46435 10.7188C9.60727 10.5729 9.78435 10.5 9.9956 10.5C10.2069 10.5 10.3854 10.5715 10.5312 10.7144C10.6771 10.8573 10.75 11.0344 10.75 11.2456C10.75 11.4569 10.6785 11.6354 10.5356 11.7812C10.3927 11.9271 10.2156 12 10.0044 12ZM6.7544 12C6.54313 12 6.36458 11.9285 6.21875 11.7856C6.07292 11.6427 6 11.4656 6 11.2544C6 11.0431 6.07145 10.8646 6.21435 10.7188C6.35727 10.5729 6.53435 10.5 6.7456 10.5C6.95687 10.5 7.13542 10.5715 7.28125 10.7144C7.42708 10.8573 7.5 11.0344 7.5 11.2456C7.5 11.4569 7.42855 11.6354 7.28565 11.7812C7.14273 11.9271 6.96565 12 6.7544 12ZM13.2544 12C13.0431 12 12.8646 11.9285 12.7188 11.7856C12.5729 11.6427 12.5 11.4656 12.5 11.2544C12.5 11.0431 12.5715 10.8646 12.7144 10.7188C12.8573 10.5729 13.0344 10.5 13.2456 10.5C13.4569 10.5 13.6354 10.5715 13.7812 10.7144C13.9271 10.8573 14 11.0344 14 11.2456C14 11.4569 13.9285 11.6354 13.7856 11.7812C13.6427 11.9271 13.4656 12 13.2544 12ZM10.0044 15C9.79313 15 9.61458 14.9285 9.46875 14.7856C9.32292 14.6427 9.25 14.4656 9.25 14.2544C9.25 14.0431 9.32145 13.8646 9.46435 13.7188C9.60727 13.5729 9.78435 13.5 9.9956 13.5C10.2069 13.5 10.3854 13.5715 10.5312 13.7144C10.6771 13.8573 10.75 14.0344 10.75 14.2456C10.75 14.4569 10.6785 14.6354 10.5356 14.7812C10.3927 14.9271 10.2156 15 10.0044 15ZM6.7544 15C6.54313 15 6.36458 14.9285 6.21875 14.7856C6.07292 14.6427 6 14.4656 6 14.2544C6 14.0431 6.07145 13.8646 6.21435 13.7188C6.35727 13.5729 6.53435 13.5 6.7456 13.5C6.95687 13.5 7.13542 13.5715 7.28125 13.7144C7.42708 13.8573 7.5 14.0344 7.5 14.2456C7.5 14.4569 7.42855 14.6354 7.28565 14.7812C7.14273 14.9271 6.96565 15 6.7544 15ZM13.2544 15C13.0431 15 12.8646 14.9285 12.7188 14.7856C12.5729 14.6427 12.5 14.4656 12.5 14.2544C12.5 14.0431 12.5715 13.8646 12.7144 13.7188C12.8573 13.5729 13.0344 13.5 13.2456 13.5C13.4569 13.5 13.6354 13.5715 13.7812 13.7144C13.9271 13.8573 14 14.0344 14 14.2456C14 14.4569 13.9285 14.6354 13.7856 14.7812C13.6427 14.9271 13.4656 15 13.2544 15Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CalendarAdd.tsx b/apps/scandic-web/components/Icons/CalendarAdd.tsx
deleted file mode 100644
index 5b5e1465c..000000000
--- a/apps/scandic-web/components/Icons/CalendarAdd.tsx
+++ /dev/null
@@ -1,31 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CalendarAddIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M4.25 6.81254H15.75V5.06254H4.25V6.81254ZM4.25 18.125C3.82031 18.125 3.45247 17.972 3.14648 17.6661C2.84049 17.3601 2.6875 16.9922 2.6875 16.5625V5.06254C2.6875 4.63285 2.84049 4.26501 3.14648 3.95902C3.45247 3.65303 3.82031 3.50004 4.25 3.50004H5.1875V2.61462C5.1875 2.39935 5.26389 2.21532 5.41667 2.06254C5.56944 1.90976 5.75347 1.83337 5.96875 1.83337C6.18403 1.83337 6.36806 1.90976 6.52083 2.06254C6.67361 2.21532 6.75 2.39935 6.75 2.61462V3.50004H13.25V2.61462C13.25 2.39935 13.3264 2.21532 13.4792 2.06254C13.6319 1.90976 13.816 1.83337 14.0313 1.83337C14.2465 1.83337 14.4306 1.90976 14.5833 2.06254C14.7361 2.21532 14.8125 2.39935 14.8125 2.61462V3.50004H15.75C16.1797 3.50004 16.5475 3.65303 16.8535 3.95902C17.1595 4.26501 17.3125 4.63285 17.3125 5.06254V11.3917C17.0643 11.2875 16.8095 11.2007 16.5482 11.1313C16.2869 11.0618 16.0208 11.0132 15.75 10.9855V8.37504H4.25V16.5625H11.4896C11.5806 16.849 11.6878 17.1224 11.8113 17.3829C11.9348 17.6433 12.081 17.8907 12.25 18.125H4.25Z"
-        fill="#4D001B"
-      />
-      <path
-        d="M13.3333 16.5813H15.0521V18.3C15.0521 18.5153 15.1285 18.6993 15.2812 18.8521C15.434 19.0049 15.6181 19.0813 15.8333 19.0813C16.0486 19.0813 16.2326 19.0049 16.3854 18.8521C16.5382 18.6993 16.6146 18.5153 16.6146 18.3V16.5813H18.3333C18.5486 16.5813 18.7326 16.5049 18.8854 16.3521C19.0382 16.1993 19.1146 16.0153 19.1146 15.8C19.1146 15.5848 19.0382 15.4007 18.8854 15.248C18.7326 15.0952 18.5486 15.0188 18.3333 15.0188H16.6146V13.3C16.6146 13.0848 16.5382 12.9007 16.3854 12.748C16.2326 12.5952 16.0486 12.5188 15.8333 12.5188C15.6181 12.5188 15.434 12.5952 15.2812 12.748C15.1285 12.9007 15.0521 13.0848 15.0521 13.3V15.0188H13.3333C13.1181 15.0188 12.934 15.0952 12.7812 15.248C12.6285 15.4007 12.5521 15.5848 12.5521 15.8C12.5521 16.0153 12.6285 16.1993 12.7812 16.3521C12.934 16.5049 13.1181 16.5813 13.3333 16.5813Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Camera.tsx b/apps/scandic-web/components/Icons/Camera.tsx
deleted file mode 100644
index a41729cb6..000000000
--- a/apps/scandic-web/components/Icons/Camera.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CameraIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12 17.375C13.225 17.375 14.2625 16.95 15.1125 16.1C15.9625 15.25 16.3875 14.2125 16.3875 12.9875C16.3875 11.7625 15.9625 10.725 15.1125 9.875C14.2625 9.025 13.225 8.6 12 8.6C10.775 8.6 9.7375 9.025 8.8875 9.875C8.0375 10.725 7.6125 11.7625 7.6125 12.9875C7.6125 14.2125 8.0375 15.25 8.8875 16.1C9.7375 16.95 10.775 17.375 12 17.375ZM11.9949 15.5C11.29 15.5 10.6958 15.2583 10.2125 14.775C9.72917 14.2917 9.4875 13.6975 9.4875 12.9926C9.4875 12.2877 9.72917 11.6918 10.2125 11.2051C10.6958 10.7184 11.29 10.475 11.9949 10.475C12.6998 10.475 13.2957 10.7184 13.7824 11.2051C14.2691 11.6918 14.5125 12.2877 14.5125 12.9926C14.5125 13.6975 14.2691 14.2917 13.7824 14.775C13.2957 15.2583 12.6998 15.5 11.9949 15.5ZM4.125 20.75C3.60937 20.75 3.16796 20.5664 2.80077 20.1992C2.43359 19.832 2.25 19.3906 2.25 18.875V7.1125C2.25 6.59687 2.43359 6.15546 2.80077 5.78828C3.16796 5.42109 3.60937 5.2375 4.125 5.2375H7.275L8.5125 3.875C8.68652 3.6827 8.89613 3.53046 9.14133 3.41828C9.38651 3.30609 9.64357 3.25 9.9125 3.25H14.0875C14.3564 3.25 14.6135 3.30609 14.8587 3.41828C15.1039 3.53046 15.3135 3.6827 15.4875 3.875L16.725 5.2375H19.875C20.3906 5.2375 20.832 5.42109 21.1992 5.78828C21.5664 6.15546 21.75 6.59687 21.75 7.1125V18.875C21.75 19.3906 21.5664 19.832 21.1992 20.1992C20.832 20.5664 20.3906 20.75 19.875 20.75H4.125ZM4.125 18.875H19.875V7.1125H15.8853L14.0875 5.125H9.9162L8.125 7.1125H4.125V18.875Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Cellphone.tsx b/apps/scandic-web/components/Icons/Cellphone.tsx
deleted file mode 100644
index d40fdbc8d..000000000
--- a/apps/scandic-web/components/Icons/Cellphone.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CellphoneIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 21 20"
-      width="21"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M6.20694 18.5831C5.83183 18.5831 5.51476 18.4536 5.25573 18.1946C4.9967 17.9356 4.86719 17.6185 4.86719 17.2434V2.75625C4.86719 2.38114 4.9967 2.06407 5.25573 1.80505C5.51476 1.54602 5.83183 1.4165 6.20694 1.4165H14.6941C15.0692 1.4165 15.3862 1.54602 15.6453 1.80505C15.9043 2.06407 16.0338 2.38114 16.0338 2.75625V17.2434C16.0338 17.6185 15.9043 17.9356 15.6453 18.1946C15.3862 18.4536 15.0692 18.5831 14.6941 18.5831H6.20694ZM5.9505 16.2915V17.2434C5.9505 17.3075 5.97721 17.3663 6.03063 17.4197C6.08406 17.4731 6.14283 17.4998 6.20694 17.4998H14.6941C14.7582 17.4998 14.8169 17.4731 14.8704 17.4197C14.9238 17.3663 14.9505 17.3075 14.9505 17.2434V16.2915H5.9505ZM5.9505 15.2082H14.9505V4.79146H5.9505V15.2082ZM5.9505 3.70817H14.9505V2.75625C14.9505 2.69214 14.9238 2.63337 14.8704 2.57994C14.8169 2.52653 14.7582 2.49982 14.6941 2.49982H6.20694C6.14283 2.49982 6.08406 2.52653 6.03063 2.57994C5.97721 2.63337 5.9505 2.69214 5.9505 2.75625V3.70817Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Chair.tsx b/apps/scandic-web/components/Icons/Chair.tsx
deleted file mode 100644
index 0696cea8f..000000000
--- a/apps/scandic-web/components/Icons/Chair.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChairIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M5.1202 20.7C4.85675 20.7 4.63336 20.6113 4.45002 20.4341C4.26669 20.2568 4.17502 20.0371 4.17502 19.775V18.775H4.12502C3.33336 18.775 2.66044 18.4979 2.10627 17.9437C1.55211 17.3896 1.27502 16.7166 1.27502 15.925V11C1.27502 10.1916 1.55419 9.51456 2.11252 8.96873C2.67086 8.42289 3.34169 8.14998 4.12502 8.14998V6.19998C4.12502 5.40831 4.40627 4.73539 4.96877 4.18123C5.53127 3.62706 6.20836 3.34998 7.00002 3.34998H17.025C17.8167 3.34998 18.4938 3.62706 19.0563 4.18123C19.6188 4.73539 19.9 5.40831 19.9 6.19998V8.14998C20.6917 8.14998 21.3646 8.42706 21.9188 8.98123C22.4729 9.53539 22.75 10.2083 22.75 11V15.925C22.75 16.7166 22.4729 17.3896 21.9188 17.9437C21.3646 18.4979 20.6917 18.775 19.9 18.775H19.85V19.775C19.85 20.0371 19.759 20.2568 19.5769 20.4341C19.3948 20.6113 19.1692 20.7 18.9 20.7C18.6379 20.7 18.4183 20.6113 18.241 20.4341C18.0637 20.2568 17.975 20.0371 17.975 19.775V18.775H6.05002V19.775C6.05002 20.0333 5.96092 20.2521 5.7827 20.4312C5.60448 20.6104 5.38365 20.7 5.1202 20.7ZM4.12502 16.9H19.9C20.1667 16.9 20.3959 16.8083 20.5875 16.625C20.7792 16.4416 20.875 16.2101 20.875 15.9304V10.9945C20.875 10.7148 20.7792 10.4833 20.5875 10.3C20.3959 10.1166 20.1667 10.025 19.9 10.025C19.6167 10.025 19.3792 10.1166 19.1875 10.3C18.9959 10.4833 18.9 10.7166 18.9 11V14.9H5.12502V11C5.12502 10.7166 5.02919 10.4833 4.83752 10.3C4.64586 10.1166 4.40836 10.025 4.12502 10.025C3.85836 10.025 3.62919 10.1166 3.43752 10.3C3.24586 10.4833 3.15002 10.7148 3.15002 10.9945V15.9304C3.15002 16.2101 3.24586 16.4416 3.43752 16.625C3.62919 16.8083 3.85836 16.9 4.12502 16.9ZM7.00002 13.025H17.025V11C17.025 10.5583 17.1167 10.1604 17.3 9.80623C17.4834 9.45206 17.725 9.1401 18.025 8.87035V6.2046C18.025 5.93485 17.929 5.70414 17.7369 5.51248C17.5449 5.32081 17.3069 5.22498 17.0229 5.22498H7.0021C6.71818 5.22498 6.48019 5.32081 6.28812 5.51248C6.09606 5.70414 6.00002 5.93505 6.00002 6.2052V8.87498C6.30002 9.14164 6.54169 9.45206 6.72502 9.80623C6.90836 10.1604 7.00002 10.5583 7.00002 11V13.025Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Check.tsx b/apps/scandic-web/components/Icons/Check.tsx
deleted file mode 100644
index b9b266bb0..000000000
--- a/apps/scandic-web/components/Icons/Check.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CheckIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M9.57552 15.1752L17.9505 6.8002C18.1422 6.60853 18.3651 6.5127 18.6193 6.5127C18.8734 6.5127 19.0964 6.60853 19.288 6.8002C19.4797 6.99186 19.5755 7.21478 19.5755 7.46895C19.5755 7.72311 19.4797 7.94603 19.288 8.1377L10.238 17.1877C10.0464 17.3794 9.82552 17.4752 9.57552 17.4752C9.32552 17.4752 9.10469 17.3794 8.91302 17.1877L4.71302 12.9877C4.52136 12.796 4.42761 12.5731 4.43177 12.3189C4.43594 12.0648 4.53386 11.8419 4.72552 11.6502C4.91719 11.4585 5.14011 11.3627 5.39427 11.3627C5.64844 11.3627 5.87136 11.4585 6.06302 11.6502L9.57552 15.1752Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CheckCircle.tsx b/apps/scandic-web/components/Icons/CheckCircle.tsx
deleted file mode 100644
index 55f100ceb..000000000
--- a/apps/scandic-web/components/Icons/CheckCircle.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CheckCircleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="32"
-      viewBox="0 0 32 32"
-      width="32"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M14.6667 18.4333L11.8148 15.5814C11.5716 15.3383 11.2778 15.2167 10.9333 15.2167C10.5889 15.2167 10.2944 15.3389 10.05 15.5833C9.80556 15.8278 9.68333 16.1222 9.68333 16.4667C9.68333 16.8111 9.8036 17.1036 10.0441 17.3441L13.7833 21.0833C14.0348 21.3389 14.3283 21.4667 14.6636 21.4667C14.999 21.4667 15.2944 21.3389 15.55 21.0833L22.95 13.6833C23.1944 13.4389 23.3167 13.1444 23.3167 12.8C23.3167 12.4556 23.1944 12.1611 22.95 11.9167C22.7056 11.6722 22.4111 11.55 22.0667 11.55C21.7222 11.55 21.4292 11.6708 21.1877 11.9123L14.6667 18.4333ZM16.5 29C14.7021 29 13.0125 28.6582 11.4312 27.9746C9.84986 27.2909 8.47433 26.3632 7.3046 25.1912C6.13487 24.0193 5.20833 22.6435 4.525 21.0638C3.84167 19.484 3.5 17.7961 3.5 16C3.5 14.2021 3.84181 12.5125 4.52543 10.9312C5.20906 9.34986 6.13683 7.97433 7.30877 6.8046C8.4807 5.63487 9.85652 4.70833 11.4362 4.025C13.016 3.34167 14.7039 3 16.5 3C18.2979 3 19.9875 3.34181 21.5688 4.02543C23.1501 4.70906 24.5257 5.63683 25.6954 6.80877C26.8651 7.9807 27.7917 9.35652 28.475 10.9362C29.1583 12.516 29.5 14.2039 29.5 16C29.5 17.7979 29.1582 19.4875 28.4746 21.0688C27.7909 22.6501 26.8632 24.0257 25.6912 25.1954C24.5193 26.3651 23.1435 27.2917 21.5638 27.975C19.984 28.6583 18.2961 29 16.5 29Z"
-        fill="#33800A"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronDown.tsx b/apps/scandic-web/components/Icons/ChevronDown.tsx
deleted file mode 100644
index bd330a67e..000000000
--- a/apps/scandic-web/components/Icons/ChevronDown.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronDownIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.9936 14.436L19.5847 7.43997C19.8278 7.21597 20.1164 7.10597 20.4506 7.10997C20.7848 7.11397 21.0735 7.22797 21.3165 7.45197C21.5596 7.67597 21.6811 7.94197 21.6811 8.24997C21.6811 8.55797 21.5596 8.82397 21.3165 9.04797L13.3738 16.356C13.1742 16.54 12.9571 16.674 12.7228 16.758C12.4884 16.842 12.2453 16.884 11.9936 16.884C11.7419 16.884 11.4988 16.842 11.2644 16.758C11.0301 16.674 10.813 16.54 10.6134 16.356L2.67069 9.03597C2.42763 8.81197 2.30827 8.54797 2.31261 8.24397C2.31695 7.93997 2.44065 7.67597 2.68371 7.45197C2.92676 7.22797 3.21539 7.11597 3.54959 7.11597C3.88379 7.11597 4.17242 7.22797 4.41548 7.45197L11.9936 14.436Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronDownSmall.tsx b/apps/scandic-web/components/Icons/ChevronDownSmall.tsx
deleted file mode 100644
index 4733ab04d..000000000
--- a/apps/scandic-web/components/Icons/ChevronDownSmall.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronDownSmallIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.6876 15.1482C11.5558 15.1482 11.4313 15.1243 11.3142 15.0766C11.1972 15.0289 11.0909 14.9574 10.9955 14.862L6.2818 10.1483C6.09393 9.96039 6 9.73203 6 9.46317C6 9.19432 6.0954 8.96449 6.2862 8.77369C6.477 8.58289 6.70683 8.48749 6.97569 8.48749C7.24454 8.48749 7.47351 8.58203 7.6626 8.77111L11.685 12.7935L15.7074 8.77111C15.8965 8.58203 16.1255 8.48749 16.3943 8.48749C16.6632 8.48749 16.893 8.58289 17.0838 8.77369C17.2746 8.96449 17.37 9.19432 17.37 9.46317C17.37 9.73203 17.2761 9.96039 17.0882 10.1483L12.3745 14.862C12.2791 14.9574 12.1737 15.0289 12.0584 15.0766C11.943 15.1243 11.8194 15.1482 11.6876 15.1482Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronLeft.tsx b/apps/scandic-web/components/Icons/ChevronLeft.tsx
deleted file mode 100644
index 34a0f4e4e..000000000
--- a/apps/scandic-web/components/Icons/ChevronLeft.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronLeftIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M9.45002 12L16.7375 19.2875C16.9709 19.5209 17.0854 19.7959 17.0813 20.1125C17.0771 20.4292 16.9584 20.7042 16.725 20.9375C16.4917 21.1709 16.2167 21.2875 15.9 21.2875C15.5834 21.2875 15.3084 21.1709 15.075 20.9375L7.45002 13.325C7.25836 13.1334 7.11877 12.925 7.03127 12.7C6.94377 12.475 6.90002 12.2417 6.90002 12C6.90002 11.7584 6.94377 11.525 7.03127 11.3C7.11877 11.075 7.25836 10.8667 7.45002 10.675L15.075 3.05004C15.3084 2.8167 15.5854 2.70212 15.9063 2.70629C16.2271 2.71045 16.5042 2.8292 16.7375 3.06254C16.9709 3.29587 17.0875 3.57087 17.0875 3.88754C17.0875 4.2042 16.9709 4.4792 16.7375 4.71254L9.45002 12Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronLeftSmall.tsx b/apps/scandic-web/components/Icons/ChevronLeftSmall.tsx
deleted file mode 100644
index cfc9f8e9a..000000000
--- a/apps/scandic-web/components/Icons/ChevronLeftSmall.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronLeftSmallIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M10.75 12L14.625 15.875C14.8 16.05 14.8875 16.2646 14.8875 16.5187C14.8875 16.7729 14.8 16.9916 14.625 17.175C14.45 17.3583 14.2333 17.4521 13.975 17.4562C13.7166 17.4604 13.4958 17.3708 13.3125 17.1875L8.78745 12.6625C8.69578 12.5708 8.62703 12.4687 8.5812 12.3562C8.53537 12.2437 8.51245 12.125 8.51245 12C8.51245 11.875 8.53537 11.7562 8.5812 11.6437C8.62703 11.5312 8.69578 11.4291 8.78745 11.3375L13.3125 6.81247C13.4958 6.62913 13.7166 6.53955 13.975 6.54372C14.2333 6.54788 14.45 6.64163 14.625 6.82497C14.8 7.0083 14.8875 7.22705 14.8875 7.48122C14.8875 7.73538 14.8 7.94997 14.625 8.12497L10.75 12Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronRight.tsx b/apps/scandic-web/components/Icons/ChevronRight.tsx
deleted file mode 100644
index 7cffe81c5..000000000
--- a/apps/scandic-web/components/Icons/ChevronRight.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronRightIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M14.5375 12L7.24999 4.71251C7.01665 4.47918 6.90207 4.2021 6.90624 3.88126C6.9104 3.56043 7.02915 3.28335 7.26249 3.05001C7.49582 2.81668 7.7729 2.70001 8.09374 2.70001C8.41457 2.70001 8.69165 2.81668 8.92499 3.05001L16.5375 10.675C16.7292 10.8667 16.8687 11.075 16.9562 11.3C17.0437 11.525 17.0875 11.7583 17.0875 12C17.0875 12.2417 17.0437 12.475 16.9562 12.7C16.8687 12.925 16.7292 13.1333 16.5375 13.325L8.91249 20.95C8.67915 21.1833 8.40415 21.2979 8.08749 21.2938C7.77082 21.2896 7.49582 21.1708 7.26249 20.9375C7.02915 20.7042 6.91249 20.4271 6.91249 20.1063C6.91249 19.7854 7.02915 19.5083 7.26249 19.275L14.5375 12Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronRightSmall.tsx b/apps/scandic-web/components/Icons/ChevronRightSmall.tsx
deleted file mode 100644
index 1b69fd25b..000000000
--- a/apps/scandic-web/components/Icons/ChevronRightSmall.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronRightSmallIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12.65 12L8.77495 8.12497C8.59995 7.94997 8.51245 7.73538 8.51245 7.48122C8.51245 7.22705 8.59995 7.0083 8.77495 6.82497C8.94995 6.64163 9.16662 6.54788 9.42495 6.54372C9.68328 6.53955 9.90412 6.62913 10.0875 6.81247L14.6125 11.3375C14.7041 11.4291 14.7729 11.5312 14.8187 11.6437C14.8645 11.7562 14.8875 11.875 14.8875 12C14.8875 12.125 14.8645 12.2437 14.8187 12.3562C14.7729 12.4687 14.7041 12.5708 14.6125 12.6625L10.0875 17.1875C9.90412 17.3708 9.68328 17.4604 9.42495 17.4562C9.16662 17.4521 8.94995 17.3583 8.77495 17.175C8.59995 16.9916 8.51245 16.7729 8.51245 16.5187C8.51245 16.2646 8.59995 16.05 8.77495 15.875L12.65 12Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronUp.tsx b/apps/scandic-web/components/Icons/ChevronUp.tsx
deleted file mode 100644
index 3542bee8e..000000000
--- a/apps/scandic-web/components/Icons/ChevronUp.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronUpIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12 9.55786L4.40885 16.5539C4.1658 16.7779 3.87717 16.8879 3.54297 16.8839C3.20877 16.8799 2.92014 16.7659 2.67708 16.5419C2.43403 16.3179 2.3125 16.0519 2.3125 15.7439C2.3125 15.4359 2.43403 15.1699 2.67708 14.9459L10.6198 7.63786C10.8194 7.45386 11.0365 7.31986 11.2708 7.23586C11.5052 7.15186 11.7483 7.10986 12 7.10986C12.2517 7.10986 12.4948 7.15186 12.7292 7.23586C12.9635 7.31986 13.1806 7.45386 13.3802 7.63786L21.3229 14.9579C21.566 15.1819 21.6853 15.4459 21.681 15.7499C21.6766 16.0539 21.553 16.3179 21.3099 16.5419C21.0668 16.7659 20.7782 16.8779 20.444 16.8779C20.1098 16.8779 19.8212 16.7659 19.5781 16.5419L12 9.55786Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ChevronUpSmall.tsx b/apps/scandic-web/components/Icons/ChevronUpSmall.tsx
deleted file mode 100644
index 3967e4875..000000000
--- a/apps/scandic-web/components/Icons/ChevronUpSmall.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ChevronUpSmallIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.685 10.8421L7.6626 14.8645C7.47351 15.0536 7.24454 15.1482 6.97569 15.1482C6.70683 15.1482 6.477 15.0528 6.2862 14.862C6.0954 14.6712 6 14.4413 6 14.1725C6 13.9036 6.09393 13.6753 6.2818 13.4874L10.9955 8.77369C11.0909 8.67829 11.1963 8.60674 11.3116 8.55904C11.427 8.51134 11.5506 8.48749 11.6824 8.48749C11.8142 8.48749 11.9387 8.51134 12.0558 8.55904C12.1728 8.60674 12.2791 8.67829 12.3745 8.77369L17.0882 13.4874C17.2761 13.6753 17.37 13.9036 17.37 14.1725C17.37 14.4413 17.2746 14.6712 17.0838 14.862C16.893 15.0528 16.6632 15.1482 16.3943 15.1482C16.1255 15.1482 15.8965 15.0536 15.7074 14.8645L11.685 10.8421Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/City.tsx b/apps/scandic-web/components/Icons/City.tsx
deleted file mode 100644
index 9f101a27d..000000000
--- a/apps/scandic-web/components/Icons/City.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CityIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M3.57495 18.4248V9.0486C3.57495 8.5329 3.75854 8.09079 4.12573 7.72227C4.49291 7.35374 4.93432 7.16947 5.44995 7.16947H9.19995V6.06392C9.19995 5.81301 9.24578 5.57713 9.33745 5.3563C9.42912 5.13547 9.55828 4.93755 9.72495 4.76255L10.6639 3.7943C11.0238 3.42313 11.4698 3.23755 12.0019 3.23755C12.5339 3.23755 12.9833 3.42505 13.35 3.80005L14.2911 4.76082C14.4637 4.93697 14.5958 5.13648 14.6875 5.35935C14.7791 5.58222 14.825 5.81662 14.825 6.06255V10.922H18.575C19.0906 10.922 19.532 11.1059 19.8992 11.4737C20.2664 11.8415 20.45 12.2836 20.45 12.8V18.425C20.45 18.9407 20.2663 19.3821 19.8991 19.7493C19.5319 20.1165 19.0904 20.3 18.5748 20.3H5.44848C4.93279 20.3 4.49162 20.1164 4.12495 19.7492C3.75828 19.382 3.57495 18.9405 3.57495 18.4248ZM5.44995 18.425H7.32495V16.55H5.44995V18.425ZM5.44995 14.675H7.32495V12.8H5.44995V14.675ZM5.44995 10.925H7.32495V9.05005H5.44995V10.925ZM11.075 18.425H12.95V16.55H11.075V18.425ZM11.075 14.675H12.95V12.8H11.075V14.675ZM11.075 10.925H12.95V9.05005H11.075V10.925ZM11.075 7.17505H12.95V5.30005H11.075V7.17505ZM16.7 18.425H18.575V16.55H16.7V18.425ZM16.7 14.675H18.575V12.8H16.7V14.675Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Close.tsx b/apps/scandic-web/components/Icons/Close.tsx
deleted file mode 100644
index 4cd21c489..000000000
--- a/apps/scandic-web/components/Icons/Close.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CloseIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M10 11.0936L7.58333 13.5207C7.43056 13.6734 7.24653 13.7498 7.03125 13.7498C6.81597 13.7498 6.63194 13.6734 6.47917 13.5207C6.32639 13.3679 6.25 13.1839 6.25 12.9686C6.25 12.7533 6.32639 12.5693 6.47917 12.4165L8.90625 9.99984L6.47917 7.59359C6.32639 7.44081 6.25 7.25678 6.25 7.0415C6.25 6.82623 6.32639 6.6422 6.47917 6.48942C6.63194 6.33664 6.81597 6.26025 7.03125 6.26025C7.24653 6.26025 7.43056 6.33664 7.58333 6.48942L10 8.9165L12.4062 6.48942C12.559 6.33664 12.7431 6.26025 12.9583 6.26025C13.1736 6.26025 13.3576 6.33664 13.5104 6.48942C13.6701 6.64914 13.75 6.83491 13.75 7.04671C13.75 7.25852 13.6701 7.44081 13.5104 7.59359L11.0833 9.99984L13.5104 12.4165C13.6632 12.5693 13.7396 12.7533 13.7396 12.9686C13.7396 13.1839 13.6632 13.3679 13.5104 13.5207C13.3507 13.6804 13.1649 13.7603 12.9531 13.7603C12.7413 13.7603 12.559 13.6804 12.4062 13.5207L10 11.0936Z"
-        fill="#CD0921"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CloseLarge.tsx b/apps/scandic-web/components/Icons/CloseLarge.tsx
deleted file mode 100644
index 2ea89eb5b..000000000
--- a/apps/scandic-web/components/Icons/CloseLarge.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CloseLargeIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M12 13.5422L6.34057 19.2016C6.12719 19.415 5.87017 19.5193 5.5695 19.5144C5.26882 19.5096 5.0118 19.4004 4.79842 19.1871C4.59474 18.9737 4.49532 18.7191 4.50017 18.4233C4.50502 18.1274 4.60928 17.8777 4.81297 17.674L10.4578 12L4.81297 6.32606C4.60928 6.12237 4.50744 5.87262 4.50744 5.5768C4.50744 5.28098 4.60928 5.02638 4.81297 4.813C5.01665 4.59961 5.26882 4.4905 5.5695 4.48565C5.87017 4.4808 6.12719 4.58507 6.34057 4.79845L12 10.4579L17.6594 4.79845C17.8728 4.58507 18.1298 4.4808 18.4305 4.48565C18.7312 4.4905 18.9882 4.59961 19.2016 4.813C19.4053 5.02638 19.5047 5.28098 19.4998 5.5768C19.495 5.87262 19.3907 6.12237 19.187 6.32606L13.5422 12L19.187 17.674C19.3907 17.8777 19.4926 18.1274 19.4926 18.4233C19.4926 18.7191 19.3907 18.9737 19.187 19.1871C18.9834 19.4004 18.7312 19.5096 18.4305 19.5144C18.1298 19.5193 17.8728 19.415 17.6594 19.2016L12 13.5422Z"
-        fill="#57514E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Coffee.tsx b/apps/scandic-web/components/Icons/Coffee.tsx
deleted file mode 100644
index b3ee54f38..000000000
--- a/apps/scandic-web/components/Icons/Coffee.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CoffeeIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M4.32422 17.2918C4.10894 17.2918 3.92491 17.2154 3.77214 17.0627C3.61936 16.9099 3.54297 16.7259 3.54297 16.5106C3.54297 16.2953 3.61936 16.1113 3.77214 15.9585C3.92491 15.8057 4.10894 15.7293 4.32422 15.7293H15.6784C15.8937 15.7293 16.0777 15.8057 16.2305 15.9585C16.3832 16.1113 16.4596 16.2953 16.4596 16.5106C16.4596 16.7259 16.3832 16.9099 16.2305 17.0627C16.0777 17.2154 15.8937 17.2918 15.6784 17.2918H4.32422ZM6.7513 14.1668C5.86241 14.1668 5.10547 13.8543 4.48047 13.2293C3.85547 12.6043 3.54297 11.8474 3.54297 10.9585V4.271C3.54297 3.8413 3.69596 3.47346 4.00195 3.16748C4.30793 2.86149 4.67577 2.7085 5.10547 2.7085H16.5638C16.9935 2.7085 17.3613 2.86149 17.6673 3.16748C17.9733 3.47346 18.1263 3.8413 18.1263 4.271V6.97933C18.1263 7.40902 17.9733 7.77686 17.6673 8.08285C17.3613 8.38884 16.9935 8.54183 16.5638 8.54183H14.793V10.9612C14.793 11.8483 14.478 12.6043 13.8481 13.2293C13.2181 13.8543 12.4609 14.1668 11.5763 14.1668H6.7513ZM6.7513 12.6043H11.5742C12.0256 12.6043 12.4145 12.4432 12.7409 12.1209C13.0673 11.7986 13.2305 11.4111 13.2305 10.9585V4.271H5.10547V10.9585C5.10547 11.4111 5.26662 11.7986 5.58893 12.1209C5.91125 12.4432 6.2987 12.6043 6.7513 12.6043ZM14.793 6.97933H16.5638V4.271H14.793V6.97933ZM6.7513 12.6043H5.10547H13.2305H6.7513Z"
-        fill="#57514E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CoffeeAlt.tsx b/apps/scandic-web/components/Icons/CoffeeAlt.tsx
deleted file mode 100644
index 1f3051176..000000000
--- a/apps/scandic-web/components/Icons/CoffeeAlt.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CoffeeAltIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M11.0625 17.8125C9.17083 17.8125 7.5625 17.1542 6.2375 15.8375C4.9125 14.5208 4.25 12.9167 4.25 11.025V5.125C4.25 4.60833 4.43333 4.16667 4.8 3.8C5.16667 3.43333 5.60833 3.25 6.125 3.25H18.3875C19.3208 3.25 20.1167 3.57708 20.775 4.23125C21.4333 4.88542 21.7625 5.67917 21.7625 6.6125C21.7625 7.59583 21.4396 8.44792 20.7938 9.16875C20.1479 9.88958 19.3458 10.25 18.3875 10.25H17.75V11.025C17.75 12.9083 17.1021 14.5104 15.8063 15.8313C14.5104 17.1521 12.9292 17.8125 11.0625 17.8125ZM6.125 8.375H15.875V5.125H6.125V8.375ZM11.0625 15.9375C12.4042 15.9375 13.5417 15.4563 14.475 14.4938C15.4083 13.5313 15.875 12.375 15.875 11.025V10.25H6.125V11.025C6.125 12.3917 6.60625 13.5521 7.56875 14.5063C8.53125 15.4604 9.69583 15.9375 11.0625 15.9375ZM17.75 8.375H18.3875C18.8375 8.375 19.2 8.19792 19.475 7.84375C19.75 7.48958 19.8875 7.07917 19.8875 6.6125C19.8875 6.19583 19.7417 5.84375 19.45 5.55625C19.1583 5.26875 18.8042 5.125 18.3875 5.125H17.75V8.375ZM5.1875 20.75C4.92917 20.75 4.70833 20.6583 4.525 20.475C4.34167 20.2917 4.25 20.0708 4.25 19.8125C4.25 19.5542 4.34167 19.3333 4.525 19.15C4.70833 18.9667 4.92917 18.875 5.1875 18.875H18.8125C19.0708 18.875 19.2917 18.9667 19.475 19.15C19.6583 19.3333 19.75 19.5542 19.75 19.8125C19.75 20.0708 19.6583 20.2917 19.475 20.475C19.2917 20.6583 19.0708 20.75 18.8125 20.75H5.1875Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CoffeeMaker.tsx b/apps/scandic-web/components/Icons/CoffeeMaker.tsx
deleted file mode 100644
index 8d9dbf460..000000000
--- a/apps/scandic-web/components/Icons/CoffeeMaker.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CoffeeMakerIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M6.125 21.75c-.516 0-.957-.184-1.324-.55a1.806 1.806 0 0 1-.551-1.325V4.125c0-.516.184-.957.55-1.324.368-.367.81-.551 1.325-.551h12.688c.258 0 .479.092.662.275a.903.903 0 0 1 .275.663c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275h-1.05v1.876a.937.937 0 0 1-.287.686.938.938 0 0 1-.688.288h-7.7a.938.938 0 0 1-.687-.287A.937.937 0 0 1 8.113 6V4.125H6.125v15.75h3.988a4.853 4.853 0 0 1-1.463-1.656c-.358-.663-.537-1.402-.537-2.219v-2.975c0-.516.183-.957.55-1.324.367-.367.809-.551 1.325-.551h5.9c.515 0 .957.184 1.324.55.367.368.55.81.55 1.325V16c0 .817-.179 1.556-.537 2.219a4.852 4.852 0 0 1-1.463 1.656h3.05c.259 0 .48.092.663.275a.903.903 0 0 1 .275.663c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275H6.126Zm6.81-2.8a2.85 2.85 0 0 0 2.09-.86c.575-.574.862-1.27.862-2.09v-2.975h-5.9V16c0 .82.287 1.516.86 2.09a2.84 2.84 0 0 0 2.088.86Zm.001-8.9a.947.947 0 0 0 .695-.28.94.94 0 0 0 .281-.694.947.947 0 0 0-.28-.695.94.94 0 0 0-.693-.281.946.946 0 0 0-.695.28.94.94 0 0 0-.281.694c0 .276.093.507.28.695a.94.94 0 0 0 .693.281Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CompareArrows.tsx b/apps/scandic-web/components/Icons/CompareArrows.tsx
deleted file mode 100644
index 989d5413f..000000000
--- a/apps/scandic-web/components/Icons/CompareArrows.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CompareArrowsIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="25"
-      viewBox="0 0 24 25"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.1498 9.61251C11.1498 9.35418 11.2415 9.13335 11.4248 8.95001C11.6081 8.76668 11.829 8.67501 12.0873 8.67501L18.1748 8.67501L16.2373 6.73751C16.054 6.55418 15.9623 6.33543 15.9623 6.08126C15.9623 5.8271 16.054 5.60418 16.2373 5.41251C16.429 5.22918 16.6519 5.13751 16.9061 5.13751C17.1602 5.13751 17.3831 5.23335 17.5748 5.42501L21.0873 8.95001C21.179 9.04168 21.2477 9.14376 21.2936 9.25626C21.3394 9.36876 21.3623 9.48751 21.3623 9.61251C21.3623 9.73751 21.3394 9.85626 21.2936 9.96876C21.2477 10.0813 21.179 10.1833 21.0873 10.275L17.5623 13.8C17.3706 13.9917 17.1519 14.0854 16.9061 14.0813C16.6602 14.0771 16.4415 13.9833 16.2498 13.8C16.0665 13.6083 15.9727 13.3875 15.9686 13.1375C15.9644 12.8875 16.0581 12.6667 16.2498 12.475L18.1748 10.55L12.0873 10.55C11.829 10.55 11.6081 10.4583 11.4248 10.275C11.2415 10.0917 11.1498 9.87084 11.1498 9.61251ZM2.6373 15.4C2.6373 15.275 2.66022 15.1563 2.70605 15.0438C2.75189 14.9313 2.82064 14.8292 2.9123 14.7375L6.4498 11.2C6.64147 11.0083 6.86022 10.9146 7.10605 10.9188C7.35189 10.9229 7.57064 11.0167 7.7623 11.2C7.94564 11.3917 8.03939 11.6125 8.04355 11.8625C8.04772 12.1125 7.95397 12.3333 7.7623 12.525L5.8248 14.4625L11.9123 14.4625C12.1706 14.4625 12.3915 14.5542 12.5748 14.7375C12.7581 14.9208 12.8498 15.1417 12.8498 15.4C12.8498 15.6583 12.7581 15.8792 12.5748 16.0625C12.3915 16.2458 12.1706 16.3375 11.9123 16.3375L5.8248 16.3375L7.7498 18.2625C7.93314 18.4458 8.0248 18.6646 8.0248 18.9188C8.0248 19.1729 7.93314 19.3958 7.7498 19.5875C7.55814 19.7708 7.33522 19.8625 7.08105 19.8625C6.82689 19.8625 6.60397 19.7667 6.4123 19.575L2.9123 16.0625C2.82064 15.9708 2.75189 15.8688 2.70605 15.7563C2.66022 15.6438 2.6373 15.525 2.6373 15.4Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Concierge.tsx b/apps/scandic-web/components/Icons/Concierge.tsx
deleted file mode 100644
index 24362e8c3..000000000
--- a/apps/scandic-web/components/Icons/Concierge.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ConciergeIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11 21.7501C10.7417 21.7501 10.5208 21.6584 10.3375 21.4751C10.1542 21.2918 10.0625 21.0709 10.0625 20.8126C10.0625 20.5543 10.1542 20.3334 10.3375 20.1501C10.5208 19.9668 10.7417 19.8751 11 19.8751H22C22.2583 19.8751 22.4792 19.9668 22.6625 20.1501C22.8458 20.3334 22.9375 20.5543 22.9375 20.8126C22.9375 21.0709 22.8458 21.2918 22.6625 21.4751C22.4792 21.6584 22.2583 21.7501 22 21.7501H11ZM11.0625 19.0001C11.0625 17.6501 11.4875 16.4772 12.3375 15.4813C13.1875 14.4855 14.2625 13.8751 15.5625 13.6501V12.9876C15.5625 12.7293 15.6542 12.5084 15.8375 12.3251C16.0208 12.1418 16.2417 12.0501 16.5 12.0501C16.7583 12.0501 16.9792 12.1418 17.1625 12.3251C17.3458 12.5084 17.4375 12.7293 17.4375 12.9876V13.6501C18.7208 13.8751 19.7917 14.4855 20.65 15.4813C21.5083 16.4772 21.9375 17.6501 21.9375 19.0001H11.0625ZM13.475 17.1126H19.4875C19.1792 16.6126 18.7625 16.2063 18.2375 15.8938C17.7125 15.5813 17.1337 15.4251 16.501 15.4251C15.8504 15.4251 15.2604 15.5813 14.7312 15.8938C14.2021 16.2063 13.7833 16.6126 13.475 17.1126ZM1.25 10.8751V4.0751C1.25 3.55946 1.43359 3.11806 1.80077 2.75087C2.16796 2.38369 2.60937 2.2001 3.125 2.2001H5.0875C5.49583 2.2001 5.87917 2.33551 6.2375 2.60635C6.59583 2.87718 6.84167 3.20843 6.975 3.6001L13.3875 1.8001C13.5589 1.7501 13.7381 1.7251 13.925 1.7251C14.1119 1.7251 14.2911 1.75426 14.4625 1.8126L21.075 3.8876C21.2762 3.9516 21.4348 4.0676 21.5509 4.2356C21.667 4.4036 21.725 4.5876 21.725 4.7876V5.0876C21.725 5.87926 21.4479 6.54593 20.8938 7.0876C20.3396 7.62926 19.6667 7.9001 18.875 7.9001H16.8V8.2001C16.8 8.68343 16.6646 9.12718 16.3938 9.53135C16.1229 9.93551 15.7583 10.2209 15.3 10.3876L9.25285 12.6406C9.14262 12.6719 9.03542 12.698 8.93125 12.7188C8.82708 12.7397 8.71667 12.7501 8.6 12.7501H3.125C2.60937 12.7501 2.16796 12.5665 1.80077 12.1993C1.43359 11.8321 1.25 11.3907 1.25 10.8751ZM3.125 10.8751H5.1V4.0751H3.125V10.8751ZM6.975 10.8751H8.6L14.3523 8.78592C14.5341 8.72037 14.675 8.60426 14.775 8.4376C14.875 8.27093 14.925 8.09176 14.925 7.9001H13.15L11.1875 8.5501C10.9356 8.63343 10.6956 8.61468 10.4674 8.49385C10.2391 8.37301 10.0833 8.18343 10 7.9251C9.925 7.6751 9.94194 7.43873 10.0508 7.216C10.1597 6.99328 10.3386 6.84215 10.5875 6.7626L12.75 6.0251H18.875C19.0333 6.0251 19.2188 5.96847 19.4312 5.85522C19.6437 5.74196 19.75 5.60691 19.75 5.4501L13.875 3.6251L6.975 5.5251V10.8751Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Contract.tsx b/apps/scandic-web/components/Icons/Contract.tsx
deleted file mode 100644
index 0c8d41e52..000000000
--- a/apps/scandic-web/components/Icons/Contract.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ContractIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M5.47786 18.125C4.81814 18.125 4.25391 17.8941 3.78516 17.4323C3.31641 16.9705 3.08203 16.4097 3.08203 15.75V14.7917C3.08203 14.362 3.23502 13.9941 3.54101 13.6881C3.847 13.3822 4.21484 13.2292 4.64453 13.2292H5.3737V3.4375C5.3737 3.00781 5.52669 2.63997 5.83268 2.33398C6.13866 2.02799 6.5065 1.875 6.9362 1.875H16.1029C16.5326 1.875 16.9004 2.02799 17.2064 2.33398C17.5124 2.63997 17.6654 3.00781 17.6654 3.4375V15.75C17.6654 16.4097 17.431 16.9705 16.9622 17.4323C16.4935 17.8941 15.9293 18.125 15.2695 18.125H5.47786ZM15.2695 16.5625C15.5056 16.5625 15.7036 16.4846 15.8633 16.3289C16.023 16.1732 16.1029 15.9802 16.1029 15.75V3.4375H6.9362V13.2292H12.8945C13.3242 13.2292 13.6921 13.3822 13.9981 13.6881C14.304 13.9941 14.457 14.362 14.457 14.7917V15.75C14.457 15.9802 14.5349 16.1732 14.6906 16.3289C14.8464 16.4846 15.0393 16.5625 15.2695 16.5625ZM8.65495 7.29167C8.43967 7.29167 8.25564 7.21528 8.10286 7.0625C7.95009 6.90972 7.8737 6.72569 7.8737 6.51042C7.8737 6.29514 7.95009 6.11111 8.10286 5.95833C8.25564 5.80556 8.43967 5.72917 8.65495 5.72917H14.3841C14.5994 5.72917 14.7834 5.80556 14.9362 5.95833C15.089 6.11111 15.1654 6.29514 15.1654 6.51042C15.1654 6.72569 15.089 6.90972 14.9362 7.0625C14.7834 7.21528 14.5994 7.29167 14.3841 7.29167H8.65495ZM8.65495 9.79167C8.43967 9.79167 8.25564 9.71528 8.10286 9.5625C7.95009 9.40972 7.8737 9.22569 7.8737 9.01042C7.8737 8.79514 7.95009 8.61111 8.10286 8.45833C8.25564 8.30556 8.43967 8.22917 8.65495 8.22917H14.3841C14.5994 8.22917 14.7834 8.30556 14.9362 8.45833C15.089 8.61111 15.1654 8.79514 15.1654 9.01042C15.1654 9.22569 15.089 9.40972 14.9362 9.5625C14.7834 9.71528 14.5994 9.79167 14.3841 9.79167H8.65495ZM5.47786 16.5625H12.8945V14.7917H4.64453V15.75C4.64453 15.9802 4.72439 16.1732 4.88411 16.3289C5.04384 16.4846 5.24175 16.5625 5.47786 16.5625Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ConvenienceStore24h.tsx b/apps/scandic-web/components/Icons/ConvenienceStore24h.tsx
deleted file mode 100644
index 1c7696aa9..000000000
--- a/apps/scandic-web/components/Icons/ConvenienceStore24h.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ConvenienceStore24hIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M20.825 11.075V18.925C20.825 19.4407 20.6414 19.8821 20.2742 20.2493C19.9071 20.6165 19.4657 20.8 18.95 20.8H5.07502C4.55938 20.8 4.11797 20.6165 3.75079 20.2493C3.38361 19.8821 3.20002 19.4407 3.20002 18.925V11.075C2.79168 10.7584 2.4896 10.3188 2.29377 9.7563C2.09793 9.1938 2.10002 8.59172 2.30002 7.95005L3.32502 4.62505C3.4566 4.20617 3.69097 3.85977 4.02814 3.58587C4.36531 3.31199 4.75593 3.17505 5.20002 3.17505H18.8258C19.267 3.17505 19.6542 3.3063 19.9875 3.5688C20.3209 3.8313 20.5603 4.18272 20.7059 4.62305L21.725 7.95005C21.925 8.59172 21.9271 9.18755 21.7313 9.73755C21.5354 10.2875 21.2334 10.7334 20.825 11.075ZM14.175 10.075C14.6417 10.075 14.9896 9.92088 15.2188 9.61255C15.4479 9.30422 15.5375 8.95838 15.4875 8.57505L14.95 5.05005H12.95V8.72505C12.95 9.08852 13.0691 9.40438 13.3073 9.67265C13.5455 9.94092 13.8347 10.075 14.175 10.075ZM9.74902 10.075C10.14 10.075 10.4588 9.94092 10.7053 9.67265C10.9518 9.40438 11.075 9.08852 11.075 8.72505V5.05005H9.07502L8.53752 8.57505C8.47918 8.96672 8.56877 9.31463 8.80627 9.6188C9.04377 9.92297 9.35802 10.075 9.74902 10.075ZM5.37502 10.075C5.69168 10.075 5.96252 9.96436 6.18752 9.74297C6.41252 9.52161 6.55002 9.24063 6.60002 8.90005L7.16252 5.05005H5.13752L4.12502 8.37505C4.00835 8.76672 4.0646 9.14797 4.29377 9.5188C4.52293 9.88963 4.88335 10.075 5.37502 10.075ZM18.65 10.075C19.1334 10.075 19.4958 9.8938 19.7375 9.5313C19.9792 9.1688 20.0333 8.78338 19.9 8.37505L18.8625 5.05005H16.8625L17.4235 8.90005C17.4745 9.23338 17.6125 9.51255 17.8375 9.73755C18.0625 9.96255 18.3333 10.075 18.65 10.075ZM5.07502 18.925H18.95V11.9125C18.875 11.9375 18.8167 11.95 18.775 11.95H18.65C18.2066 11.95 17.8166 11.875 17.48 11.725C17.1433 11.575 16.8149 11.3334 16.4947 11C16.2066 11.3 15.8728 11.5334 15.4933 11.7C15.1139 11.8667 14.7097 11.95 14.2807 11.95C13.8352 11.95 13.4229 11.8667 13.0438 11.7C12.6646 11.5334 12.325 11.3 12.025 11C11.7417 11.3 11.4125 11.5334 11.0375 11.7C10.6625 11.8667 10.2662 11.95 9.84864 11.95C9.38289 11.95 8.95418 11.8709 8.56252 11.7125C8.17085 11.5542 7.82502 11.3167 7.52502 11C7.15835 11.3667 6.81043 11.6167 6.48127 11.75C6.1521 11.8834 5.78335 11.95 5.37502 11.95H5.23037C5.1768 11.95 5.12502 11.9375 5.07502 11.9125V18.925ZM8.56344 17.875H10.5171C10.6474 17.875 10.7604 17.8263 10.8563 17.7288C10.9521 17.6313 11 17.5175 11 17.3875C11 17.2575 10.9513 17.1438 10.8538 17.0463C10.7563 16.9488 10.6425 16.9 10.5125 16.9H9.05002V15.925H10.5125C10.6425 15.925 10.7563 15.8763 10.8538 15.7788C10.9513 15.6813 11 15.5675 11 15.4375V13.4603C11 13.3285 10.9512 13.2146 10.8535 13.1188C10.7558 13.023 10.6418 12.975 10.5116 12.975H8.55789C8.42764 12.975 8.3146 13.0238 8.21877 13.1213C8.12293 13.2188 8.07502 13.3325 8.07502 13.4625C8.07502 13.5925 8.12377 13.7063 8.22127 13.8038C8.31877 13.9013 8.43252 13.95 8.56252 13.95H10.025V14.95H8.55812C8.42772 14.95 8.3146 14.9989 8.21877 15.0966C8.12293 15.1943 8.07502 15.3082 8.07502 15.4385V17.3922C8.07502 17.5224 8.12386 17.6355 8.22154 17.7313C8.31922 17.8271 8.43319 17.875 8.56344 17.875ZM14.9707 15.9294V17.3886C14.9707 17.5183 15.0193 17.6318 15.1166 17.7291C15.2139 17.8264 15.3292 17.875 15.4625 17.875C15.5958 17.875 15.7104 17.8263 15.8063 17.7288C15.9021 17.6313 15.95 17.5175 15.95 17.3875V13.459C15.95 13.328 15.9013 13.2146 15.8038 13.1188C15.7063 13.023 15.5925 12.975 15.4625 12.975C15.3325 12.975 15.2188 13.0238 15.1213 13.1213C15.0238 13.2188 14.975 13.3325 14.975 13.4625V14.95H14V13.4611C14 13.3287 13.9513 13.2146 13.8538 13.1188C13.7563 13.023 13.6425 12.975 13.5125 12.975C13.3825 12.975 13.2688 13.0238 13.1713 13.1213C13.0738 13.2188 13.025 13.3325 13.025 13.4625V15.4398C13.025 15.5716 13.0737 15.6862 13.1709 15.7835C13.2682 15.8808 13.3817 15.9294 13.5114 15.9294H14.9707Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Cool.tsx b/apps/scandic-web/components/Icons/Cool.tsx
deleted file mode 100644
index 2deb081ad..000000000
--- a/apps/scandic-web/components/Icons/Cool.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CoolIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.075 17.625L8.46245 20.2125C8.28745 20.3875 8.07078 20.475 7.81245 20.475C7.55412 20.475 7.33745 20.3792 7.16245 20.1875C6.97912 20.0042 6.88745 19.7875 6.88745 19.5375C6.88745 19.2875 6.98328 19.0667 7.17495 18.875L11.075 14.975V12.925H9.02495L5.09995 16.85C4.92495 17.025 4.71245 17.1125 4.46245 17.1125C4.21245 17.1125 3.99162 17.0209 3.79995 16.8375C3.61662 16.6625 3.52495 16.4459 3.52495 16.1875C3.52495 15.9292 3.61662 15.7084 3.79995 15.525L6.37495 12.925H3.11245C2.85412 12.925 2.63745 12.8355 2.46245 12.6563C2.28745 12.4771 2.19995 12.2542 2.19995 11.9875C2.19995 11.7292 2.28953 11.5084 2.4687 11.325C2.64787 11.1417 2.87078 11.05 3.13745 11.05H6.37495L3.78745 8.46255C3.61245 8.28755 3.52495 8.07088 3.52495 7.81255C3.52495 7.55422 3.62078 7.33338 3.81245 7.15005C3.99578 6.97505 4.21245 6.88755 4.46245 6.88755C4.71245 6.88755 4.93328 6.97922 5.12495 7.16255L9.02495 11.05H11.075V9.00005L7.14995 5.10005C6.97495 4.92505 6.88745 4.71255 6.88745 4.46255C6.88745 4.21255 6.97912 3.99172 7.16245 3.80005C7.33745 3.61672 7.55412 3.52505 7.81245 3.52505C8.07078 3.52505 8.29162 3.61672 8.47495 3.80005L11.075 6.35005V3.11255C11.075 2.85422 11.1645 2.63338 11.3437 2.45005C11.5229 2.26672 11.7458 2.17505 12.0125 2.17505C12.2708 2.17505 12.4916 2.26672 12.675 2.45005C12.8583 2.63338 12.95 2.85422 12.95 3.11255V6.35005L15.5375 3.78755C15.7125 3.61255 15.9291 3.52505 16.1875 3.52505C16.4458 3.52505 16.6666 3.61672 16.85 3.80005C17.025 3.99172 17.1125 4.21255 17.1125 4.46255C17.1125 4.71255 17.0208 4.92922 16.8375 5.11255L12.95 9.00005V11.05H15L18.9 7.15005C19.075 6.97505 19.2875 6.88755 19.5375 6.88755C19.7875 6.88755 20.0083 6.97922 20.2 7.16255C20.3833 7.33755 20.475 7.55422 20.475 7.81255C20.475 8.07088 20.3833 8.29172 20.2 8.47505L17.65 11.05H20.8875C21.1458 11.05 21.3666 11.1417 21.55 11.325C21.7333 11.5084 21.825 11.7292 21.825 11.9875C21.825 12.2542 21.7333 12.4771 21.55 12.6563C21.3666 12.8355 21.1458 12.925 20.8875 12.925H17.65L20.2125 15.5375C20.3875 15.7125 20.475 15.9292 20.475 16.1875C20.475 16.4459 20.3833 16.6625 20.2 16.8375C20.0083 17.0209 19.7875 17.1125 19.5375 17.1125C19.2875 17.1125 19.0708 17.0167 18.8875 16.825L15 12.925H12.95V14.975L16.85 18.9C17.025 19.075 17.1125 19.2875 17.1125 19.5375C17.1125 19.7875 17.0208 20.0084 16.8375 20.2C16.6625 20.3834 16.4458 20.475 16.1875 20.475C15.9291 20.475 15.7083 20.3834 15.525 20.2L12.95 17.625V20.8875C12.95 21.1459 12.8583 21.3626 12.675 21.5375C12.4916 21.7125 12.2708 21.8 12.0125 21.8C11.7458 21.8 11.5229 21.7105 11.3437 21.5313C11.1645 21.3521 11.075 21.1292 11.075 20.8625V17.625Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Copy.tsx b/apps/scandic-web/components/Icons/Copy.tsx
deleted file mode 100644
index 738456695..000000000
--- a/apps/scandic-web/components/Icons/Copy.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CopyIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M7.54804 15.4742C7.17293 15.4742 6.85587 15.3447 6.59685 15.0857C6.33783 14.8267 6.20831 14.5096 6.20831 14.1345V4.64737C6.20831 4.27226 6.33783 3.95519 6.59685 3.69616C6.85587 3.43713 7.17293 3.30762 7.54804 3.30762H15.0352C15.4103 3.30762 15.7273 3.43713 15.9864 3.69616C16.2454 3.95519 16.3749 4.27226 16.3749 4.64737V14.1345C16.3749 14.5096 16.2454 14.8267 15.9864 15.0857C15.7273 15.3447 15.4103 15.4742 15.0352 15.4742H7.54804ZM7.54804 14.3909H15.0352C15.0993 14.3909 15.158 14.3642 15.2115 14.3108C15.2649 14.2574 15.2916 14.1986 15.2916 14.1345V4.64737C15.2916 4.58326 15.2649 4.52449 15.2115 4.47106C15.158 4.41764 15.0993 4.39093 15.0352 4.39093H7.54804C7.48393 4.39093 7.42517 4.41764 7.37175 4.47106C7.31832 4.52449 7.2916 4.58326 7.2916 4.64737V14.1345C7.2916 14.1986 7.31832 14.2574 7.37175 14.3108C7.42517 14.3642 7.48393 14.3909 7.54804 14.3909ZM4.96473 18.0575C4.58963 18.0575 4.27257 17.928 4.01354 17.669C3.75451 17.41 3.625 17.0929 3.625 16.7178V6.68901C3.625 6.53528 3.67642 6.40657 3.77927 6.30289C3.8821 6.19921 4.00977 6.14737 4.16227 6.14737C4.31476 6.14737 4.44389 6.19921 4.54967 6.30289C4.65543 6.40657 4.70831 6.53528 4.70831 6.68901V16.7178C4.70831 16.7819 4.73502 16.8407 4.78844 16.8941C4.84187 16.9475 4.90063 16.9742 4.96473 16.9742H12.9935C13.1473 16.9742 13.276 17.0257 13.3796 17.1285C13.4833 17.2313 13.5352 17.359 13.5352 17.5115C13.5352 17.664 13.4833 17.7931 13.3796 17.8989C13.276 18.0047 13.1473 18.0575 12.9935 18.0575H4.96473Z"
-        fill="#060606"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CreditCard.tsx b/apps/scandic-web/components/Icons/CreditCard.tsx
deleted file mode 100644
index d81ce95f2..000000000
--- a/apps/scandic-web/components/Icons/CreditCard.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import * as variants from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CreditCardIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = variants.iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M21.75 6.1001V17.9001C21.75 18.4157 21.5664 18.8571 21.1992 19.2243C20.832 19.5915 20.3906 19.7751 19.875 19.7751H4.125C3.60937 19.7751 3.16796 19.5915 2.80077 19.2243C2.43359 18.8571 2.25 18.4157 2.25 17.9001V6.1001C2.25 5.58446 2.43359 5.14306 2.80077 4.77587C3.16796 4.40869 3.60937 4.2251 4.125 4.2251H19.875C20.3906 4.2251 20.832 4.40869 21.1992 4.77587C21.5664 5.14306 21.75 5.58446 21.75 6.1001ZM4.125 8.1251H19.875V6.1001H4.125V8.1251ZM4.125 11.9251V17.9001H19.875V11.9251H4.125Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CreditCardAdd.tsx b/apps/scandic-web/components/Icons/CreditCardAdd.tsx
deleted file mode 100644
index c6c866562..000000000
--- a/apps/scandic-web/components/Icons/CreditCardAdd.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import * as variants from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CreditCardAddIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = variants.iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M3.4375 16.4792C3.00781 16.4792 2.63997 16.3262 2.33398 16.0202C2.02799 15.7142 1.875 15.3464 1.875 14.9167V5.0625C1.875 4.63281 2.02799 4.26497 2.33398 3.95898C2.63997 3.65299 3.00781 3.5 3.4375 3.5H16.5625C16.9922 3.5 17.36 3.65299 17.666 3.95898C17.972 4.26497 18.125 4.63281 18.125 5.0625V9.91667H3.4375V14.9167H10.8021C11.0174 14.9167 11.2014 14.9931 11.3542 15.1458C11.5069 15.2986 11.5833 15.4826 11.5833 15.6979C11.5833 15.9132 11.5069 16.0972 11.3542 16.25C11.2014 16.4028 11.0174 16.4792 10.8021 16.4792H3.4375ZM3.4375 6.77083H16.5625V5.0625H3.4375V6.77083ZM15.8854 15.7812H14.1667C13.9514 15.7812 13.7674 15.7049 13.6146 15.5521C13.4618 15.3993 13.3854 15.2153 13.3854 15C13.3854 14.7847 13.4618 14.6007 13.6146 14.4479C13.7674 14.2951 13.9514 14.2188 14.1667 14.2188H15.8854V12.5C15.8854 12.2847 15.9618 12.1007 16.1146 11.9479C16.2674 11.7951 16.4514 11.7188 16.6667 11.7188C16.8819 11.7188 17.066 11.7951 17.2188 11.9479C17.3715 12.1007 17.4479 12.2847 17.4479 12.5V14.2188H19.1667C19.3819 14.2188 19.566 14.2951 19.7188 14.4479C19.8715 14.6007 19.9479 14.7847 19.9479 15C19.9479 15.2153 19.8715 15.3993 19.7188 15.5521C19.566 15.7049 19.3819 15.7812 19.1667 15.7812H17.4479V17.5C17.4479 17.7153 17.3715 17.8993 17.2188 18.0521C17.066 18.2049 16.8819 18.2812 16.6667 18.2812C16.4514 18.2812 16.2674 18.2049 16.1146 18.0521C15.9618 17.8993 15.8854 17.7153 15.8854 17.5V15.7812Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CrossCircle.tsx b/apps/scandic-web/components/Icons/CrossCircle.tsx
deleted file mode 100644
index f2c188a75..000000000
--- a/apps/scandic-web/components/Icons/CrossCircle.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CrossCircleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M12 13.3L14.9 16.2C15.075 16.375 15.2917 16.4625 15.55 16.4625C15.8083 16.4625 16.025 16.375 16.2 16.2C16.375 16.025 16.4625 15.8083 16.4625 15.55C16.4625 15.2917 16.375 15.075 16.2 14.9L13.3 12L16.2 9.1C16.375 8.925 16.4625 8.70833 16.4625 8.45C16.4625 8.19167 16.375 7.975 16.2 7.8C16.025 7.625 15.8083 7.5375 15.55 7.5375C15.2917 7.5375 15.075 7.625 14.9 7.8L12 10.7L9.1 7.8C8.925 7.625 8.70833 7.5375 8.45 7.5375C8.19167 7.5375 7.975 7.625 7.8 7.8C7.625 7.975 7.5375 8.19167 7.5375 8.45C7.5375 8.70833 7.625 8.925 7.8 9.1L10.7 12L7.8 14.9C7.625 15.075 7.5375 15.2917 7.5375 15.55C7.5375 15.8083 7.625 16.025 7.8 16.2C7.975 16.375 8.19167 16.4625 8.45 16.4625C8.70833 16.4625 8.925 16.375 9.1 16.2L12 13.3ZM12 21.75C10.6516 21.75 9.38434 21.4936 8.19838 20.9809C7.01239 20.4682 5.98075 19.7724 5.10345 18.8934C4.22615 18.0145 3.53125 16.9826 3.01875 15.7978C2.50625 14.613 2.25 13.3471 2.25 12C2.25 10.6516 2.50636 9.38434 3.01908 8.19838C3.53179 7.01239 4.22762 5.98075 5.10658 5.10345C5.98553 4.22615 7.01739 3.53125 8.20218 3.01875C9.38698 2.50625 10.6529 2.25 12 2.25C13.3484 2.25 14.6157 2.50636 15.8016 3.01908C16.9876 3.53179 18.0193 4.22762 18.8966 5.10658C19.7739 5.98553 20.4688 7.01739 20.9813 8.20217C21.4938 9.38697 21.75 10.6529 21.75 12C21.75 13.3484 21.4936 14.6157 20.9809 15.8016C20.4682 16.9876 19.7724 18.0193 18.8934 18.8966C18.0145 19.7739 16.9826 20.4688 15.7978 20.9813C14.613 21.4938 13.3471 21.75 12 21.75Z"
-        fill="white"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/CrossCircleOutline.tsx b/apps/scandic-web/components/Icons/CrossCircleOutline.tsx
deleted file mode 100644
index 6bb29f83b..000000000
--- a/apps/scandic-web/components/Icons/CrossCircleOutline.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CrossCircleOutlineIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M12 13.3L14.9 16.2C15.075 16.375 15.2917 16.4625 15.55 16.4625C15.8083 16.4625 16.025 16.375 16.2 16.2C16.375 16.025 16.4625 15.8083 16.4625 15.55C16.4625 15.2917 16.375 15.075 16.2 14.9L13.3 12L16.2 9.1C16.375 8.925 16.4625 8.70833 16.4625 8.45C16.4625 8.19167 16.375 7.975 16.2 7.8C16.025 7.625 15.8083 7.5375 15.55 7.5375C15.2917 7.5375 15.075 7.625 14.9 7.8L12 10.7L9.1 7.8C8.925 7.625 8.70833 7.5375 8.45 7.5375C8.19167 7.5375 7.975 7.625 7.8 7.8C7.625 7.975 7.5375 8.19167 7.5375 8.45C7.5375 8.70833 7.625 8.925 7.8 9.1L10.7 12L7.8 14.9C7.625 15.075 7.5375 15.2917 7.5375 15.55C7.5375 15.8083 7.625 16.025 7.8 16.2C7.975 16.375 8.19167 16.4625 8.45 16.4625C8.70833 16.4625 8.925 16.375 9.1 16.2L12 13.3ZM12 21.75C10.6516 21.75 9.38434 21.4936 8.19838 20.9809C7.01239 20.4682 5.98075 19.7724 5.10345 18.8934C4.22615 18.0145 3.53125 16.9826 3.01875 15.7978C2.50625 14.613 2.25 13.3471 2.25 12C2.25 10.6516 2.50636 9.38434 3.01908 8.19838C3.53179 7.01239 4.22762 5.98075 5.10658 5.10345C5.98553 4.22615 7.01739 3.53125 8.20218 3.01875C9.38698 2.50625 10.6529 2.25 12 2.25C13.3484 2.25 14.6157 2.50636 15.8016 3.01908C16.9876 3.53179 18.0193 4.22762 18.8966 5.10658C19.7739 5.98553 20.4688 7.01739 20.9813 8.20217C21.4938 9.38697 21.75 10.6529 21.75 12C21.75 13.3484 21.4936 14.6157 20.9809 15.8016C20.4682 16.9876 19.7724 18.0193 18.8934 18.8966C18.0145 19.7739 16.9826 20.4688 15.7978 20.9813C14.613 21.4938 13.3471 21.75 12 21.75ZM12 19.875C14.1917 19.875 16.0521 19.1104 17.5813 17.5813C19.1104 16.0521 19.875 14.1917 19.875 12C19.875 9.80833 19.1104 7.94792 17.5813 6.41875C16.0521 4.88958 14.1917 4.125 12 4.125C9.80833 4.125 7.94792 4.88958 6.41875 6.41875C4.88958 7.94792 4.125 9.80833 4.125 12C4.125 14.1917 4.88958 16.0521 6.41875 17.5813C7.94792 19.1104 9.80833 19.875 12 19.875Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Cultural.tsx b/apps/scandic-web/components/Icons/Cultural.tsx
deleted file mode 100644
index af3b9894f..000000000
--- a/apps/scandic-web/components/Icons/Cultural.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function CulturalIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M18.8424 7.51255C19.1058 7.51255 19.3292 7.4226 19.5125 7.2427C19.6959 7.0628 19.7875 6.83988 19.7875 6.57395C19.7875 6.30802 19.6965 6.08547 19.5144 5.9063C19.3323 5.72713 19.1067 5.63755 18.8375 5.63755C18.5755 5.63755 18.3558 5.72922 18.1785 5.91255C18.0012 6.09588 17.9125 6.31672 17.9125 6.57505C17.9125 6.83338 18.0017 7.05422 18.1799 7.23755C18.3581 7.42088 18.5789 7.51255 18.8424 7.51255ZM14.9 7.51255C15.1584 7.51255 15.3792 7.42088 15.5625 7.23755C15.7459 7.05422 15.8375 6.83338 15.8375 6.57505C15.8375 6.31672 15.7459 6.09588 15.5625 5.91255C15.3792 5.72922 15.1584 5.63755 14.9 5.63755C14.6417 5.63755 14.4209 5.72922 14.2375 5.91255C14.0542 6.09588 13.9625 6.31672 13.9625 6.57505C13.9625 6.83338 14.0542 7.05422 14.2375 7.23755C14.4209 7.42088 14.6417 7.51255 14.9 7.51255ZM16.875 9.06255C16.4212 9.06255 15.9869 9.1438 15.5721 9.3063C15.1574 9.4688 14.8417 9.74172 14.625 10.125C14.5167 10.3 14.5292 10.4709 14.6625 10.6375C14.7959 10.8042 14.975 10.8875 15.2 10.8875H18.55C18.775 10.8875 18.9542 10.8042 19.0875 10.6375C19.2209 10.4709 19.2334 10.3 19.125 10.125C18.9084 9.74172 18.5927 9.4688 18.1779 9.3063C17.7632 9.1438 17.3289 9.06255 16.875 9.06255ZM7.11035 21.75C5.49515 21.75 4.12297 21.1849 2.9938 20.0547C1.86463 18.9245 1.30005 17.5521 1.30005 15.9375V11.0125C1.30005 10.4969 1.48364 10.0555 1.85082 9.68832C2.21801 9.32114 2.65942 9.13755 3.17505 9.13755H11.05C11.5657 9.13755 12.0071 9.32114 12.3743 9.68832C12.7415 10.0555 12.925 10.4969 12.925 11.0125V15.9375C12.925 17.5521 12.3597 18.9245 11.2291 20.0547C10.0985 21.1849 8.72555 21.75 7.11035 21.75ZM7.11255 19.875C8.20422 19.875 9.13338 19.4917 9.90005 18.725C10.6667 17.9584 11.05 17.0292 11.05 15.9375V11.0125H3.17505V15.9375C3.17505 17.0292 3.55838 17.9584 4.32505 18.725C5.09172 19.4917 6.02088 19.875 7.11255 19.875ZM16.875 14.85C16.4417 14.85 16.0084 14.8021 15.575 14.7063C15.1417 14.6105 14.7334 14.4667 14.35 14.275V12.0625C14.7167 12.3542 15.1153 12.5792 15.5457 12.7375C15.9762 12.8959 16.4193 12.975 16.875 12.975C17.9667 12.975 18.8959 12.5917 19.6625 11.825C20.4292 11.0584 20.8125 10.1292 20.8125 9.03755V4.11255H12.925V7.71255H11.05V4.11255C11.05 3.59692 11.2336 3.15551 11.6008 2.78832C11.968 2.42114 12.4094 2.23755 12.925 2.23755H20.8125C21.3282 2.23755 21.7696 2.42114 22.1368 2.78832C22.504 3.15551 22.6875 3.59692 22.6875 4.11255V9.03755C22.6875 10.6521 22.1224 12.0245 20.9922 13.1547C19.862 14.2849 18.4896 14.85 16.875 14.85ZM5.16255 14.4C5.42463 14.4 5.64432 14.3109 5.82162 14.1327C5.99891 13.9545 6.08755 13.7337 6.08755 13.4702C6.08755 13.2068 5.99844 12.9834 5.82022 12.8C5.64201 12.6167 5.42117 12.525 5.15772 12.525C4.89427 12.525 4.67088 12.6161 4.48755 12.7982C4.30422 12.9803 4.21255 13.2059 4.21255 13.475C4.21255 13.7371 4.30359 13.9568 4.48567 14.1341C4.66776 14.3114 4.89338 14.4 5.16255 14.4ZM9.08755 14.4C9.34588 14.4 9.56672 14.3109 9.75005 14.1327C9.93338 13.9545 10.025 13.7337 10.025 13.4702C10.025 13.2068 9.9351 12.9834 9.7552 12.8C9.5753 12.6167 9.35238 12.525 9.08645 12.525C8.82052 12.525 8.59797 12.6161 8.4188 12.7982C8.23963 12.9803 8.15005 13.2059 8.15005 13.475C8.15005 13.7371 8.24172 13.9568 8.42505 14.1341C8.60838 14.3114 8.82922 14.4 9.08755 14.4ZM7.12317 17.7875C7.57442 17.7875 8.00213 17.7042 8.4063 17.5375C8.81047 17.3709 9.12922 17.1042 9.36255 16.7375C9.47088 16.5542 9.46418 16.375 9.34245 16.2C9.2207 16.025 9.04823 15.9375 8.82505 15.9375H5.42505C5.20187 15.9375 5.0294 16.025 4.90765 16.2C4.78592 16.375 4.77922 16.5542 4.88755 16.7375C5.12088 17.1042 5.43901 17.3709 5.84192 17.5375C6.24482 17.7042 6.67191 17.7875 7.12317 17.7875Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Delete.tsx b/apps/scandic-web/components/Icons/Delete.tsx
deleted file mode 100644
index 2a4150666..000000000
--- a/apps/scandic-web/components/Icons/Delete.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DeleteIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M7.07656 20.75C6.5599 20.75 6.11823 20.5667 5.75156 20.2C5.3849 19.8333 5.20156 19.3917 5.20156 18.875V6.075H5.16406C4.90573 6.075 4.6849 5.98333 4.50156 5.8C4.31823 5.61667 4.22656 5.39583 4.22656 5.1375C4.22656 4.87917 4.31823 4.65833 4.50156 4.475C4.6849 4.29167 4.90573 4.2 5.16406 4.2H9.05156V4.1875C9.05156 3.92917 9.14323 3.70833 9.32656 3.525C9.5099 3.34167 9.73073 3.25 9.98906 3.25H14.0391C14.2974 3.25 14.5182 3.34167 14.7016 3.525C14.8849 3.70833 14.9766 3.92917 14.9766 4.1875V4.2H18.8641C19.1224 4.2 19.3432 4.29167 19.5266 4.475C19.7099 4.65833 19.8016 4.87917 19.8016 5.1375C19.8016 5.39583 19.7099 5.61667 19.5266 5.8C19.3432 5.98333 19.1224 6.075 18.8641 6.075H18.8266V18.875C18.8266 19.3917 18.6432 19.8333 18.2766 20.2C17.9099 20.5667 17.4682 20.75 16.9516 20.75H7.07656ZM16.9516 6.075H7.07656V18.875H16.9516V6.075ZM10.0641 16.9125C10.3224 16.9125 10.5432 16.8208 10.7266 16.6375C10.9099 16.4542 11.0016 16.2333 11.0016 15.975V8.975C11.0016 8.71667 10.9099 8.49583 10.7266 8.3125C10.5432 8.12917 10.3224 8.0375 10.0641 8.0375C9.80573 8.0375 9.5849 8.12917 9.40156 8.3125C9.21823 8.49583 9.12656 8.71667 9.12656 8.975V15.975C9.12656 16.2333 9.21823 16.4542 9.40156 16.6375C9.5849 16.8208 9.80573 16.9125 10.0641 16.9125ZM13.9641 16.9125C14.2224 16.9125 14.4432 16.8208 14.6266 16.6375C14.8099 16.4542 14.9016 16.2333 14.9016 15.975V8.975C14.9016 8.71667 14.8099 8.49583 14.6266 8.3125C14.4432 8.12917 14.2224 8.0375 13.9641 8.0375C13.7057 8.0375 13.4849 8.12917 13.3016 8.3125C13.1182 8.49583 13.0266 8.71667 13.0266 8.975V15.975C13.0266 16.2333 13.1182 16.4542 13.3016 16.6375C13.4849 16.8208 13.7057 16.9125 13.9641 16.9125Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Desk.tsx b/apps/scandic-web/components/Icons/Desk.tsx
deleted file mode 100644
index 289a227a8..000000000
--- a/apps/scandic-web/components/Icons/Desk.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DeskIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M2.0625 17V7.9375C2.0625 7.42187 2.24609 6.98046 2.61327 6.61328C2.98046 6.24609 3.42187 6.0625 3.9375 6.0625H20.0625C20.5781 6.0625 21.0195 6.24609 21.3867 6.61328C21.7539 6.98046 21.9375 7.42187 21.9375 7.9375V17C21.9375 17.2583 21.8458 17.4792 21.6625 17.6625C21.4792 17.8458 21.2583 17.9375 21 17.9375C20.7417 17.9375 20.5208 17.8458 20.3375 17.6625C20.1542 17.4792 20.0625 17.2583 20.0625 17V15.9375H15.9375V17C15.9375 17.2583 15.8458 17.4792 15.6625 17.6625C15.4792 17.8458 15.2583 17.9375 15 17.9375C14.7417 17.9375 14.5208 17.8458 14.3375 17.6625C14.1542 17.4792 14.0625 17.2583 14.0625 17V7.9375H3.9375V17C3.9375 17.2583 3.84583 17.4792 3.6625 17.6625C3.47917 17.8458 3.25833 17.9375 3 17.9375C2.74167 17.9375 2.52083 17.8458 2.3375 17.6625C2.15417 17.4792 2.0625 17.2583 2.0625 17ZM15.9375 10.0625H20.0625V7.9375H15.9375V10.0625ZM15.9375 14.0625H20.0625V11.9375H15.9375V14.0625Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Diamond.tsx b/apps/scandic-web/components/Icons/Diamond.tsx
deleted file mode 100644
index 9d89c9b6d..000000000
--- a/apps/scandic-web/components/Icons/Diamond.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DiamondIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M11.9993 20.17C11.7331 20.17 11.475 20.1117 11.225 19.995C10.975 19.8783 10.7542 19.7075 10.5625 19.4825L2.85 10.245C2.70834 10.0724 2.60209 9.88404 2.53125 9.68001C2.46042 9.47597 2.425 9.2641 2.425 9.04438C2.425 8.90313 2.4375 8.76167 2.4625 8.62001C2.4875 8.47834 2.5375 8.34084 2.6125 8.20751L4.525 4.42001C4.69167 4.10334 4.92018 3.85126 5.21053 3.66376C5.50088 3.47626 5.82654 3.38251 6.1875 3.38251H17.8125C18.1735 3.38251 18.4991 3.47626 18.7895 3.66376C19.0798 3.85126 19.3083 4.10334 19.475 4.42001L21.3875 8.20751C21.4625 8.34084 21.5125 8.47834 21.5375 8.62001C21.5625 8.76167 21.575 8.90313 21.575 9.04438C21.575 9.2641 21.5396 9.47597 21.4688 9.68001C21.3979 9.88404 21.2917 10.0724 21.15 10.245L13.4375 19.4825C13.2458 19.7075 13.0248 19.8783 12.7743 19.995C12.5237 20.1117 12.2654 20.17 11.9993 20.17ZM9.525 8.38251H14.475L12.9116 5.25751H11.0875L9.525 8.38251ZM11.0625 17.17V10.2575H5.3125L11.0625 17.17ZM12.9375 17.17L18.6875 10.2575H12.9375V17.17ZM16.5625 8.38251H19.35L17.7875 5.25751H15L16.5625 8.38251ZM4.65 8.38251H7.4375L9 5.25751H6.2125L4.65 8.38251Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Dining.tsx b/apps/scandic-web/components/Icons/Dining.tsx
deleted file mode 100644
index 5fcab7d1b..000000000
--- a/apps/scandic-web/components/Icons/Dining.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DiningIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M6.125 21.75c-.516 0-.957-.184-1.324-.55a1.806 1.806 0 0 1-.551-1.325V4.125c0-.516.184-.957.55-1.324.368-.367.81-.551 1.325-.551h12.688c.258 0 .479.092.662.275a.903.903 0 0 1 .275.663c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275h-1.05v1.876a.937.937 0 0 1-.287.686.938.938 0 0 1-.688.288h-7.7a.938.938 0 0 1-.687-.287A.937.937 0 0 1 8.113 6V4.125H6.125v15.75h3.988a4.853 4.853 0 0 1-1.463-1.656c-.358-.663-.537-1.402-.537-2.219v-2.975c0-.516.183-.957.55-1.324.367-.367.809-.551 1.325-.551h5.9c.515 0 .957.184 1.324.55.367.368.55.81.55 1.325V16c0 .817-.179 1.556-.537 2.219a4.852 4.852 0 0 1-1.463 1.656h3.05c.259 0 .48.092.663.275a.903.903 0 0 1 .275.663c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275H6.126Zm6.81-2.8a2.85 2.85 0 0 0 2.09-.86c.575-.574.862-1.27.862-2.09v-2.975h-5.9V16c0 .82.287 1.516.86 2.09a2.84 2.84 0 0 0 2.088.86Zm.001-8.9a.947.947 0 0 0 .695-.28.94.94 0 0 0 .281-.694.947.947 0 0 0-.28-.695.94.94 0 0 0-.693-.281.946.946 0 0 0-.695.28.94.94 0 0 0-.281.694c0 .276.093.507.28.695a.94.94 0 0 0 .693.281Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Directions.tsx b/apps/scandic-web/components/Icons/Directions.tsx
deleted file mode 100644
index ce798a1b4..000000000
--- a/apps/scandic-web/components/Icons/Directions.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DirectionsIcon({
-  className,
-  color,
-  width = "20",
-  height = "20",
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height={height}
-      viewBox="0 0 20 20"
-      width={width}
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M8.28158 9.94792H11.3024V11.0104C11.3024 11.191 11.3823 11.3142 11.542 11.3802C11.7017 11.4462 11.8441 11.4167 11.9691 11.2917L13.542 9.70834C13.7017 9.54862 13.7816 9.36632 13.7816 9.16146C13.7816 8.9566 13.7017 8.77431 13.542 8.61459L11.9691 7.04167C11.8441 6.91667 11.7017 6.88542 11.542 6.94792C11.3823 7.01042 11.3024 7.13195 11.3024 7.31251V8.38542H7.50033C7.28505 8.38542 7.10102 8.46181 6.94824 8.61459C6.79546 8.76737 6.71908 8.95139 6.71908 9.16667V11.6667C6.71908 11.882 6.79546 12.066 6.94824 12.2188C7.10102 12.3715 7.28505 12.4479 7.50033 12.4479C7.7156 12.4479 7.89963 12.3715 8.05241 12.2188C8.20519 12.066 8.28158 11.882 8.28158 11.6667V9.94792ZM10.0003 18.1146C9.79894 18.1146 9.60623 18.0764 9.4222 18C9.23817 17.9236 9.0663 17.809 8.90658 17.6563L2.34408 11.0938C2.1913 10.934 2.07671 10.7622 2.00033 10.5781C1.92394 10.3941 1.88574 10.2014 1.88574 10C1.88574 9.79862 1.92394 9.60417 2.00033 9.41667C2.07671 9.22917 2.1913 9.05903 2.34408 8.90626L8.90658 2.34376C9.0663 2.18403 9.23817 2.06771 9.4222 1.9948C9.60623 1.92188 9.79894 1.88542 10.0003 1.88542C10.2017 1.88542 10.3962 1.92188 10.5837 1.9948C10.7712 2.06771 10.9413 2.18403 11.0941 2.34376L17.6566 8.90626C17.8163 9.05903 17.9326 9.22917 18.0055 9.41667C18.0785 9.60417 18.1149 9.79862 18.1149 10C18.1149 10.2014 18.0785 10.3941 18.0055 10.5781C17.9326 10.7622 17.8163 10.934 17.6566 11.0938L11.0941 17.6563C10.9413 17.809 10.7712 17.9236 10.5837 18C10.3962 18.0764 10.2017 18.1146 10.0003 18.1146ZM10.0003 16.5625L16.5628 10L10.0003 3.43751L3.43783 10L10.0003 16.5625Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Discount.tsx b/apps/scandic-web/components/Icons/Discount.tsx
deleted file mode 100644
index 995950ba6..000000000
--- a/apps/scandic-web/components/Icons/Discount.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DiscountIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M9.9987 12.0106L11.582 12.9689C11.7279 13.0592 11.872 13.054 12.0143 12.9533C12.1567 12.8526 12.207 12.7189 12.1654 12.5522L11.7487 10.746L13.1654 9.521C13.2973 9.40519 13.3355 9.26686 13.2799 9.10602C13.2244 8.94517 13.1098 8.8578 12.9362 8.84391L11.082 8.68766L10.3529 6.97933C10.2834 6.81961 10.1654 6.73975 9.9987 6.73975C9.83203 6.73975 9.71398 6.81961 9.64453 6.97933L8.91536 8.68766L7.0612 8.84391C6.88759 8.8578 6.773 8.94517 6.71745 9.10602C6.66189 9.26686 6.70009 9.40519 6.83203 9.521L8.2487 10.746L7.83203 12.5522C7.79037 12.7189 7.84071 12.8526 7.98307 12.9533C8.12543 13.054 8.26953 13.0592 8.41537 12.9689L9.9987 12.0106ZM7.2932 16.4585H5.10286C4.67317 16.4585 4.30533 16.3055 3.99934 15.9995C3.69336 15.6935 3.54036 15.3257 3.54036 14.896V12.7057L1.9362 11.0939C1.78342 10.9342 1.67057 10.7623 1.59766 10.5783C1.52474 10.3943 1.48828 10.2016 1.48828 10.0002C1.48828 9.79877 1.52474 9.60607 1.59766 9.42204C1.67057 9.23801 1.78342 9.06614 1.9362 8.90641L3.54036 7.29466V5.10433C3.54036 4.67464 3.69336 4.30679 3.99934 4.00081C4.30533 3.69482 4.67317 3.54183 5.10286 3.54183H7.2932L8.90495 1.93766C9.06467 1.78488 9.23655 1.67204 9.42057 1.59912C9.6046 1.5262 9.79731 1.48975 9.9987 1.48975C10.2001 1.48975 10.3928 1.5262 10.5768 1.59912C10.7609 1.67204 10.9327 1.78488 11.0924 1.93766L12.7042 3.54183H14.8945C15.3242 3.54183 15.6921 3.69482 15.9981 4.00081C16.304 4.30679 16.457 4.67464 16.457 5.10433V7.29466L18.0612 8.90641C18.214 9.06614 18.3268 9.23801 18.3997 9.42204C18.4727 9.60607 18.5091 9.79877 18.5091 10.0002C18.5091 10.2016 18.4727 10.3943 18.3997 10.5783C18.3268 10.7623 18.214 10.9342 18.0612 11.0939L16.457 12.7057V14.896C16.457 15.3257 16.304 15.6935 15.9981 15.9995C15.6921 16.3055 15.3242 16.4585 14.8945 16.4585H12.7042L11.0924 18.0627C10.9327 18.2154 10.7609 18.3283 10.5768 18.4012C10.3928 18.4741 10.2001 18.5106 9.9987 18.5106C9.79731 18.5106 9.6046 18.4741 9.42057 18.4012C9.23655 18.3283 9.06467 18.2154 8.90495 18.0627L7.2932 16.4585ZM7.9362 14.896L9.9987 16.9585L12.0612 14.896H14.8945V12.0627L16.957 10.0002L14.8945 7.93766V5.10433H12.0612L9.9987 3.04183L7.9362 5.10433H5.10286V7.93766L3.04036 10.0002L5.10286 12.0627V14.896H7.9362Z"
-        fill="#57514E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/DoorClosed.tsx b/apps/scandic-web/components/Icons/DoorClosed.tsx
deleted file mode 100644
index 307a7f7f4..000000000
--- a/apps/scandic-web/components/Icons/DoorClosed.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DoorClosedIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M3.46875 17.3125C3.25347 17.3125 3.06944 17.2361 2.91667 17.0833C2.76389 16.9306 2.6875 16.7465 2.6875 16.5312C2.6875 16.316 2.76389 16.1319 2.91667 15.9792C3.06944 15.8264 3.25347 15.75 3.46875 15.75H4.33333V4.25C4.33333 3.82031 4.48633 3.45247 4.79231 3.14648C5.0983 2.84049 5.46614 2.6875 5.89583 2.6875H14.1042C14.5339 2.6875 14.9017 2.84049 15.2077 3.14648C15.5137 3.45247 15.6667 3.82031 15.6667 4.25V15.75H16.5312C16.7465 15.75 16.9306 15.8264 17.0833 15.9792C17.2361 16.1319 17.3125 16.316 17.3125 16.5312C17.3125 16.7465 17.2361 16.9306 17.0833 17.0833C16.9306 17.2361 16.7465 17.3125 16.5312 17.3125H3.46875ZM5.89583 15.75H14.1042V4.25H5.89583V15.75ZM8.33223 10.8125C8.56213 10.8125 8.75521 10.7347 8.91146 10.5792C9.06771 10.4237 9.14583 10.231 9.14583 10.0011C9.14583 9.7712 9.06808 9.57813 8.91256 9.42188C8.75704 9.26563 8.56433 9.1875 8.33444 9.1875C8.10453 9.1875 7.91146 9.26526 7.75521 9.42077C7.59896 9.5763 7.52083 9.76901 7.52083 9.9989C7.52083 10.2288 7.59859 10.4219 7.7541 10.5781C7.90963 10.7344 8.10234 10.8125 8.33223 10.8125Z"
-        fill="#57514E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/DoorOpen.tsx b/apps/scandic-web/components/Icons/DoorOpen.tsx
deleted file mode 100644
index 27957f2bd..000000000
--- a/apps/scandic-web/components/Icons/DoorOpen.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DoorOpenIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.2124 20.75C3.95407 20.75 3.73324 20.6583 3.5499 20.475C3.36657 20.2916 3.2749 20.0708 3.2749 19.8125C3.2749 19.5541 3.36657 19.3333 3.5499 19.15C3.73324 18.9666 3.95407 18.875 4.2124 18.875H5.2499V4.16248C5.2499 3.90414 5.34157 3.68331 5.5249 3.49998C5.70824 3.31664 5.92907 3.22498 6.1874 3.22498H13.9749C14.237 3.22498 14.4567 3.31363 14.634 3.49093C14.8113 3.66821 14.8999 3.88789 14.8999 4.14998V4.19998H17.8249C18.087 4.19998 18.3067 4.28863 18.484 4.46593C18.6613 4.64321 18.7499 4.86289 18.7499 5.12498V18.875H19.7874C20.0457 18.875 20.2666 18.9666 20.4499 19.15C20.6332 19.3333 20.7249 19.5541 20.7249 19.8125C20.7249 20.0708 20.6332 20.2916 20.4499 20.475C20.2666 20.6583 20.0457 20.75 19.7874 20.75H17.7999C17.5378 20.75 17.3181 20.6613 17.1409 20.4841C16.9636 20.3068 16.8749 20.0871 16.8749 19.825V6.07498H14.8999V19.825C14.8999 20.0871 14.8113 20.3068 14.634 20.4841C14.4567 20.6613 14.237 20.75 13.9749 20.75H4.2124ZM12.0499 12.0013C12.0499 11.7254 11.9566 11.4937 11.77 11.3062C11.5833 11.1187 11.3521 11.025 11.0762 11.025C10.8003 11.025 10.5687 11.1183 10.3812 11.3049C10.1937 11.4915 10.0999 11.7228 10.0999 11.9987C10.0999 12.2745 10.1932 12.5062 10.3798 12.6937C10.5665 12.8812 10.7977 12.975 11.0736 12.975C11.3495 12.975 11.5812 12.8817 11.7687 12.6951C11.9562 12.5084 12.0499 12.2772 12.0499 12.0013ZM7.1249 18.875H13.0249V5.09998H7.1249V18.875Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Download.tsx b/apps/scandic-web/components/Icons/Download.tsx
deleted file mode 100644
index 3e47c8a5a..000000000
--- a/apps/scandic-web/components/Icons/Download.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DownloadIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="21"
-      height="20"
-      viewBox="0 0 21 20"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M10.5013 12.9065C10.3971 12.9065 10.2982 12.8874 10.2044 12.8492C10.1107 12.811 10.0256 12.7537 9.94922 12.6773L7.05339 9.78145C6.90061 9.62868 6.82595 9.44812 6.82943 9.23979C6.8329 9.03145 6.90755 8.8509 7.05339 8.69812C7.20616 8.54534 7.38846 8.46722 7.60026 8.46375C7.81207 8.46027 7.99436 8.53493 8.14714 8.6877L9.72005 10.2606V4.32312C9.72005 4.10784 9.79644 3.92381 9.94922 3.77104C10.102 3.61826 10.286 3.54187 10.5013 3.54187C10.7166 3.54187 10.9006 3.61826 11.0534 3.77104C11.2062 3.92381 11.2826 4.10784 11.2826 4.32312V10.2606L12.8555 8.6877C13.0082 8.53493 13.1905 8.46027 13.4023 8.46375C13.6142 8.46722 13.7964 8.54534 13.9492 8.69812C14.0951 8.8509 14.1697 9.03145 14.1732 9.23979C14.1767 9.44812 14.102 9.62868 13.9492 9.78145L11.0534 12.6773C10.977 12.7537 10.8919 12.811 10.7982 12.8492C10.7044 12.8874 10.6055 12.9065 10.5013 12.9065ZM5.60547 16.4585C5.17491 16.4585 4.80686 16.3058 4.5013 16.0002C4.19575 15.6946 4.04297 15.3266 4.04297 14.896V13.2294C4.04297 13.0141 4.11936 12.8301 4.27214 12.6773C4.42491 12.5245 4.60894 12.4481 4.82422 12.4481C5.0395 12.4481 5.22352 12.5245 5.3763 12.6773C5.52908 12.8301 5.60547 13.0141 5.60547 13.2294V14.896H15.3971V13.2294C15.3971 13.0141 15.4735 12.8301 15.6263 12.6773C15.7791 12.5245 15.9631 12.4481 16.1784 12.4481C16.3937 12.4481 16.5777 12.5245 16.7305 12.6773C16.8832 12.8301 16.9596 13.0141 16.9596 13.2294V14.896C16.9596 15.3266 16.8069 15.6946 16.5013 16.0002C16.1957 16.3058 15.8277 16.4585 15.3971 16.4585H5.60547Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Dresser.tsx b/apps/scandic-web/components/Icons/Dresser.tsx
deleted file mode 100644
index 2b7d06f1c..000000000
--- a/apps/scandic-web/components/Icons/Dresser.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function DresserIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.0625 20.9375V4.9375C4.0625 4.42187 4.24609 3.98046 4.61328 3.61328C4.98046 3.24609 5.42187 3.0625 5.9375 3.0625H18.0625C18.5781 3.0625 19.0195 3.24609 19.3867 3.61328C19.7539 3.98046 19.9375 4.42187 19.9375 4.9375V20.9375H18.0625V18.9375H5.9375V20.9375H4.0625ZM5.9375 11.0625H11.0625V4.9375H5.9375V11.0625ZM12.9375 7.0625H18.0625V4.9375H12.9375V7.0625ZM12.9375 11.0625H18.0625V8.9375H12.9375V11.0625ZM10.0625 15.9375H13.9375V14.0625H10.0625V15.9375ZM5.9375 12.9375V17.0625H18.0625V12.9375H5.9375Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Edit.tsx b/apps/scandic-web/components/Icons/Edit.tsx
deleted file mode 100644
index b0fa6141e..000000000
--- a/apps/scandic-web/components/Icons/Edit.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function EditIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M4.58333 16.8125C4.19949 16.8125 3.87088 16.6758 3.59752 16.4025C3.32417 16.1291 3.1875 15.8005 3.1875 15.4167V4.58333C3.1875 4.19375 3.32313 3.86024 3.5944 3.58281C3.86566 3.30538 4.19531 3.17361 4.58333 3.1875H11.7292L10.3333 4.58333H4.58333V15.4167H15.4167V9.65625L16.8125 8.26042V15.4167C16.8125 15.8005 16.6758 16.1291 16.4025 16.4025C16.1291 16.6758 15.8005 16.8125 15.4167 16.8125H4.58333ZM8.05208 11.9479V8.83333L15.4583 1.42708C15.6042 1.28125 15.7569 1.17882 15.9167 1.11979C16.0764 1.06076 16.245 1.03125 16.4224 1.03125C16.6116 1.03125 16.7899 1.06076 16.9573 1.11979C17.1247 1.17882 17.2808 1.27974 17.4259 1.42256L18.5625 2.5625C18.7083 2.70833 18.8125 2.86585 18.875 3.03504C18.9375 3.20424 18.9688 3.38006 18.9688 3.5625C18.9688 3.74529 18.9373 3.91971 18.8745 4.08575C18.8118 4.25179 18.7077 4.40724 18.5625 4.55208L11.1667 11.9479H8.05208ZM9.44792 10.5521H10.5938L15.4583 5.67708L14.8958 5.09375L14.3229 4.54167L9.44792 9.40625V10.5521Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ElectricBike.tsx b/apps/scandic-web/components/Icons/ElectricBike.tsx
deleted file mode 100644
index 1e0787c63..000000000
--- a/apps/scandic-web/components/Icons/ElectricBike.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ElectricBikeIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5.125 16.875C3.75 16.875 2.59375 16.4062 1.65625 15.4687C0.71875 14.5312 0.25 13.375 0.25 12C0.25 10.625 0.72775 9.46453 1.68325 8.5187C2.63875 7.57287 3.79433 7.09995 5.15 7.09995C6.35833 7.09995 7.39792 7.47912 8.26875 8.23745C9.13958 8.99578 9.68333 9.93328 9.9 11.05H10.65L8.85 6.02495H8.0625C7.80417 6.02495 7.58333 5.93328 7.4 5.74995C7.21667 5.56662 7.125 5.34578 7.125 5.08745C7.125 4.82912 7.21667 4.60828 7.4 4.42495C7.58333 4.24162 7.80417 4.14995 8.0625 4.14995H11.0375C11.2958 4.14995 11.5167 4.24162 11.7 4.42495C11.8833 4.60828 11.975 4.82912 11.975 5.08745C11.975 5.34578 11.8833 5.56662 11.7 5.74995C11.5167 5.93328 11.2958 6.02495 11.0375 6.02495H10.85L11.225 7.09995H16.075L14.6 3.07495H12.9875C12.7292 3.07495 12.5083 2.98328 12.325 2.79995C12.1417 2.61662 12.05 2.39578 12.05 2.13745C12.05 1.87912 12.1417 1.65828 12.325 1.47495C12.5083 1.29162 12.7292 1.19995 12.9875 1.19995H14.575C14.9922 1.19995 15.3652 1.31037 15.6941 1.5312C16.023 1.75203 16.2583 2.05828 16.4 2.44995L18.075 7.07495H18.9C20.2487 7.07495 21.3984 7.55043 22.3491 8.5014C23.2997 9.45237 23.775 10.6025 23.775 11.9517C23.775 13.3172 23.3021 14.4791 22.3563 15.4375C21.4104 16.3958 20.2563 16.875 18.8938 16.875C17.7259 16.875 16.7 16.5046 15.816 15.764C14.932 15.0234 14.3683 14.077 14.125 12.925H9.9C9.68333 14.0666 9.13489 15.0104 8.25468 15.7562C7.37446 16.502 6.33123 16.875 5.125 16.875ZM5.125 15C5.80833 15 6.4 14.8062 6.9 14.4187C7.4 14.0312 7.75 13.5333 7.95 12.925H6.1125C5.85417 12.925 5.63333 12.8333 5.45 12.65C5.26667 12.4666 5.175 12.2458 5.175 11.9875C5.175 11.7291 5.26667 11.5083 5.45 11.325C5.63333 11.1416 5.85417 11.05 6.1125 11.05H7.95C7.75 10.425 7.4 9.92703 6.9 9.5562C6.4 9.18537 5.80833 8.99995 5.125 8.99995C4.275 8.99995 3.5625 9.28745 2.9875 9.86245C2.4125 10.4375 2.125 11.15 2.125 12C2.125 12.8416 2.4125 13.552 2.9875 14.1312C3.5625 14.7104 4.275 15 5.125 15ZM12.6747 11.05H14.1209C14.207 10.6666 14.3271 10.2958 14.4812 9.93745C14.6354 9.57912 14.8417 9.25828 15.1 8.97495H11.9L12.6747 11.05ZM18.9 15C19.75 15 20.4625 14.7104 21.0375 14.1312C21.6125 13.552 21.9 12.8416 21.9 12C21.9 11.15 21.6125 10.4375 21.0375 9.86245C20.4625 9.28745 19.75 8.99995 18.9 8.99995H18.75L19.4 10.75C19.4917 11 19.4831 11.2389 19.3742 11.4667C19.2653 11.6946 19.0864 11.8557 18.8375 11.95C18.5875 12.0416 18.3462 12.033 18.1136 11.9241C17.8809 11.8152 17.7181 11.6363 17.625 11.3875L17 9.64995C16.6417 9.93328 16.3688 10.275 16.1813 10.675C15.9938 11.075 15.9 11.5182 15.9 12.0046C15.9 12.8432 16.1875 13.552 16.7625 14.1312C17.3375 14.7104 18.05 15 18.9 15ZM12.975 20.85V22.05C12.975 22.2213 12.9021 22.3538 12.7563 22.4472C12.6104 22.5407 12.4583 22.5458 12.3 22.4625L8.0375 20.325C7.92917 20.2666 7.88693 20.177 7.9108 20.0562C7.93467 19.9354 8.01023 19.875 8.1375 19.875H11.05V18.675C11.05 18.5036 11.1229 18.3711 11.2688 18.2777C11.4146 18.1842 11.5667 18.1791 11.725 18.2625L15.9875 20.4C16.0958 20.4583 16.1381 20.5479 16.1142 20.6687C16.0903 20.7895 16.0148 20.85 15.8875 20.85H12.975Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ElectricCar.tsx b/apps/scandic-web/components/Icons/ElectricCar.tsx
deleted file mode 100644
index 1af91af32..000000000
--- a/apps/scandic-web/components/Icons/ElectricCar.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ElectricCarIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6.0251 14.875V15.425C6.0251 15.8139 5.8887 16.1445 5.6159 16.4167C5.34311 16.6889 5.01186 16.825 4.62215 16.825C4.23245 16.825 3.90218 16.6889 3.63135 16.4167C3.36051 16.1445 3.2251 15.8139 3.2251 15.425V8.40002C3.2251 8.29447 3.23343 8.18892 3.2501 8.08335C3.26676 7.9778 3.29166 7.87571 3.32477 7.77707L5.1876 2.52502C5.32093 2.15002 5.54593 1.84794 5.8626 1.61877C6.17926 1.38961 6.54176 1.27502 6.9501 1.27502H17.0501C17.4584 1.27502 17.8209 1.38961 18.1376 1.61877C18.4543 1.84794 18.6793 2.15002 18.8126 2.52502L20.6754 7.77707C20.7085 7.87571 20.7334 7.9778 20.7501 8.08335C20.7668 8.18892 20.7751 8.29447 20.7751 8.40002V15.425C20.7751 15.8139 20.6387 16.1445 20.3659 16.4167C20.0931 16.6889 19.7619 16.825 19.3722 16.825C18.9825 16.825 18.6522 16.6889 18.3813 16.4167C18.1105 16.1445 17.9751 15.8139 17.9751 15.425V14.875H6.0251ZM5.8501 6.20002H18.1501L17.0751 3.15002H6.9251L5.8501 6.20002ZM7.54715 11.975C7.94911 11.975 8.29176 11.8343 8.5751 11.553C8.85843 11.2716 9.0001 10.9299 9.0001 10.528C9.0001 10.126 8.85942 9.78336 8.57805 9.50002C8.29666 9.21669 7.955 9.07502 7.55305 9.07502C7.15108 9.07502 6.80843 9.21571 6.5251 9.49708C6.24176 9.77846 6.1001 10.1201 6.1001 10.5221C6.1001 10.924 6.24078 11.2667 6.52215 11.55C6.80353 11.8334 7.1452 11.975 7.54715 11.975ZM16.4471 11.975C16.8491 11.975 17.1918 11.8343 17.4751 11.553C17.7584 11.2716 17.9001 10.9299 17.9001 10.528C17.9001 10.126 17.7594 9.78336 17.478 9.50002C17.1967 9.21669 16.855 9.07502 16.453 9.07502C16.0511 9.07502 15.7084 9.21571 15.4251 9.49708C15.1418 9.77846 15.0001 10.1201 15.0001 10.5221C15.0001 10.924 15.1408 11.2667 15.4221 11.55C15.7035 11.8334 16.0452 11.975 16.4471 11.975ZM12.9751 20.875V22.0445C12.9751 22.2232 12.9014 22.3584 12.754 22.45C12.6066 22.5417 12.4553 22.5459 12.3001 22.4625L8.0376 20.35C7.92927 20.2917 7.88731 20.2021 7.91172 20.0813C7.93614 19.9604 8.01346 19.9 8.1437 19.9H11.0251V18.7C11.0251 18.5286 11.098 18.3962 11.2438 18.3027C11.3897 18.2093 11.5418 18.2042 11.7001 18.2875L15.9626 20.425C16.0709 20.4834 16.1129 20.5729 16.0885 20.6938C16.0641 20.8146 15.9867 20.875 15.8565 20.875H12.9751ZM5.1001 13H18.9001V8.07502H5.1001V13Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Email.tsx b/apps/scandic-web/components/Icons/Email.tsx
deleted file mode 100644
index 7f781781f..000000000
--- a/apps/scandic-web/components/Icons/Email.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function EmailIcon({
-  className,
-  color,
-  width = "20",
-  height = "20",
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height={height}
-      viewBox="0 0 20 20"
-      width={width}
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M10.0094 17.5831C8.9638 17.5831 7.98052 17.3858 7.05961 16.991C6.1387 16.5963 5.33232 16.0532 4.64047 15.3617C3.94861 14.6701 3.40523 13.864 3.01032 12.9432C2.61542 12.0224 2.41797 11.0386 2.41797 9.99167C2.41797 8.94475 2.61533 7.96388 3.01005 7.04905C3.40477 6.1342 3.9479 5.33085 4.63943 4.63901C5.33097 3.94714 6.13713 3.40376 7.05791 3.00886C7.97868 2.61396 8.96252 2.4165 10.0094 2.4165C11.0563 2.4165 12.0372 2.6139 12.9521 3.00869C13.8669 3.40348 14.6702 3.94671 15.3621 4.63838C16.054 5.33005 16.5973 6.13317 16.9922 7.04776C17.3871 7.96232 17.5846 8.94634 17.5846 9.99982V11.0575C17.5846 11.7605 17.3373 12.3572 16.8428 12.8475C16.3482 13.3379 15.7483 13.5831 15.0429 13.5831C14.5654 13.5831 14.134 13.449 13.7489 13.1809C13.3637 12.9127 13.0552 12.5682 12.8233 12.1472C12.4793 12.5767 12.0619 12.9234 11.571 13.1873C11.0801 13.4512 10.5568 13.5831 10.0013 13.5831C9.00681 13.5831 8.16097 13.2341 7.46376 12.5359C6.76657 11.8378 6.41797 10.9909 6.41797 9.99511C6.41797 8.99933 6.76703 8.15395 7.46516 7.45896C8.16327 6.76399 9.01021 6.4165 10.006 6.4165C11.0018 6.4165 11.8471 6.7651 12.5421 7.4623C13.2371 8.1595 13.5846 9.00534 13.5846 9.99982V11.0575C13.5846 11.455 13.7288 11.7948 14.0173 12.0768C14.3057 12.3588 14.6476 12.4998 15.0429 12.4998C15.4382 12.4998 15.7801 12.3588 16.0686 12.0768C16.3571 11.7948 16.5013 11.455 16.5013 11.0575V9.99982C16.5013 8.19426 15.8693 6.65954 14.6054 5.39565C13.3416 4.13176 11.8068 3.49982 10.0013 3.49982C8.19573 3.49982 6.661 4.13176 5.39711 5.39565C4.13323 6.65954 3.50128 8.19426 3.50128 9.99982C3.50128 11.8054 4.13323 13.3401 5.39711 14.604C6.661 15.8679 8.19573 16.4998 10.0013 16.4998H14.0013V17.5831H10.0094ZM10.0013 12.4998C10.6957 12.4998 11.286 12.2568 11.7721 11.7707C12.2582 11.2845 12.5013 10.6943 12.5013 9.99982C12.5013 9.30537 12.2582 8.7151 11.7721 8.22898C11.286 7.74287 10.6957 7.49982 10.0013 7.49982C9.30684 7.49982 8.71656 7.74287 8.23045 8.22898C7.74434 8.7151 7.50128 9.30537 7.50128 9.99982C7.50128 10.6943 7.74434 11.2845 8.23045 11.7707C8.71656 12.2568 9.30684 12.4998 10.0013 12.4998Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ErrorCircle.tsx b/apps/scandic-web/components/Icons/ErrorCircle.tsx
deleted file mode 100644
index 4ba0fcde8..000000000
--- a/apps/scandic-web/components/Icons/ErrorCircle.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ErrorCircleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M10.0061 13.8958C10.1965 13.8958 10.3612 13.8274 10.5 13.6906C10.6389 13.5538 10.7084 13.3896 10.7084 13.1979V9.71873C10.7084 9.52706 10.6404 9.36283 10.5044 9.22602C10.3685 9.08922 10.2053 9.02081 10.0149 9.02081C9.82442 9.02081 9.65976 9.08922 9.52087 9.22602C9.38199 9.36283 9.31254 9.52706 9.31254 9.71873V13.1979C9.31254 13.3896 9.38052 13.5538 9.51648 13.6906C9.65245 13.8274 9.81564 13.8958 10.0061 13.8958ZM9.99346 7.58331C10.1923 7.58331 10.3612 7.51606 10.5 7.38156C10.6389 7.24706 10.7084 7.0804 10.7084 6.88156C10.7084 6.68273 10.6411 6.51387 10.5066 6.37498C10.3721 6.23609 10.2055 6.16665 10.0066 6.16665C9.80779 6.16665 9.63893 6.2339 9.50004 6.3684C9.36115 6.5029 9.29171 6.66956 9.29171 6.8684C9.29171 7.06723 9.35896 7.23609 9.49346 7.37498C9.62796 7.51387 9.79462 7.58331 9.99346 7.58331ZM10.0058 17.7916C8.9338 17.7916 7.92449 17.5884 6.97785 17.182C6.0312 16.7756 5.20275 16.2165 4.4925 15.5049C3.78225 14.7933 3.224 13.9649 2.81775 13.0199C2.4115 12.0748 2.20837 11.065 2.20837 9.99044C2.20837 8.91476 2.41159 7.90707 2.81802 6.96738C3.22445 6.02767 3.78348 5.20269 4.4951 4.49244C5.20673 3.78219 6.03508 3.22394 6.98017 2.81769C7.92523 2.41144 8.93504 2.20831 10.0096 2.20831C11.0853 2.20831 12.093 2.41153 13.0326 2.81796C13.9724 3.22439 14.7973 3.78342 15.5076 4.49504C16.2178 5.20667 16.7761 6.0334 17.1823 6.97523C17.5886 7.91705 17.7917 8.92338 17.7917 9.99423C17.7917 11.0662 17.5885 12.0755 17.1821 13.0222C16.7756 13.9688 16.2166 14.7973 15.505 15.5075C14.7934 16.2178 13.9666 16.776 13.0248 17.1823C12.083 17.5885 11.0766 17.7916 10.0058 17.7916ZM10 16.3958C11.7709 16.3958 13.2796 15.7725 14.5261 14.526C15.7726 13.2795 16.3959 11.7708 16.3959 9.99998C16.3959 8.22915 15.7726 6.72047 14.5261 5.47394C13.2796 4.22741 11.7709 3.60415 10 3.60415C8.22921 3.60415 6.72053 4.22741 5.474 5.47394C4.22747 6.72047 3.60421 8.22915 3.60421 9.99998C3.60421 11.7708 4.22747 13.2795 5.474 14.526C6.72053 15.7725 8.22921 16.3958 10 16.3958Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/ErrorCircleFilled.tsx b/apps/scandic-web/components/Icons/ErrorCircleFilled.tsx
deleted file mode 100644
index f4fc15ea0..000000000
--- a/apps/scandic-web/components/Icons/ErrorCircleFilled.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ErrorCircleFilledIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="65"
-      viewBox="0 0 65 65"
-      width="65"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M32.492 45.5C33.2078 45.5 33.8101 45.2579 34.299 44.7737C34.7879 44.2895 35.0324 43.6895 35.0324 42.9737C35.0324 42.2579 34.7902 41.6556 34.306 41.1667C33.8218 40.6778 33.2218 40.4333 32.506 40.4333C31.7902 40.4333 31.1879 40.6754 30.699 41.1597C30.2101 41.6438 29.9657 42.2438 29.9657 42.9597C29.9657 43.6754 30.2078 44.2778 30.692 44.7667C31.1762 45.2556 31.7762 45.5 32.492 45.5ZM32.5324 35.1667C33.2212 35.1667 33.8101 34.9222 34.299 34.4333C34.7879 33.9444 35.0324 33.3556 35.0324 32.6667V21.9333C35.0324 21.2444 34.7879 20.6556 34.299 20.1667C33.8101 19.6778 33.2212 19.4333 32.5324 19.4333C31.8435 19.4333 31.2546 19.6778 30.7657 20.1667C30.2768 20.6556 30.0324 21.2444 30.0324 21.9333V32.6667C30.0324 33.3556 30.2768 33.9444 30.7657 34.4333C31.2546 34.9222 31.8435 35.1667 32.5324 35.1667ZM32.499 58.5C28.9032 58.5 25.5239 57.8164 22.3614 56.4491C19.1987 55.0819 16.4477 53.2263 14.1082 50.8825C11.7688 48.5386 9.91569 45.787 8.54902 42.6275C7.18236 39.4681 6.49902 36.0922 6.49902 32.5C6.49902 28.9041 7.18265 25.5249 8.54989 22.3623C9.91713 19.1997 11.7727 16.4487 14.1166 14.1092C16.4604 11.7697 19.2121 9.91667 22.3715 8.55C25.531 7.18333 28.9068 6.5 32.499 6.5C36.0949 6.5 39.4741 7.18362 42.6367 8.55087C45.7993 9.91811 48.5504 11.7737 50.8898 14.1175C53.2293 16.4614 55.0824 19.213 56.449 22.3725C57.8157 25.5319 58.499 28.9078 58.499 32.5C58.499 36.0959 57.8154 39.4751 56.4482 42.6377C55.0809 45.8003 53.2254 48.5513 50.8815 50.8908C48.5376 53.2303 45.786 55.0833 42.6266 56.45C39.4671 57.8167 36.0912 58.5 32.499 58.5Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Expand.tsx b/apps/scandic-web/components/Icons/Expand.tsx
deleted file mode 100644
index 25786f866..000000000
--- a/apps/scandic-web/components/Icons/Expand.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ExpandIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M14.7569 4.36451C14.7569 3.87465 15.154 3.47753 15.6439 3.47753H19.6353C20.1252 3.47753 20.5223 3.87465 20.5223 4.36451V8.35591C20.5223 8.84577 20.1252 9.24288 19.6353 9.24288C19.1454 9.24288 18.7483 8.84577 18.7483 8.35591V5.25149H15.6439C15.154 5.25149 14.7569 4.85437 14.7569 4.36451Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M20.2625 3.73732C20.6089 4.08371 20.6089 4.64531 20.2625 4.9917L15.2732 9.98094C14.9269 10.3273 14.3653 10.3273 14.0189 9.98094C13.6725 9.63456 13.6725 9.07295 14.0189 8.72657L19.0081 3.73732C19.3545 3.39094 19.9161 3.39094 20.2625 3.73732Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M4.36476 14.7567C4.85462 14.7567 5.25174 15.1538 5.25174 15.6437V18.7481H8.35616C8.84602 18.7481 9.24313 19.1452 9.24313 19.6351C9.24313 20.1249 8.84602 20.522 8.35616 20.522H4.36476C3.8749 20.522 3.47778 20.1249 3.47778 19.6351V15.6437C3.47778 15.1538 3.8749 14.7567 4.36476 14.7567Z"
-        fill="#26201E"
-      />
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M9.98119 14.0186C10.3276 14.365 10.3276 14.9266 9.98119 15.273L4.99195 20.2623C4.64556 20.6086 4.08396 20.6086 3.73757 20.2623C3.39119 19.9159 3.39119 19.3543 3.73757 19.0079L8.72682 14.0186C9.0732 13.6722 9.63481 13.6722 9.98119 14.0186Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/EyeHide.tsx b/apps/scandic-web/components/Icons/EyeHide.tsx
deleted file mode 100644
index c3da6d258..000000000
--- a/apps/scandic-web/components/Icons/EyeHide.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function EyeHideIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M15.9625 13.3L14.6 11.9375C14.7834 11.0335 14.5521 10.2616 13.9063 9.62196C13.2604 8.98231 12.4792 8.74165 11.5625 8.89999L10.2 7.53749C10.4834 7.40832 10.775 7.31145 11.075 7.24686C11.375 7.18228 11.6834 7.14999 12 7.14999C13.2084 7.14999 14.2354 7.5729 15.0813 8.41874C15.9271 9.26457 16.35 10.2917 16.35 11.5C16.35 11.8167 16.3177 12.125 16.2531 12.425C16.1886 12.725 16.0917 13.0167 15.9625 13.3ZM19.05 16.3625L17.7125 15.05C18.3485 14.5667 18.9176 14.0292 19.4197 13.4375C19.9218 12.8458 20.3403 12.2 20.675 11.5C19.8584 9.83332 18.6709 8.51249 17.1125 7.53749C15.5542 6.56249 13.85 6.07499 12 6.07499C11.5167 6.07499 11.0396 6.1104 10.5688 6.18124C10.0979 6.25207 9.62919 6.35832 9.16252 6.49999L7.70002 5.03749C8.39169 4.75415 9.09591 4.54374 9.81267 4.40624C10.5294 4.26874 11.2585 4.19999 12 4.19999C14.2167 4.19999 16.25 4.78749 18.1 5.96249C19.95 7.13749 21.3625 8.71665 22.3375 10.7C22.4042 10.825 22.4521 10.9542 22.4813 11.0877C22.5104 11.2212 22.525 11.3586 22.525 11.5C22.525 11.6413 22.5125 11.7788 22.4875 11.9122C22.4625 12.0457 22.4209 12.1792 22.3625 12.3125C21.9875 13.1208 21.5188 13.8646 20.9563 14.5437C20.3938 15.2229 19.7584 15.8292 19.05 16.3625ZM12 18.8C9.81669 18.8 7.82502 18.2083 6.02502 17.025C4.22502 15.8417 2.79942 14.2901 1.74822 12.3702C1.66609 12.2401 1.60836 12.1013 1.57502 11.9539C1.54169 11.8064 1.52502 11.6552 1.52502 11.5C1.52502 11.3423 1.54077 11.1926 1.57225 11.0507C1.60373 10.9088 1.65882 10.7669 1.73752 10.625C2.07919 9.96665 2.46877 9.33332 2.90627 8.72499C3.34377 8.11665 3.84169 7.56665 4.40002 7.07499L2.32502 4.92499C2.15002 4.74054 2.06669 4.52151 2.07502 4.26791C2.08336 4.0143 2.17502 3.79999 2.35002 3.62499C2.52502 3.44999 2.74169 3.36249 3.00002 3.36249C3.25836 3.36249 3.47502 3.44999 3.65002 3.62499L20.3375 20.3125C20.5209 20.4958 20.6125 20.7167 20.6125 20.975C20.6125 21.2333 20.5167 21.4542 20.325 21.6375C20.1417 21.8125 19.9229 21.8979 19.6688 21.8937C19.4146 21.8896 19.2 21.8 19.025 21.625L15.5875 18.2375C15.0042 18.4208 14.4139 18.5604 13.8166 18.6562C13.2194 18.7521 12.6139 18.8 12 18.8ZM5.72502 8.37499C5.22502 8.80832 4.77086 9.2854 4.36252 9.80624C3.95419 10.3271 3.60836 10.8917 3.32502 11.5C4.14169 13.1667 5.32919 14.4875 6.88752 15.4625C8.44586 16.4375 10.15 16.925 12 16.925C12.3535 16.925 12.6981 16.9042 13.0339 16.8625C13.3696 16.8208 13.7084 16.7667 14.05 16.7L13.1 15.7C12.9167 15.75 12.7363 15.7875 12.5589 15.8125C12.3815 15.8375 12.1952 15.85 12 15.85C10.7917 15.85 9.76461 15.4271 8.91877 14.5812C8.07294 13.7354 7.65002 12.7083 7.65002 11.5C7.65002 11.3167 7.66252 11.1375 7.68752 10.9625C7.71252 10.7875 7.75002 10.6083 7.80002 10.425L5.72502 8.37499Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/EyeShow.tsx b/apps/scandic-web/components/Icons/EyeShow.tsx
deleted file mode 100644
index fc308c352..000000000
--- a/apps/scandic-web/components/Icons/EyeShow.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function EyeShowIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M12 15.85C13.2083 15.85 14.2354 15.4271 15.0812 14.5813C15.9271 13.7354 16.35 12.7083 16.35 11.5C16.35 10.2917 15.9271 9.2646 15.0812 8.41876C14.2354 7.57293 13.2083 7.15001 12 7.15001C10.7916 7.15001 9.76456 7.57293 8.91873 8.41876C8.07289 9.2646 7.64998 10.2917 7.64998 11.5C7.64998 12.7083 8.07289 13.7354 8.91873 14.5813C9.76456 15.4271 10.7916 15.85 12 15.85ZM12.0029 14.15C11.2676 14.15 10.6416 13.8927 10.125 13.378C9.60831 12.8632 9.34998 12.2382 9.34998 11.503C9.34998 10.7677 9.60733 10.1417 10.122 9.62501C10.6367 9.10835 11.2617 8.85001 11.997 8.85001C12.7323 8.85001 13.3583 9.10736 13.875 9.62206C14.3916 10.1368 14.65 10.7618 14.65 11.4971C14.65 12.2324 14.3926 12.8583 13.8779 13.375C13.3632 13.8917 12.7382 14.15 12.0029 14.15ZM12.0019 18.8C9.8256 18.8 7.83956 18.2125 6.04373 17.0375C4.24789 15.8625 2.82498 14.3167 1.77498 12.4C1.69164 12.2583 1.63123 12.1124 1.59373 11.9622C1.55623 11.812 1.53748 11.6578 1.53748 11.4997C1.53748 11.3416 1.55623 11.1875 1.59373 11.0375C1.63123 10.8875 1.69164 10.7417 1.77498 10.6C2.82498 8.68335 4.24727 7.13751 6.04185 5.96251C7.83645 4.78751 9.82187 4.20001 11.9981 4.20001C14.1744 4.20001 16.1604 4.78751 17.9562 5.96251C19.7521 7.13751 21.175 8.68335 22.225 10.6C22.3083 10.7417 22.3687 10.8876 22.4062 11.0378C22.4437 11.1881 22.4625 11.3422 22.4625 11.5003C22.4625 11.6585 22.4437 11.8125 22.4062 11.9625C22.3687 12.1125 22.3083 12.2583 22.225 12.4C21.175 14.3167 19.7527 15.8625 17.9581 17.0375C16.1635 18.2125 14.1781 18.8 12.0019 18.8ZM11.9999 16.925C13.8583 16.925 15.5646 16.4375 17.1187 15.4625C18.6729 14.4875 19.8583 13.1667 20.675 11.5C19.8583 9.83335 18.6729 8.51251 17.1188 7.53751C15.5647 6.56251 13.8584 6.07501 12 6.07501C10.1417 6.07501 8.43539 6.56251 6.88123 7.53751C5.32706 8.51251 4.14164 9.83335 3.32498 11.5C4.14164 13.1667 5.32704 14.4875 6.88118 15.4625C8.43529 16.4375 10.1415 16.925 11.9999 16.925Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Family.tsx b/apps/scandic-web/components/Icons/Family.tsx
deleted file mode 100644
index 3f0547be8..000000000
--- a/apps/scandic-web/components/Icons/Family.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function FamilyIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#1C1B1F"
-        d="M17.58 6.439c-.51 0-.947-.181-1.31-.545a1.785 1.785 0 0 1-.544-1.309c0-.51.181-.946.544-1.309.363-.363.8-.544 1.31-.544.509 0 .945.181 1.308.544.363.363.545.8.545 1.31s-.182.945-.545 1.308c-.363.364-.799.545-1.309.545Zm-.928 14.83v-7.415c0-.618-.158-1.174-.475-1.669a3.422 3.422 0 0 0-1.216-1.158l.811-2.387c.123-.386.351-.695.684-.927a1.917 1.917 0 0 1 1.123-.347c.417 0 .792.116 1.124.347.332.232.56.541.684.927l2.363 7.067h-2.317v5.561h-2.78Zm-4.17-9.732a1.34 1.34 0 0 1-.985-.406 1.34 1.34 0 0 1-.405-.985c0-.386.135-.714.405-.984s.598-.406.985-.406c.386 0 .714.135.985.406.27.27.405.598.405.984s-.135.715-.405.985-.6.406-.985.406ZM5.994 6.439c-.51 0-.946-.181-1.31-.545a1.785 1.785 0 0 1-.544-1.309c0-.51.182-.946.545-1.309.363-.363.8-.544 1.309-.544.51 0 .946.181 1.309.544.363.363.545.8.545 1.31s-.182.945-.545 1.308c-.363.364-.8.545-1.31.545ZM4.14 21.269V14.78H2.75V9.218c0-.51.182-.946.545-1.309.363-.363.799-.544 1.309-.544h2.78c.51 0 .946.181 1.31.544.362.363.544.8.544 1.31v5.56h-1.39v6.488H4.14Zm6.952 0V17.56h-.927v-3.707c0-.386.135-.715.405-.985s.599-.406.985-.406h1.854c.386 0 .714.136.984.406s.406.598.406.985v3.707h-.927v3.707h-2.78Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Fan.tsx b/apps/scandic-web/components/Icons/Fan.tsx
deleted file mode 100644
index 394d013f2..000000000
--- a/apps/scandic-web/components/Icons/Fan.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function FanIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M10.6 21.9375C9.77452 21.9375 9.14732 21.6875 8.7184 21.1875C8.28947 20.6875 8.07083 20.125 8.0625 19.5C8.0625 19.0833 8.15625 18.6729 8.34375 18.2688C8.53125 17.8646 8.82083 17.5333 9.2125 17.275C9.58665 17.0316 9.88852 16.7187 10.1181 16.3362C10.3477 15.9537 10.5083 15.5458 10.6 15.1125C10.4833 15.0542 10.3729 14.9979 10.2688 14.9438C10.1646 14.8896 10.0625 14.825 9.9625 14.75L7.63085 15.5856C7.34362 15.6869 7.0689 15.7708 6.8067 15.8375C6.5445 15.9042 6.27411 15.9375 5.99553 15.9375C4.96311 15.9375 4.0495 15.4843 3.2547 14.5778C2.4599 13.6714 2.0625 12.3454 2.0625 10.6C2.0625 9.775 2.30833 9.14583 2.8 8.7125C3.29167 8.27917 3.84807 8.0625 4.46922 8.0625C4.89422 8.0625 5.31105 8.15629 5.7197 8.34388C6.12837 8.53148 6.46347 8.82102 6.725 9.2125C6.96838 9.58665 7.28132 9.88852 7.6638 10.1181C8.04627 10.3477 8.45417 10.5083 8.8875 10.6C8.94583 10.4833 9.00208 10.3729 9.05625 10.2688C9.11042 10.1646 9.175 10.0625 9.25 9.9625L8.4125 7.625C8.3125 7.3482 8.22917 7.07955 8.1625 6.81905C8.09583 6.55853 8.0625 6.29802 8.0625 6.0375C8.07917 4.99583 8.53841 4.07292 9.44023 3.26875C10.342 2.46458 11.662 2.0625 13.4 2.0625C14.225 2.0625 14.8542 2.31025 15.2875 2.80575C15.7208 3.30125 15.9375 3.85767 15.9375 4.475C15.9375 4.89167 15.8438 5.30625 15.6562 5.71875C15.4688 6.13125 15.1792 6.46667 14.7875 6.725C14.4134 6.96838 14.1115 7.28132 13.8819 7.6638C13.6523 8.04627 13.4917 8.45417 13.4 8.8875C13.5167 8.94583 13.6271 9.00208 13.7312 9.05625C13.8354 9.11042 13.9375 9.175 14.0375 9.25L16.3692 8.38938C16.6564 8.28813 16.927 8.20833 17.181 8.15C17.435 8.09167 17.7013 8.0625 17.9799 8.0625C19.3073 8.0625 20.2987 8.6145 20.9543 9.7185C21.6098 10.8225 21.9375 12.0497 21.9375 13.4C21.9375 14.2255 21.6771 14.8527 21.1562 15.2816C20.6354 15.7105 20.0583 15.9292 19.425 15.9375C19.025 15.9375 18.6323 15.8437 18.2468 15.6561C17.8614 15.4685 17.5374 15.179 17.275 14.7875C17.0316 14.4134 16.7187 14.1115 16.3362 13.8819C15.9537 13.6523 15.5458 13.4917 15.1125 13.4C15.0542 13.5167 14.9979 13.6271 14.9438 13.7312C14.8896 13.8354 14.825 13.9375 14.75 14.0375L15.5875 16.375C15.6792 16.6333 15.7604 16.8896 15.8313 17.1438C15.9021 17.3979 15.9375 17.65 15.9375 17.9C15.9292 18.95 15.4751 19.8854 14.5753 20.7063C13.6756 21.5271 12.3505 21.9375 10.6 21.9375ZM11.9993 13.5625C12.4331 13.5625 12.8021 13.4107 13.1062 13.107C13.4104 12.8033 13.5625 12.4346 13.5625 12.0007C13.5625 11.5669 13.4107 11.1979 13.107 10.8938C12.8033 10.5896 12.4346 10.4375 12.0007 10.4375C11.5669 10.4375 11.1979 10.5893 10.8938 10.893C10.5896 11.1967 10.4375 11.5654 10.4375 11.9993C10.4375 12.4331 10.5893 12.8021 10.893 13.1062C11.1967 13.4104 11.5654 13.5625 11.9993 13.5625ZM10.8125 8.775C10.9292 8.73333 11.0488 8.7 11.1714 8.675C11.294 8.65 11.4119 8.62917 11.525 8.6125C11.6583 7.9125 11.9125 7.25833 12.2875 6.65C12.6625 6.04167 13.1542 5.54167 13.7625 5.15C13.8625 5.075 13.9375 4.98392 13.9875 4.87677C14.0375 4.76964 14.0625 4.63572 14.0625 4.475C14.0625 4.32412 14.0073 4.19682 13.8969 4.0931C13.7865 3.98937 13.6208 3.9375 13.4 3.9375C12.7544 3.9375 12.0243 4.07926 11.2095 4.36277C10.3948 4.64629 9.97083 5.20044 9.9375 6.02522C9.9375 6.17987 9.95833 6.32592 10 6.46337C10.0417 6.60084 10.0792 6.72972 10.1125 6.85L10.8125 8.775ZM6 14.0625C6.23333 14.0625 6.51667 14.0042 6.85 13.8875L8.775 13.1875C8.73333 13.0708 8.7 12.9512 8.675 12.8286C8.65 12.706 8.62917 12.5882 8.6125 12.475C7.9125 12.3417 7.25833 12.0875 6.65 11.7125C6.04167 11.3375 5.54167 10.8458 5.15 10.2375C5.075 10.1375 4.97708 10.0625 4.85625 10.0125C4.73542 9.9625 4.60833 9.9375 4.475 9.9375C4.30527 9.9375 4.17325 9.99271 4.07895 10.1031C3.98465 10.2135 3.9375 10.3792 3.9375 10.6C3.9375 11.5166 4.1125 12.3228 4.4625 13.0187C4.8125 13.7146 5.325 14.0625 6 14.0625ZM10.6 20.0625C11.3919 20.0625 12.1711 19.9021 12.9376 19.5813C13.7042 19.2604 14.0792 18.7042 14.0625 17.9125C14.0625 17.7701 14.0438 17.6366 14.0063 17.5119C13.9688 17.3873 13.9292 17.2667 13.8875 17.15L13.1875 15.225C13.0708 15.2667 12.9512 15.3 12.8286 15.325C12.706 15.35 12.5882 15.3708 12.475 15.3875C12.3417 16.0875 12.0875 16.7417 11.7125 17.35C11.3375 17.9583 10.8458 18.4583 10.2375 18.85C10.1375 18.925 10.0604 19.0229 10.0062 19.1438C9.95208 19.2646 9.92917 19.3875 9.9375 19.5125C9.95643 19.6592 10.0133 19.7875 10.108 19.8975C10.2027 20.0075 10.3667 20.0625 10.6 20.0625ZM19.42 14.0625C19.59 14.0625 19.7396 14.0165 19.8687 13.9245C19.9979 13.8325 20.0625 13.6576 20.0625 13.4C20.0625 12.755 19.9255 12.0209 19.6514 11.1977C19.3773 10.3745 18.8206 9.95447 17.9812 9.9375C17.8271 9.9375 17.6792 9.95417 17.5375 9.9875C17.3958 10.0208 17.2652 10.0547 17.1457 10.0892L15.225 10.8125C15.2667 10.9292 15.3 11.0488 15.325 11.1714C15.35 11.294 15.3708 11.4119 15.3875 11.525C16.0875 11.6583 16.7417 11.9125 17.35 12.2875C17.9583 12.6625 18.4583 13.1542 18.85 13.7625C18.9083 13.8542 18.9896 13.9271 19.0938 13.9812C19.1979 14.0354 19.3067 14.0625 19.42 14.0625Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/FilledHeart.tsx b/apps/scandic-web/components/Icons/FilledHeart.tsx
deleted file mode 100644
index f254dade7..000000000
--- a/apps/scandic-web/components/Icons/FilledHeart.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function FilledHeartIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="16"
-      height="16"
-      viewBox="0 0 16 16"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M8.00091 13.4171L7.23424 12.7255C6.1424 11.7524 5.24166 10.9189 4.53203 10.2249C3.82239 9.53081 3.26322 8.91489 2.85451 8.37709C2.44579 7.8393 2.16246 7.34774 2.00451 6.90241C1.84656 6.45708 1.76758 6.00088 1.76758 5.53379C1.76758 4.57813 2.09533 3.77255 2.75083 3.11704C3.40634 2.46154 4.21192 2.13379 5.16758 2.13379C5.70411 2.13379 6.22436 2.25046 6.72831 2.48379C7.23227 2.71712 7.65647 3.05046 8.00091 3.48379C8.36202 3.05046 8.7898 2.71712 9.28425 2.48379C9.77869 2.25046 10.2954 2.13379 10.8342 2.13379C11.7899 2.13379 12.5955 2.46154 13.251 3.11704C13.9065 3.77255 14.2342 4.57813 14.2342 5.53379C14.2342 6.00088 14.158 6.45153 14.0056 6.88574C13.8533 7.31996 13.5727 7.80319 13.164 8.33542C12.7553 8.86767 12.1933 9.48637 11.4781 10.1915C10.7629 10.8967 9.84831 11.7524 8.73425 12.7588L8.00091 13.4171Z"
-        fill="#B05B65"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Filter.tsx b/apps/scandic-web/components/Icons/Filter.tsx
deleted file mode 100644
index 4b715059d..000000000
--- a/apps/scandic-web/components/Icons/Filter.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function FilterIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M9.58789 15.8125C9.46046 15.8125 9.34813 15.7681 9.25091 15.6792C9.15368 15.5903 9.10507 15.4819 9.10507 15.3542V10.7292L4.33424 4.9375C4.21618 4.78472 4.19886 4.62153 4.28226 4.44792C4.36568 4.27431 4.508 4.1875 4.70924 4.1875H15.2926C15.4938 4.1875 15.6361 4.27431 15.7196 4.44792C15.803 4.62153 15.7856 4.78472 15.6676 4.9375L10.8967 10.7292V15.3542C10.8967 15.4819 10.8489 15.5903 10.7533 15.6792C10.6577 15.7681 10.5462 15.8125 10.4188 15.8125H9.58789ZM10.0009 9.625L13.3134 5.58333H6.66757L10.0009 9.625Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Fitness.tsx b/apps/scandic-web/components/Icons/Fitness.tsx
deleted file mode 100644
index 113a90fb0..000000000
--- a/apps/scandic-web/components/Icons/Fitness.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function FitnessIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M7.11239 8.42495L4.28739 11.25C4.10406 11.4333 3.88114 11.527 3.61864 11.5312C3.35614 11.5354 3.12906 11.4416 2.93739 11.25C2.75406 11.0666 2.66031 10.8437 2.65614 10.5812C2.65198 10.3187 2.74156 10.0916 2.92489 9.89995L3.66239 9.14995L2.97489 8.46245C2.78323 8.27078 2.68739 8.04995 2.68739 7.79995C2.68739 7.54995 2.78323 7.32912 2.97489 7.13745L4.39989 5.71245L3.68739 4.98745C3.51239 4.81245 3.42489 4.59787 3.42489 4.3437C3.42489 4.08953 3.51656 3.87078 3.69989 3.68745C3.87489 3.51245 4.08948 3.42287 4.34364 3.4187C4.59781 3.41453 4.81656 3.49995 4.99989 3.67495L5.72489 4.38745L7.14989 2.96245C7.34156 2.77078 7.56239 2.67495 7.81239 2.67495C8.06239 2.67495 8.28323 2.77078 8.4749 2.96245L9.1624 3.64995L9.9124 2.91245C10.0957 2.72912 10.3186 2.63745 10.5811 2.63745C10.8436 2.63745 11.0707 2.73328 11.2624 2.92495C11.4457 3.10828 11.5374 3.33328 11.5374 3.59995C11.5374 3.86662 11.4457 4.09162 11.2624 4.27495L8.43739 7.09995L16.8874 15.55L19.7124 12.725C19.8957 12.5416 20.1186 12.4479 20.3811 12.4437C20.6436 12.4395 20.8707 12.5333 21.0624 12.725C21.2457 12.9083 21.3395 13.1312 21.3436 13.3937C21.3478 13.6562 21.2582 13.8833 21.0749 14.075L20.3374 14.825L21.0249 15.5125C21.2166 15.7041 21.3124 15.925 21.3124 16.175C21.3124 16.425 21.2166 16.6458 21.0249 16.8375L19.5999 18.2625L20.3124 18.9875C20.4874 19.1625 20.5749 19.377 20.5749 19.6312C20.5749 19.8854 20.4832 20.1041 20.2999 20.2875C20.1249 20.4625 19.9103 20.552 19.6561 20.5562C19.402 20.5604 19.1832 20.475 18.9999 20.3L18.2749 19.5875L16.8499 21.0125C16.6582 21.2041 16.4374 21.3 16.1874 21.3C15.9374 21.3 15.7166 21.2041 15.5249 21.0125L14.8374 20.325L14.0874 21.0625C13.9041 21.2458 13.6811 21.3375 13.4186 21.3375C13.1561 21.3375 12.9291 21.2416 12.7374 21.05C12.5541 20.8666 12.4624 20.6416 12.4624 20.375C12.4624 20.1083 12.5541 19.8833 12.7374 19.7L15.5624 16.875L7.11239 8.42495Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Footstool.tsx b/apps/scandic-web/components/Icons/Footstool.tsx
deleted file mode 100644
index 6d7c6cc42..000000000
--- a/apps/scandic-web/components/Icons/Footstool.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function FootstoolIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M3.2251 19.8125V9.9444C3.2251 9.40648 3.41468 8.95211 3.79385 8.58127C4.17301 8.21044 4.63195 8.02502 5.17065 8.02502C14.2941 8.02502 15.6761 8.02502 18.8295 8.02502C19.3682 8.02502 19.8272 8.21044 20.2063 8.58127C20.5855 8.95211 20.7751 9.40648 20.7751 9.9444V19.8125C20.7751 20.0709 20.6834 20.2917 20.5001 20.475C20.3168 20.6584 20.0959 20.75 19.8376 20.75C19.5793 20.75 19.3584 20.6584 19.1751 20.475C18.9918 20.2917 18.9001 20.0709 18.9001 19.8125V14.8H5.1001V19.8125C5.1001 20.0709 5.00843 20.2917 4.8251 20.475C4.64176 20.6584 4.42093 20.75 4.1626 20.75C3.90426 20.75 3.68343 20.6584 3.5001 20.475C3.31676 20.2917 3.2251 20.0709 3.2251 19.8125ZM5.1001 12.925H18.9001V9.90003H5.1001V12.925Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Gallery.tsx b/apps/scandic-web/components/Icons/Gallery.tsx
deleted file mode 100644
index 005f539f2..000000000
--- a/apps/scandic-web/components/Icons/Gallery.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function GalleryIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M9.15 13.9H18.65L15.3725 9.625L13.1875 12.475L11.715 10.575L9.15 13.9ZM8.2 17.7C7.6775 17.7 7.23021 17.514 6.85813 17.1419C6.48604 16.7698 6.3 16.3225 6.3 15.8V4.4C6.3 3.8775 6.48604 3.43021 6.85813 3.05813C7.23021 2.68604 7.6775 2.5 8.2 2.5H19.6C20.1225 2.5 20.5698 2.68604 20.9419 3.05813C21.314 3.43021 21.5 3.8775 21.5 4.4V15.8C21.5 16.3225 21.314 16.7698 20.9419 17.1419C20.5698 17.514 20.1225 17.7 19.6 17.7H8.2ZM8.2 15.8H19.6V4.4H8.2V15.8ZM4.4 21.5C3.8775 21.5 3.43021 21.314 3.05813 20.9419C2.68604 20.5698 2.5 20.1225 2.5 19.6V6.3H4.4V19.6H17.7V21.5H4.4Z"
-        fill="white"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Garage.tsx b/apps/scandic-web/components/Icons/Garage.tsx
deleted file mode 100644
index 597c3e90b..000000000
--- a/apps/scandic-web/components/Icons/Garage.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function GarageIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.13745 21.75C3.62182 21.75 3.18041 21.5664 2.81323 21.1992C2.44604 20.832 2.26245 20.3906 2.26245 19.875V4.125C2.26245 3.60937 2.44604 3.16796 2.81323 2.80078C3.18041 2.43359 3.62182 2.25 4.13745 2.25H19.8875C20.4031 2.25 20.8445 2.43359 21.2117 2.80078C21.5789 3.16796 21.7625 3.60937 21.7625 4.125V19.875C21.7625 20.3906 21.5789 20.832 21.2117 21.1992C20.8445 21.5664 20.4031 21.75 19.8875 21.75H4.13745ZM4.13745 19.875H19.8875V4.125H4.13745V19.875ZM9.01508 13.95C8.74666 13.95 8.52078 13.8592 8.33745 13.6776C8.15412 13.4961 8.06245 13.2711 8.06245 13.0026C8.06245 12.7342 8.15324 12.5083 8.33483 12.325C8.51639 12.1417 8.74139 12.05 9.00983 12.05C9.27824 12.05 9.50412 12.1408 9.68745 12.3224C9.87078 12.5039 9.96245 12.7289 9.96245 12.9974C9.96245 13.2658 9.87166 13.4917 9.69008 13.675C9.50851 13.8583 9.28351 13.95 9.01508 13.95ZM15.0151 13.95C14.7467 13.95 14.5208 13.8592 14.3375 13.6776C14.1541 13.4961 14.0625 13.2711 14.0625 13.0026C14.0625 12.7342 14.1532 12.5083 14.3348 12.325C14.5164 12.1417 14.7414 12.05 15.0098 12.05C15.2782 12.05 15.5041 12.1408 15.6875 12.3224C15.8708 12.5039 15.9625 12.7289 15.9625 12.9974C15.9625 13.2658 15.8717 13.4917 15.6901 13.675C15.5085 13.8583 15.2835 13.95 15.0151 13.95ZM6.14995 18.325C6.40828 18.325 6.62912 18.2333 6.81245 18.05C6.99578 17.8667 7.08745 17.6458 7.08745 17.3875V16.35H16.9375V17.3875C16.9375 17.6458 17.0291 17.8667 17.2125 18.05C17.3958 18.2333 17.6166 18.325 17.875 18.325C18.1333 18.325 18.3541 18.2333 18.5375 18.05C18.7208 17.8667 18.8125 17.6458 18.8125 17.3875V11.4625C18.8125 11.3526 18.8041 11.2466 18.7875 11.1445C18.7708 11.0424 18.7458 10.9442 18.7125 10.85L17.375 6.9625C17.2416 6.5875 17.0145 6.28333 16.6937 6.05C16.3729 5.81667 16.0083 5.7 15.6 5.7H8.42495C8.01662 5.7 7.65203 5.81667 7.3312 6.05C7.01037 6.28333 6.78328 6.5875 6.64995 6.9625L5.31245 10.85C5.27912 10.9442 5.25412 11.0424 5.23745 11.1445C5.22078 11.2466 5.21245 11.3526 5.21245 11.4625V17.3875C5.21245 17.6458 5.30412 17.8667 5.48745 18.05C5.67078 18.2333 5.89162 18.325 6.14995 18.325ZM7.68745 9.65L8.41245 7.575H15.6125L16.3375 9.65H7.68745ZM7.08745 14.475V11.525H16.9375V14.475H7.08745Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Gift.tsx b/apps/scandic-web/components/Icons/Gift.tsx
deleted file mode 100644
index 09914ab54..000000000
--- a/apps/scandic-web/components/Icons/Gift.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function GiftIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4 22V11H2V5H7.2C7.11667 4.85 7.0625 4.69167 7.0375 4.525C7.0125 4.35833 7 4.18333 7 4C7 3.16667 7.29167 2.45833 7.875 1.875C8.45833 1.29167 9.16667 1 10 1C10.3833 1 10.7417 1.07083 11.075 1.2125C11.4083 1.35417 11.7167 1.55 12 1.8C12.2833 1.53333 12.5917 1.33333 12.925 1.2C13.2583 1.06667 13.6167 1 14 1C14.8333 1 15.5417 1.29167 16.125 1.875C16.7083 2.45833 17 3.16667 17 4C17 4.18333 16.9833 4.35417 16.95 4.5125C16.9167 4.67083 16.8667 4.83333 16.8 5H22V11H20V22H4ZM14 3C13.7167 3 13.4792 3.09583 13.2875 3.2875C13.0958 3.47917 13 3.71667 13 4C13 4.28333 13.0958 4.52083 13.2875 4.7125C13.4792 4.90417 13.7167 5 14 5C14.2833 5 14.5208 4.90417 14.7125 4.7125C14.9042 4.52083 15 4.28333 15 4C15 3.71667 14.9042 3.47917 14.7125 3.2875C14.5208 3.09583 14.2833 3 14 3ZM9 4C9 4.28333 9.09583 4.52083 9.2875 4.7125C9.47917 4.90417 9.71667 5 10 5C10.2833 5 10.5208 4.90417 10.7125 4.7125C10.9042 4.52083 11 4.28333 11 4C11 3.71667 10.9042 3.47917 10.7125 3.2875C10.5208 3.09583 10.2833 3 10 3C9.71667 3 9.47917 3.09583 9.2875 3.2875C9.09583 3.47917 9 3.71667 9 4ZM4 7V9H11V7H4ZM11 20V11H6V20H11ZM13 20H18V11H13V20ZM20 9V7H13V9H20Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Globe.tsx b/apps/scandic-web/components/Icons/Globe.tsx
deleted file mode 100644
index 16bda388e..000000000
--- a/apps/scandic-web/components/Icons/Globe.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function GlobeIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M11.994 21.75C10.6563 21.75 9.39542 21.4945 8.21127 20.9835C7.02714 20.4726 5.99304 19.7751 5.10897 18.891C4.22492 18.007 3.52742 16.9729 3.01645 15.7887C2.50548 14.6046 2.25 13.3437 2.25 12.006C2.25 10.652 2.50548 9.38608 3.01645 8.20825C3.52742 7.0304 4.22492 5.99877 5.10897 5.11337C5.99304 4.22796 7.02714 3.52938 8.21127 3.01763C9.39542 2.50588 10.6563 2.25 11.994 2.25C13.348 2.25 14.6139 2.50594 15.7917 3.01783C16.9696 3.52969 18.0012 4.22843 18.8866 5.11405C19.772 5.99968 20.4706 7.03157 20.9824 8.2097C21.4941 9.38782 21.75 10.6512 21.75 12C21.75 13.3417 21.4941 14.6046 20.9824 15.7887C20.4706 16.9729 19.772 18.007 18.8866 18.891C18.0012 19.7751 16.9696 20.4726 15.7917 20.9835C14.6139 21.4945 13.348 21.75 11.994 21.75ZM12 19.9C12.4435 19.2868 12.8273 18.6481 13.1514 17.9839C13.4755 17.3196 13.7375 16.6167 13.9375 15.875H10.0625C10.2625 16.6167 10.5245 17.3196 10.8486 17.9839C11.1727 18.6481 11.5565 19.2868 12 19.9ZM9.55 19.475C9.23333 18.9 8.95625 18.3146 8.71875 17.7188C8.48125 17.1229 8.28673 16.5083 8.1352 15.875H5.1625C5.64583 16.7333 6.25833 17.4688 7 18.0813C7.74167 18.6938 8.59167 19.1583 9.55 19.475ZM14.45 19.475C15.4083 19.1583 16.2583 18.6938 17 18.0813C17.7417 17.4688 18.3542 16.7333 18.8375 15.875H15.8648C15.7133 16.5083 15.5188 17.1229 15.2812 17.7188C15.0437 18.3146 14.7667 18.9 14.45 19.475ZM4.3875 14H7.75C7.7 13.6583 7.6625 13.325 7.6375 13C7.6125 12.675 7.6 12.3417 7.6 12C7.6 11.6583 7.6125 11.325 7.6375 11C7.6625 10.675 7.7 10.3417 7.75 10H4.3875C4.29583 10.3417 4.22917 10.6737 4.1875 10.996C4.14583 11.3182 4.125 11.6529 4.125 12C4.125 12.3471 4.14583 12.6818 4.1875 13.0041C4.22917 13.3264 4.29583 13.6583 4.3875 14ZM9.6375 14H14.3625C14.4208 13.6583 14.4625 13.3264 14.4875 13.0041C14.5125 12.6818 14.525 12.3471 14.525 12C14.525 11.6529 14.5125 11.3182 14.4875 10.996C14.4625 10.6737 14.4208 10.3417 14.3625 10H9.6375C9.57917 10.3417 9.5375 10.6737 9.5125 10.996C9.4875 11.3182 9.475 11.6529 9.475 12C9.475 12.3471 9.4875 12.6818 9.5125 13.0041C9.5375 13.3264 9.57917 13.6583 9.6375 14ZM16.25 14H19.6125C19.7042 13.6583 19.7708 13.3264 19.8125 13.0041C19.8542 12.6818 19.875 12.3471 19.875 12C19.875 11.6529 19.8542 11.3182 19.8125 10.996C19.7708 10.6737 19.7042 10.3417 19.6125 10H16.25C16.3 10.3417 16.3375 10.675 16.3625 11C16.3875 11.325 16.4 11.6583 16.4 12C16.4 12.3417 16.3875 12.675 16.3625 13C16.3375 13.325 16.3 13.6583 16.25 14ZM15.8648 8.125H18.8375C18.3542 7.26667 17.7417 6.53125 17 5.91875C16.2583 5.30625 15.4083 4.84167 14.45 4.525C14.7667 5.1 15.0437 5.68542 15.2812 6.28125C15.5188 6.87708 15.7133 7.49167 15.8648 8.125ZM10.0625 8.125H13.9375C13.7375 7.38333 13.4755 6.68038 13.1514 6.01613C12.8273 5.35186 12.4435 4.71315 12 4.1C11.5565 4.71315 11.1727 5.35186 10.8486 6.01613C10.5245 6.68038 10.2625 7.38333 10.0625 8.125ZM5.1625 8.125H8.1352C8.28673 7.49167 8.48125 6.87708 8.71875 6.28125C8.95625 5.68542 9.23333 5.1 9.55 4.525C8.59167 4.84167 7.74167 5.30625 7 5.91875C6.25833 6.53125 5.64583 7.26667 5.1625 8.125Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Golf.tsx b/apps/scandic-web/components/Icons/Golf.tsx
deleted file mode 100644
index a685ea440..000000000
--- a/apps/scandic-web/components/Icons/Golf.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function GolfIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M19.4 20.8C19.0041 20.8 18.6677 20.6614 18.3906 20.3844C18.1135 20.1073 17.975 19.7708 17.975 19.375C17.975 18.9792 18.1135 18.6427 18.3906 18.3656C18.6677 18.0885 19.0041 17.95 19.4 17.95C19.7958 17.95 20.1322 18.0885 20.4093 18.3656C20.6864 18.6427 20.825 18.9792 20.825 19.375C20.825 19.7708 20.6864 20.1073 20.4093 20.3844C20.1322 20.6614 19.7958 20.8 19.4 20.8ZM10.0625 21.8C8.42912 21.8 7.0437 21.6104 5.9062 21.2312C4.7687 20.8521 4.19995 20.3998 4.19995 19.8743C4.19995 19.5081 4.47703 19.1792 5.0312 18.8875C5.58537 18.5958 6.29995 18.3667 7.17495 18.2V18.95C7.17495 19.2262 7.26826 19.4578 7.45488 19.6447C7.64151 19.8316 7.87276 19.925 8.14863 19.925C8.42451 19.925 8.6562 19.8316 8.8437 19.6447C9.0312 19.4578 9.12495 19.2262 9.12495 18.95V3.72499C9.12495 3.37082 9.27287 3.10519 9.5687 2.92811C9.86453 2.75103 10.1666 2.73749 10.475 2.88749L15.175 5.17499C15.5333 5.3463 15.7125 5.62663 15.7125 6.01596C15.7125 6.40531 15.5375 6.68749 15.1875 6.86249L11 9.02054V18C12.4083 18.0833 13.5812 18.2979 14.5187 18.6437C15.4562 18.9896 15.925 19.4006 15.925 19.8768C15.925 20.4006 15.352 20.8521 14.2062 21.2312C13.0604 21.6104 11.6791 21.8 10.0625 21.8Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Groceries.tsx b/apps/scandic-web/components/Icons/Groceries.tsx
deleted file mode 100644
index 69410ed29..000000000
--- a/apps/scandic-web/components/Icons/Groceries.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function GroceriesIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M15.9265 21.75C14.3088 21.75 12.9333 21.1838 11.8 20.0515C10.6667 18.9191 10.1 17.5441 10.1 15.9265C10.1 14.3088 10.6662 12.9333 11.7985 11.8C12.9309 10.6667 14.3059 10.1 15.9235 10.1C17.5412 10.1 18.9167 10.6662 20.05 11.7985C21.1833 12.9309 21.75 14.3059 21.75 15.9235C21.75 17.5412 21.1838 18.9167 20.0515 20.05C18.9191 21.1833 17.5441 21.75 15.9265 21.75ZM15.925 19.875C17.0167 19.875 17.9479 19.4896 18.7188 18.7188C19.4896 17.9479 19.875 17.0167 19.875 15.925C19.875 14.8333 19.4896 13.9021 18.7188 13.1313C17.9479 12.3604 17.0167 11.975 15.925 11.975C14.8333 11.975 13.9021 12.3604 13.1313 13.1313C12.3604 13.9021 11.975 14.8333 11.975 15.925C11.975 17.0167 12.3604 17.9479 13.1313 18.7188C13.9021 19.4896 14.8333 19.875 15.925 19.875ZM4.125 19.8C3.60937 19.8 3.16796 19.6164 2.80077 19.2492C2.43359 18.882 2.25 18.4406 2.25 17.925V10.4955C2.25 10.3652 2.26667 10.225 2.3 10.075C2.33333 9.925 2.3747 9.78368 2.4241 9.65105L4.4 5.075H4.2C3.93083 5.075 3.70521 4.98396 3.52313 4.80188C3.34104 4.61979 3.25 4.39417 3.25 4.125V3.19518C3.25 2.93173 3.34104 2.70833 3.52313 2.525C3.70521 2.34167 3.93083 2.25 4.2 2.25H10.95C11.2192 2.25 11.4448 2.34104 11.6269 2.52312C11.809 2.70521 11.9 2.93083 11.9 3.2V4.12982C11.9 4.39327 11.809 4.61667 11.6269 4.8C11.4448 4.98333 11.2192 5.075 10.95 5.075H10.725L12.475 9.05C12.1917 9.2 11.9125 9.36458 11.6375 9.54375C11.3625 9.72292 11.1125 9.91667 10.8875 10.125L8.7 5.075H6.425L4.125 10.45V17.925H8.4875C8.56705 18.2496 8.67443 18.5703 8.80965 18.8872C8.94488 19.2041 9.10417 19.5083 9.2875 19.8H4.125ZM15.925 9.1C15.26 9.1 14.6979 8.87025 14.2387 8.41075C13.7796 7.95123 13.55 7.38873 13.55 6.72325C13.55 6.05775 13.7796 5.49583 14.2387 5.0375C14.6979 4.57917 15.26 4.35 15.925 4.35V9.1C15.925 8.435 16.1546 7.87292 16.6137 7.41375C17.0729 6.95458 17.635 6.725 18.3 6.725C18.965 6.725 19.5271 6.95458 19.9862 7.41375C20.4454 7.87292 20.675 8.435 20.675 9.1H15.925Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/HandSoap.tsx b/apps/scandic-web/components/Icons/HandSoap.tsx
deleted file mode 100644
index 70efe77f0..000000000
--- a/apps/scandic-web/components/Icons/HandSoap.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function HandSoapIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M8.93432 2.50091C8.93432 2.01716 9.32648 1.625 9.81023 1.625H15.6496C16.2691 1.625 16.8632 1.87109 17.3013 2.30913C17.7393 2.74717 17.9854 3.34128 17.9854 3.96077C17.9854 4.44452 17.5933 4.83668 17.1095 4.83668C16.6257 4.83668 16.2336 4.44452 16.2336 3.96077C16.2336 3.8059 16.1721 3.65737 16.0626 3.54786C15.953 3.43835 15.8045 3.37682 15.6496 3.37682H12.8759V5.6396H14.1898C15.0029 5.6396 15.7826 5.96259 16.3576 6.53752C16.9325 7.11245 17.2555 7.89222 17.2555 8.70529V9.39167C17.9345 9.55274 18.562 9.89942 19.0635 10.4009C19.7753 11.1128 20.1752 12.0782 20.1752 13.0849V20.0192C20.1752 20.4451 20.006 20.8535 19.7049 21.1547C19.4037 21.4558 18.9952 21.625 18.5694 21.625H5.43067C5.00477 21.625 4.59632 21.4558 4.29517 21.1547C3.99402 20.8535 3.82483 20.4451 3.82483 20.0192V13.0849C3.82483 12.0782 4.22472 11.1128 4.93654 10.4009C5.43807 9.89942 6.0655 9.55274 6.74454 9.39167V8.70529C6.74454 7.89222 7.06753 7.11245 7.64246 6.53752C8.21739 5.96259 8.99716 5.6396 9.81023 5.6396H11.1241V3.37682H9.81023C9.32648 3.37682 8.93432 2.98467 8.93432 2.50091ZM9.81023 7.39142C9.46177 7.39142 9.12758 7.52985 8.88119 7.77625C8.63479 8.02264 8.49636 8.35683 8.49636 8.70529V9.28923H15.5037V8.70529C15.5037 8.35683 15.3652 8.02264 15.1188 7.77625C14.8724 7.52985 14.5383 7.39142 14.1898 7.39142H9.81023ZM7.62045 11.0411C7.0784 11.0411 6.55855 11.2564 6.17527 11.6397C5.79198 12.023 5.57665 12.5428 5.57665 13.0849V19.8732H18.4234V13.0849C18.4234 12.5428 18.208 12.023 17.8248 11.6397C17.4415 11.2564 16.9216 11.0411 16.3796 11.0411H7.62045Z"
-        fill="black"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Hanger.tsx b/apps/scandic-web/components/Icons/Hanger.tsx
deleted file mode 100644
index e75ac5489..000000000
--- a/apps/scandic-web/components/Icons/Hanger.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function HangerIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6 17.875H18L12 13.425L6 17.875ZM10.625 7.0125C10.5473 7.18483 10.4346 7.32583 10.287 7.4355C10.1394 7.54517 9.96453 7.6 9.7625 7.6C9.50417 7.6 9.28333 7.50833 9.1 7.325C8.91667 7.14167 8.825 6.92121 8.825 6.66362C8.825 6.58787 8.82917 6.52083 8.8375 6.4625C8.84583 6.40417 8.86667 6.34167 8.9 6.275C9.175 5.66667 9.59388 5.17708 10.1566 4.80625C10.7194 4.43542 11.3384 4.25 12.0137 4.25C12.9462 4.25 13.7417 4.57292 14.4 5.21875C15.0583 5.86458 15.3875 6.65598 15.3875 7.59295C15.3875 8.35222 15.1625 9.03071 14.7125 9.62843C14.2625 10.2261 13.6708 10.6375 12.9375 10.8625V11.775L21.375 18.0625C21.5 18.142 21.5938 18.2494 21.6562 18.3847C21.7188 18.5199 21.75 18.6631 21.75 18.8143C21.75 19.0714 21.6583 19.2917 21.475 19.475C21.2917 19.6583 21.0708 19.75 20.8125 19.75H3.1875C2.92917 19.75 2.70833 19.6583 2.525 19.475C2.34167 19.2917 2.25 19.0714 2.25 18.8143C2.25 18.6631 2.28333 18.5208 2.35 18.3875C2.41667 18.2542 2.50833 18.1458 2.625 18.0625L11.0625 11.7698V10.0625C11.0625 9.79687 11.1564 9.57421 11.3442 9.39453C11.532 9.21484 11.759 9.125 12.025 9.125C12.45 9.125 12.8042 8.975 13.0875 8.675C13.3708 8.375 13.5125 8.0125 13.5125 7.5875C13.5125 7.17917 13.3667 6.83333 13.075 6.55C12.7833 6.26667 12.4292 6.125 12.0125 6.125C11.7125 6.125 11.4375 6.20208 11.1875 6.35625C10.9375 6.51042 10.75 6.72917 10.625 7.0125Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/HangerAlt.tsx b/apps/scandic-web/components/Icons/HangerAlt.tsx
deleted file mode 100644
index 67167cd8c..000000000
--- a/apps/scandic-web/components/Icons/HangerAlt.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function HangerAltIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M7.1375 21.75V15.875H5.5375C4.90208 15.875 4.36198 15.651 3.9172 15.203C3.4724 14.755 3.25 14.211 3.25 13.571C3.25 13.107 3.37758 12.6792 3.63275 12.2876C3.88793 11.896 4.22285 11.6043 4.6375 11.4125L11.0625 8.5625V7.875C10.4708 7.675 9.99583 7.32766 9.6375 6.83297C9.27917 6.33829 9.1 5.78278 9.1 5.16645C9.1 4.35548 9.38309 3.66667 9.94928 3.1C10.5154 2.53333 11.2029 2.25 12.0118 2.25C12.8206 2.25 13.5083 2.53316 14.075 3.09948C14.6417 3.66579 14.925 4.35347 14.925 5.1625H13.05C13.05 4.87083 12.9508 4.625 12.7524 4.425C12.554 4.225 12.3082 4.125 12.0149 4.125C11.7216 4.125 11.475 4.22443 11.275 4.42328C11.075 4.62213 10.975 4.86853 10.975 5.1625C10.975 5.44938 11.0771 5.68985 11.2812 5.8839C11.4854 6.07797 11.7292 6.175 12.0125 6.175C12.2746 6.175 12.4943 6.26365 12.6715 6.44095C12.8489 6.61823 12.9375 6.83792 12.9375 7.1V8.5625L19.35 11.4125C19.775 11.6042 20.1146 11.8958 20.3687 12.2875C20.6229 12.6792 20.75 13.107 20.75 13.571C20.75 14.211 20.5276 14.755 20.0828 15.203C19.638 15.651 19.0979 15.875 18.4625 15.875H16.85V21.75H7.1375ZM5.5375 14H7.1375V13.025H16.85V14H18.4625C18.5875 14 18.6875 13.9542 18.7625 13.8625C18.8375 13.7708 18.875 13.6583 18.875 13.525C18.875 13.4313 18.85 13.3516 18.8 13.2859C18.75 13.2203 18.6843 13.1712 18.603 13.1387L12.0125 10.2125L5.38523 13.1387C5.30341 13.1712 5.23958 13.2229 5.19375 13.2937C5.14792 13.3646 5.125 13.4417 5.125 13.525C5.125 13.6583 5.1625 13.7708 5.2375 13.8625C5.3125 13.9542 5.4125 14 5.5375 14ZM9.0125 19.875H14.975V14.9H9.0125V19.875Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/HealthBeauty.tsx b/apps/scandic-web/components/Icons/HealthBeauty.tsx
deleted file mode 100644
index 90e505325..000000000
--- a/apps/scandic-web/components/Icons/HealthBeauty.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function HealthBeautyIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M6.125 21.75c-.516 0-.957-.184-1.324-.55a1.806 1.806 0 0 1-.551-1.325V4.125c0-.516.184-.957.55-1.324.368-.367.81-.551 1.325-.551h12.688c.258 0 .479.092.662.275a.903.903 0 0 1 .275.663c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275h-1.05v1.876a.937.937 0 0 1-.287.686.938.938 0 0 1-.688.288h-7.7a.938.938 0 0 1-.687-.287A.937.937 0 0 1 8.113 6V4.125H6.125v15.75h3.988a4.853 4.853 0 0 1-1.463-1.656c-.358-.663-.537-1.402-.537-2.219v-2.975c0-.516.183-.957.55-1.324.367-.367.809-.551 1.325-.551h5.9c.515 0 .957.184 1.324.55.367.368.55.81.55 1.325V16c0 .817-.179 1.556-.537 2.219a4.852 4.852 0 0 1-1.463 1.656h3.05c.259 0 .48.092.663.275a.903.903 0 0 1 .275.663c0 .258-.092.479-.275.662a.903.903 0 0 1-.663.275H6.126Zm6.81-2.8a2.85 2.85 0 0 0 2.09-.86c.575-.574.862-1.27.862-2.09v-2.975h-5.9V16c0 .82.287 1.516.86 2.09a2.84 2.84 0 0 0 2.088.86Zm.001-8.9a.947.947 0 0 0 .695-.28.94.94 0 0 0 .281-.694.947.947 0 0 0-.28-.695.94.94 0 0 0-.693-.281.946.946 0 0 0-.695.28.94.94 0 0 0-.281.694c0 .276.093.507.28.695a.94.94 0 0 0 .693.281Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Heart.tsx b/apps/scandic-web/components/Icons/Heart.tsx
deleted file mode 100644
index 3f191732e..000000000
--- a/apps/scandic-web/components/Icons/Heart.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function HeartIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M12 20.0875C11.775 20.0875 11.5521 20.0479 11.3313 19.9687C11.1104 19.8896 10.9125 19.7666 10.7375 19.6L9.1625 18.1625C7.3625 16.5208 5.76042 14.9125 4.35625 13.3375C2.95208 11.7625 2.25 10.0416 2.25 8.17498C2.25 6.65816 2.75865 5.39145 3.77595 4.37485C4.79327 3.35827 6.06087 2.84998 7.57875 2.84998C8.43458 2.84998 9.24792 3.03539 10.0188 3.40623C10.7896 3.77706 11.45 4.29998 12 4.97498C12.5667 4.29998 13.231 3.77706 13.993 3.40623C14.755 3.03539 15.5657 2.84998 16.425 2.84998C17.9418 2.84998 19.2085 3.35827 20.2251 4.37485C21.2417 5.39145 21.75 6.65816 21.75 8.17498C21.75 10.0416 21.05 11.7646 19.65 13.3437C18.25 14.9229 16.6458 16.5291 14.8375 18.1625L13.2625 19.6C13.0875 19.7666 12.8896 19.8896 12.6687 19.9687C12.4479 20.0479 12.225 20.0875 12 20.0875ZM11.107 6.89753C10.6773 6.20749 10.1729 5.67289 9.59375 5.29373C9.01458 4.91456 8.33962 4.72498 7.56885 4.72498C6.5849 4.72498 5.76493 5.05206 5.10895 5.70623C4.45298 6.36039 4.125 7.18202 4.125 8.1711C4.125 9.0283 4.42917 9.93908 5.0375 10.9035C5.64583 11.8678 6.37083 12.8041 7.2125 13.7125C8.05417 14.6208 8.92083 15.4687 9.8125 16.2562C10.7042 17.0437 11.4333 17.6916 12 18.2C12.5667 17.6916 13.2958 17.0437 14.1875 16.2562C15.0792 15.4687 15.9458 14.6208 16.7875 13.7125C17.6292 12.8041 18.3542 11.8678 18.9625 10.9035C19.5708 9.93908 19.875 9.0283 19.875 8.1711C19.875 7.18202 19.547 6.36039 18.8911 5.70623C18.2351 5.05206 17.4151 4.72498 16.4311 4.72498C15.6604 4.72498 14.9833 4.91456 14.4 5.29373C13.8167 5.67289 13.3102 6.20749 12.8805 6.89753C12.7768 7.06583 12.6466 7.18956 12.4899 7.26873C12.3331 7.34789 12.1685 7.38748 11.9961 7.38748C11.8237 7.38748 11.6583 7.34789 11.5 7.26873C11.3417 7.18956 11.2107 7.06583 11.107 6.89753Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Heat.tsx b/apps/scandic-web/components/Icons/Heat.tsx
deleted file mode 100644
index f2c2a4318..000000000
--- a/apps/scandic-web/components/Icons/Heat.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function HeatIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M13.25 20.4875C13.1583 20.5708 13.0583 20.6333 12.95 20.675C12.8417 20.7167 12.7271 20.7375 12.6063 20.7375C12.4854 20.7375 12.3629 20.7106 12.2386 20.6567C12.1144 20.6029 12.0057 20.5298 11.9125 20.4375C11.2505 19.7277 10.7621 19.0018 10.4473 18.2597C10.1324 17.5176 9.975 16.7352 9.975 15.9125C9.975 15.314 10.0625 14.6831 10.2375 14.0199C10.4125 13.3566 10.7208 12.4917 11.1625 11.425C11.5375 10.5167 11.7979 9.81043 11.9437 9.3063C12.0896 8.80217 12.1625 8.33523 12.1625 7.90548C12.1625 7.34349 12.0395 6.81942 11.7936 6.33327C11.5476 5.84714 11.1622 5.35688 10.6375 4.8625C10.5458 4.77083 10.4771 4.66667 10.4313 4.55C10.3854 4.43333 10.3625 4.3125 10.3625 4.1875C10.3625 4.0625 10.3833 3.94583 10.425 3.8375C10.4667 3.72917 10.5254 3.62917 10.6011 3.5375C10.692 3.44583 10.7973 3.375 10.9169 3.325C11.0364 3.275 11.16 3.25 11.2875 3.25C11.4042 3.25 11.5187 3.27083 11.6312 3.3125C11.7438 3.35417 11.8458 3.41667 11.9375 3.5C12.6455 4.16247 13.1726 4.85725 13.5185 5.58435C13.8645 6.31145 14.0375 7.08267 14.0375 7.898C14.0375 8.46873 13.9521 9.068 13.7812 9.6958C13.6104 10.3236 13.3168 11.1372 12.9005 12.1367C12.5002 13.1039 12.225 13.851 12.075 14.3781C11.925 14.9052 11.85 15.4076 11.85 15.8853C11.85 16.4618 11.9688 17.0167 12.2063 17.5501C12.4439 18.0834 12.8085 18.6209 13.3 19.1625C13.3833 19.2542 13.4458 19.3563 13.4875 19.4688C13.5292 19.5812 13.55 19.6979 13.55 19.8188C13.55 19.9396 13.525 20.0583 13.475 20.175C13.425 20.2917 13.35 20.3958 13.25 20.4875ZM17.9635 20.5C17.8712 20.5833 17.7729 20.6437 17.6687 20.6812C17.5646 20.7188 17.4521 20.7375 17.3313 20.7375C17.2104 20.7375 17.0879 20.7117 16.9636 20.6601C16.8394 20.6085 16.7307 20.5385 16.6375 20.45C15.9792 19.7417 15.4917 19.0177 15.175 18.278C14.8583 17.5384 14.7 16.7541 14.7 15.925C14.7 15.325 14.7875 14.6896 14.9625 14.0188C15.1375 13.3479 15.4458 12.4833 15.8875 11.425C16.2625 10.5167 16.5208 9.81458 16.6625 9.31875C16.8042 8.82292 16.875 8.36014 16.875 7.93042C16.875 7.36847 16.7542 6.83958 16.5125 6.34375C16.2708 5.84792 15.8875 5.35833 15.3625 4.875C15.2708 4.7804 15.2021 4.67398 15.1562 4.55575C15.1104 4.4375 15.0875 4.31532 15.0875 4.1892C15.0875 4.06307 15.1062 3.94792 15.1438 3.84375C15.1813 3.73958 15.2398 3.64167 15.3193 3.55C15.4148 3.45833 15.524 3.38542 15.6469 3.33125C15.7698 3.27708 15.8927 3.25 16.0156 3.25C16.1385 3.25 16.2542 3.27292 16.3625 3.31875C16.4708 3.36458 16.5708 3.42917 16.6625 3.5125C17.3708 4.17083 17.8958 4.86428 18.2375 5.59285C18.5792 6.32143 18.75 7.09048 18.75 7.9C18.75 8.46667 18.6667 9.06667 18.5 9.7C18.3333 10.3333 18.0417 11.15 17.625 12.15C17.225 13.125 16.95 13.8763 16.8 14.4038C16.65 14.9313 16.575 15.4259 16.575 15.8875C16.575 16.4708 16.6958 17.0333 16.9375 17.575C17.1792 18.1167 17.5458 18.65 18.0375 19.175C18.1208 19.2667 18.1812 19.3681 18.2188 19.4792C18.2563 19.5903 18.275 19.7014 18.275 19.8125C18.275 19.9458 18.25 20.0729 18.2 20.1938C18.15 20.3146 18.0712 20.4167 17.9635 20.5ZM8.5202 20.5C8.43173 20.5833 8.33333 20.6458 8.225 20.6875C8.11667 20.7292 8.00208 20.75 7.88125 20.75C7.76042 20.75 7.63788 20.7231 7.51363 20.6692C7.38939 20.6154 7.28068 20.5423 7.1875 20.45C6.52917 19.7417 6.04167 19.0177 5.725 18.278C5.40833 17.5384 5.25 16.7541 5.25 15.925C5.25 15.325 5.33958 14.6896 5.51875 14.0188C5.69792 13.3479 6.00417 12.4833 6.4375 11.425C6.8125 10.5167 7.07292 9.81458 7.21875 9.31875C7.36458 8.82292 7.4375 8.36014 7.4375 7.93042C7.4375 7.36847 7.31458 6.83958 7.06875 6.34375C6.82292 5.84792 6.44167 5.35833 5.925 4.875C5.825 4.78333 5.75 4.67903 5.7 4.5621C5.65 4.44517 5.625 4.32433 5.625 4.1996C5.625 4.07487 5.64583 3.95833 5.6875 3.85C5.72917 3.74167 5.79167 3.6375 5.875 3.5375C5.96667 3.44583 6.07228 3.375 6.19185 3.325C6.31142 3.275 6.43497 3.25 6.5625 3.25C6.67917 3.25 6.79375 3.27083 6.90625 3.3125C7.01875 3.35417 7.12083 3.41667 7.2125 3.5C7.92055 4.16445 8.44756 4.85727 8.79352 5.57845C9.13951 6.29963 9.3125 7.07348 9.3125 7.9C9.3125 8.4599 9.23125 9.04779 9.06875 9.66367C8.90625 10.2796 8.61667 11.1042 8.2 12.1375C7.8 13.0875 7.525 13.8292 7.375 14.3625C7.225 14.8958 7.15 15.4042 7.15 15.8875C7.15 16.4708 7.26667 17.0333 7.5 17.575C7.73333 18.1167 8.09583 18.65 8.5875 19.175C8.67083 19.2667 8.73125 19.3678 8.76875 19.4785C8.80625 19.5891 8.825 19.6997 8.825 19.8104C8.825 19.9368 8.8 20.0625 8.75 20.1875C8.7 20.3125 8.6234 20.4167 8.5202 20.5Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/House.tsx b/apps/scandic-web/components/Icons/House.tsx
deleted file mode 100644
index 2fa747d57..000000000
--- a/apps/scandic-web/components/Icons/House.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function HouseIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M8.94115 2.45616C9.5571 1.95928 10.4429 1.95928 11.0589 2.45616L18.1933 8.21144C18.5507 8.49973 18.6034 9.01907 18.311 9.37142C18.0186 9.72377 17.4919 9.7757 17.1345 9.48741L16.4095 8.9026V17.0924C16.4095 17.5477 16.0352 17.9168 15.5735 17.9168H4.42596C3.96421 17.9168 3.58989 17.5477 3.58989 17.0924V16.2681V8.90307L2.86551 9.48741C2.50814 9.7757 1.98141 9.72377 1.68901 9.37142C1.39662 9.01907 1.44929 8.49973 1.80666 8.21144L8.94115 2.45616ZM5.17626 7.62337C5.23117 7.73317 5.26202 7.85676 5.26202 7.98746V15.4438C5.26202 15.8991 5.63634 16.2681 6.09808 16.2681H7.07363V11.0476C7.07363 10.1371 7.82227 9.39897 8.74575 9.39897H11.2539C12.1774 9.39897 12.9261 10.1371 12.9261 11.0476V16.2681H13.9013C14.3631 16.2681 14.7374 15.8991 14.7374 15.4438V7.98746C14.7374 7.85663 14.7683 7.73292 14.8233 7.62304L10 3.73213L5.17626 7.62337ZM11.2539 16.2681V11.0476L8.74575 11.0476V16.2681H11.2539Z"
-        fill="#8F4350"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/IconByIconName.tsx b/apps/scandic-web/components/Icons/IconByIconName.tsx
new file mode 100644
index 000000000..e03b0eba6
--- /dev/null
+++ b/apps/scandic-web/components/Icons/IconByIconName.tsx
@@ -0,0 +1,359 @@
+import {
+  BathroomCabinet2Icon,
+  BouquetIcon,
+  BowlingPinsIcon,
+  Chips3Icon,
+  ConferenceRoomIcon,
+  Door2Icon,
+  FacebookIcon,
+  FootStoolIcon,
+  Hairdresser1Icon,
+  HairDryerIcon,
+  IceMachineIcon,
+  type IconProps,
+  InstagramIcon,
+  MassageIcon,
+  MaterialIcon,
+  type MaterialIconSetIconProps,
+  type NucleoIconProps,
+  PalmTree2Icon,
+  Popcorn2Icon,
+  RecordPlayer3Icon,
+  RoadIcon,
+  SafetyBoxIcon,
+  Toilet2Icon,
+  TripadvisorIcon,
+  UserPolice2Icon,
+} from "@scandic-hotels/design-system/Icons"
+
+import { IconName } from "./iconName"
+
+interface IconByIconNameProps {
+  iconName: IconName | null
+}
+export function IconByIconName({
+  iconName,
+  ...props
+}: IconByIconNameProps &
+  (
+    | IconProps
+    | NucleoIconProps
+    | MaterialIconSetIconProps
+  )): JSX.Element | null {
+  switch (iconName) {
+    case IconName.Accessibility:
+      return <MaterialIcon icon="accessibility" {...props} />
+    case IconName.Air:
+      return <MaterialIcon icon="air" {...props} />
+    case IconName.ArrowFrom:
+      return <MaterialIcon icon="upload" {...props} />
+    case IconName.ArrowTo:
+      return <MaterialIcon icon="download" {...props} />
+    case IconName.Swipe:
+      return <MaterialIcon icon="swipe" {...props} />
+    case IconName.ConferenceRoom:
+      return <ConferenceRoomIcon {...props} />
+    case IconName.BathroomCabinet:
+      return <BathroomCabinet2Icon {...props} />
+    case IconName.Chips:
+      return <Chips3Icon {...props} />
+    case IconName.Bouquet:
+      return <BouquetIcon {...props} />
+    case IconName.CashFree:
+      return <MaterialIcon icon="credit_card_heart" {...props} />
+    case IconName.SafetyBox:
+      return <SafetyBoxIcon {...props} />
+    case IconName.Toilet:
+      return <Toilet2Icon {...props} />
+    case IconName.Popcorn:
+      return <Popcorn2Icon {...props} />
+    case IconName.RecordPlayer:
+      return <RecordPlayer3Icon {...props} />
+    case IconName.PalmTree:
+      return <PalmTree2Icon {...props} />
+    case IconName.Bowling:
+      return <BowlingPinsIcon {...props} />
+    case IconName.Skiing:
+      return <MaterialIcon icon="downhill_skiing" {...props} />
+    case IconName.AirConAirCooling:
+      return <MaterialIcon icon="mode_fan" {...props} />
+    case IconName.Beach:
+      return <MaterialIcon icon="beach_access" {...props} />
+    case IconName.Hiking:
+      return <MaterialIcon icon="hiking" {...props} />
+    case IconName.LaptopSafe:
+      return <MaterialIcon icon="sync_saved_locally" {...props} />
+    case IconName.BeautySalon:
+      return <MaterialIcon icon="health_and_beauty" {...props} />
+    case IconName.Gaming:
+      return <MaterialIcon icon="sports_esports" {...props} />
+    case IconName.AirConditioningInRoom:
+      return <MaterialIcon icon="air_purifier_gen" {...props} />
+    case IconName.Airplane:
+      return <MaterialIcon icon="travel" {...props} />
+    case IconName.ArmChair:
+      return <MaterialIcon icon="chair" {...props} />
+    case IconName.ArrowRight:
+      return <MaterialIcon icon="arrow_forward" {...props} />
+    case IconName.ArrowRightSmall:
+      return <MaterialIcon icon="arrow_forward" {...props} />
+    case IconName.ArrowLeft:
+      return <MaterialIcon icon="arrow_back" {...props} />
+    case IconName.ArrowLeftSmall:
+      return <MaterialIcon icon="arrow_back" {...props} />
+    case IconName.Bar:
+      return <MaterialIcon icon="local_bar" {...props} />
+    case IconName.Bed:
+      return <MaterialIcon icon="bed" {...props} />
+    case IconName.LuggageLockers:
+      return <Door2Icon {...props} />
+    case IconName.NonSmoking:
+      return <MaterialIcon icon="smoke_free" {...props} />
+    case IconName.TVRemote:
+      return <MaterialIcon icon="tv_remote" {...props} />
+    case IconName.Minibar:
+      return <MaterialIcon icon="liquor" {...props} />
+    case IconName.Business:
+    case IconName.BusinessCentre:
+      return <MaterialIcon icon="business_center" {...props} />
+    case IconName.IceMachine:
+      return <IceMachineIcon {...props} />
+    case IconName.Massage:
+      return <MassageIcon {...props} />
+    case IconName.Luggage:
+      return <MaterialIcon icon="luggage" {...props} />
+    case IconName.Ironing:
+      return <MaterialIcon icon="iron" {...props} />
+    case IconName.Kitchen:
+      return <MaterialIcon icon="countertops" {...props} />
+    case IconName.Guard:
+      return <UserPolice2Icon {...props} />
+    case IconName.Fax:
+      return <MaterialIcon icon="fax" {...props} />
+    case IconName.Calendar:
+      return <MaterialIcon icon="calendar_today" {...props} />
+    case IconName.Camera:
+      return <MaterialIcon icon="camera" {...props} />
+    case IconName.Cellphone:
+    case IconName.Phone:
+      return <MaterialIcon icon="phone" {...props} />
+    case IconName.HairdryerInRoomAllScandic:
+      return <HairDryerIcon {...props} />
+    case IconName.ComplimentaryColdRefreshments:
+      return <MaterialIcon icon="water_full" {...props} />
+    case IconName.Check:
+      return <MaterialIcon icon="check_box" {...props} />
+    case IconName.CrossCircle:
+      return <MaterialIcon icon="cancel" {...props} />
+    case IconName.Wheelchair:
+      return <MaterialIcon icon="accessible" {...props} />
+    case IconName.Hairdresser:
+      return <Hairdresser1Icon {...props} />
+    case IconName.FoodDrinks247:
+      return <MaterialIcon icon="fastfood" {...props} />
+    case IconName.ExtraFamilyFriendly:
+      return <MaterialIcon icon="family_restroom" {...props} />
+    case IconName.Desk:
+      return <MaterialIcon icon="desk" {...props} />
+    case IconName.ConventionCentre:
+      return <MaterialIcon icon="groups" {...props} />
+    case IconName.City:
+      return <MaterialIcon icon="location_city" {...props} />
+    case IconName.CrossCircleOutline:
+      return <MaterialIcon icon="cancel" {...props} />
+    case IconName.CheckCircle:
+      return <MaterialIcon icon="check_circle" {...props} />
+    case IconName.ChevronDown:
+      return <MaterialIcon icon="keyboard_arrow_down" {...props} />
+    case IconName.ChevronDownSmall:
+      return <MaterialIcon icon="keyboard_arrow_down" {...props} />
+    case IconName.ChevronLeft:
+      return <MaterialIcon icon="chevron_left" {...props} />
+    case IconName.ChevronLeftSmall:
+      return <MaterialIcon icon="chevron_left" {...props} />
+    case IconName.ChevronRight:
+      return <MaterialIcon icon="chevron_right" {...props} />
+    case IconName.ChevronRightSmall:
+      return <MaterialIcon icon="chevron_right" {...props} />
+    case IconName.ChevronUp:
+      return <MaterialIcon icon="keyboard_arrow_up" {...props} />
+    case IconName.ChevronUpSmall:
+      return <MaterialIcon icon="keyboard_arrow_up" {...props} />
+    case IconName.Close:
+      return <MaterialIcon icon="close" {...props} />
+    case IconName.CloseLarge:
+      return <MaterialIcon icon="close" {...props} />
+    case IconName.ConvenienceStore24h:
+      return <MaterialIcon icon="local_convenience_store" {...props} />
+    case IconName.CoffeeAlt:
+    case IconName.CoffeeInReceptionAtCharge:
+      return <MaterialIcon icon="coffee" {...props} />
+    case IconName.Concierge:
+      return <MaterialIcon icon="concierge" {...props} />
+    case IconName.Cultural:
+      return <MaterialIcon icon="theater_comedy" {...props} />
+    case IconName.Diamond:
+      return <MaterialIcon icon="diamond" {...props} />
+    case IconName.Directions:
+      return <MaterialIcon icon="directions" {...props} />
+    case IconName.DoorOpen:
+      return <MaterialIcon icon="meeting_room" {...props} />
+    case IconName.Dresser:
+      return <MaterialIcon icon="dresser" {...props} />
+    case IconName.ElectricBike:
+      return <MaterialIcon icon="electric_bike" {...props} />
+    case IconName.ElectricCar:
+      return <MaterialIcon icon="electric_car" {...props} />
+    case IconName.Email:
+      return <MaterialIcon icon="mail" {...props} />
+    case IconName.EyeHide:
+      return <MaterialIcon icon="visibility_off" {...props} />
+    case IconName.EyeShow:
+      return <MaterialIcon icon="visibility" {...props} />
+    case IconName.Fan:
+      return <MaterialIcon icon="mode_fan" {...props} />
+    case IconName.Facebook:
+      return <FacebookIcon {...props} />
+    case IconName.Fitness:
+      return <MaterialIcon icon="exercise" {...props} />
+    case IconName.Footstool:
+      return <FootStoolIcon {...props} />
+    case IconName.Gallery:
+      return <MaterialIcon icon="filter" {...props} />
+    case IconName.Garage:
+      return <MaterialIcon icon="garage" {...props} />
+    case IconName.Gift:
+      return <MaterialIcon icon="featured_seasonal_and_gifts" {...props} />
+    case IconName.Theatre:
+      return <MaterialIcon icon="theater_comedy" {...props} />
+    case IconName.Sports:
+      return <MaterialIcon icon="sports_tennis" {...props} />
+    case IconName.Bike:
+      return <MaterialIcon icon="pedal_bike" {...props} />
+    case IconName.Globe:
+      return <MaterialIcon icon="globe" {...props} />
+    case IconName.Golf:
+      return <MaterialIcon icon="sports_golf" {...props} />
+    case IconName.Dining:
+      return <MaterialIcon icon="dining" {...props} />
+    case IconName.Hanger:
+      return <MaterialIcon icon="checkroom" {...props} />
+    case IconName.HangerAlt:
+      return <MaterialIcon icon="styler" {...props} />
+    case IconName.Heat:
+      return <MaterialIcon icon="heat" {...props} />
+    case IconName.House:
+      return <MaterialIcon icon="home" {...props} />
+    case IconName.Image:
+      return <MaterialIcon icon="imagesmode" {...props} />
+    case IconName.InfoCircle:
+      return <MaterialIcon icon="info" {...props} />
+    case IconName.Instagram:
+      return <InstagramIcon {...props} />
+    case IconName.Kayaking:
+      return <MaterialIcon icon="kayaking" {...props} />
+    case IconName.Kettle:
+      return <MaterialIcon icon="kettle" {...props} />
+    case IconName.Lamp:
+      return <MaterialIcon icon="floor_lamp" {...props} />
+    case IconName.LaundryMachine:
+      return <MaterialIcon icon="local_laundry_service" {...props} />
+    case IconName.Link:
+      return <MaterialIcon icon="link" {...props} />
+    case IconName.LocalBar:
+      return <MaterialIcon icon="local_bar" {...props} />
+    case IconName.Location:
+      return <MaterialIcon icon="location_on" {...props} />
+    case IconName.Lock:
+      return <MaterialIcon icon="lock" {...props} />
+    case IconName.Map:
+      return <MaterialIcon icon="map" {...props} />
+    case IconName.Minus:
+      return <MaterialIcon icon="remove" {...props} />
+    case IconName.Museum:
+      return <MaterialIcon icon="museum" {...props} />
+    case IconName.Nature:
+      return <MaterialIcon icon="nature" {...props} />
+    case IconName.Nightlife:
+      return <MaterialIcon icon="nightlife" {...props} />
+    case IconName.NoSmoking:
+      return <MaterialIcon icon="smoke_free" {...props} />
+    case IconName.OpenInNew:
+      return <MaterialIcon icon="open_in_new" {...props} />
+    case IconName.OpenInNewSmall:
+      return <MaterialIcon icon="open_in_new" {...props} />
+    case IconName.OutdoorFurniture:
+    case IconName.Deck:
+      return <MaterialIcon icon="deck" {...props} />
+    case IconName.Parking:
+      return <MaterialIcon icon="local_parking" {...props} />
+    case IconName.Person:
+      return <MaterialIcon icon="person" {...props} />
+    case IconName.ParkingOutdoor:
+      return <MaterialIcon icon="emoji_transportation" {...props} />
+    case IconName.Pets:
+      return <MaterialIcon icon="pets" {...props} />
+    case IconName.Plus:
+      return <MaterialIcon icon="add" {...props} />
+    case IconName.PlusCircle:
+      return <MaterialIcon icon="add_circle" {...props} />
+    case IconName.PriceTag:
+      return <MaterialIcon icon="sell" {...props} />
+    case IconName.Restaurant:
+      return <MaterialIcon icon="restaurant" {...props} />
+    case IconName.RoomService:
+      return <MaterialIcon icon="room_service" {...props} />
+    case IconName.Smoking:
+      return <MaterialIcon icon="smoking_rooms" {...props} />
+    case IconName.Spa:
+      return <MaterialIcon icon="spa" {...props} />
+    case IconName.Sauna:
+      return <MaterialIcon icon="sauna" {...props} />
+    case IconName.Search:
+      return <MaterialIcon icon="search" {...props} />
+    case IconName.Service:
+      return <MaterialIcon icon="call_quality" {...props} />
+    case IconName.Elevator:
+      return <MaterialIcon icon="elevator" {...props} />
+    case IconName.Shopping:
+      return <MaterialIcon icon="shopping_bag" {...props} />
+    case IconName.Skateboarding:
+      return <MaterialIcon icon="skateboarding" {...props} />
+    case IconName.Snowflake:
+      return <MaterialIcon icon="asterisk" {...props} />
+    case IconName.Star:
+      return <MaterialIcon icon="star" {...props} />
+    case IconName.StarFilled:
+      return <MaterialIcon icon="star" isFilled {...props} />
+    case IconName.Street:
+      return <RoadIcon {...props} />
+    case IconName.Swim:
+      return <MaterialIcon icon="pool" {...props} />
+    case IconName.Thermostat:
+      return <MaterialIcon icon="device_thermostat" {...props} />
+    case IconName.Tshirt:
+      return <MaterialIcon icon="apparel" {...props} />
+    case IconName.Train:
+      return <MaterialIcon icon="train" {...props} />
+    case IconName.Tripadvisor:
+      return <TripadvisorIcon {...props} />
+    case IconName.TshirtWash:
+      return <MaterialIcon icon="laundry" {...props} />
+    case IconName.TvCasting:
+      return <MaterialIcon icon="connected_tv" {...props} />
+    case IconName.WarningTriangle:
+      return <MaterialIcon icon="warning" {...props} />
+    case IconName.Wifi:
+      return <MaterialIcon icon="wifi" {...props} />
+    case IconName.Breakfast:
+      return <MaterialIcon icon="bakery_dining" {...props} />
+    case IconName.Jacuzzi:
+      return <MaterialIcon icon="hot_tub" {...props} />
+    case IconName.DirectDial:
+      return <MaterialIcon icon="call" {...props} />
+    case IconName.CoffeeShop:
+      return <MaterialIcon icon="local_cafe" {...props} />
+    default:
+      return null
+  }
+}
diff --git a/apps/scandic-web/components/Icons/IllustrationByIconName.ts b/apps/scandic-web/components/Icons/IllustrationByIconName.ts
new file mode 100644
index 000000000..8a9ec804d
--- /dev/null
+++ b/apps/scandic-web/components/Icons/IllustrationByIconName.ts
@@ -0,0 +1,50 @@
+import {
+  BedIcon,
+  CoinIcon,
+  CroissantCoffeeEggIcon,
+  CutleryOneIcon,
+  CutleryTwoIcon,
+  GiftOpenIcon,
+  HandKeyIcon,
+  HotelNightIcon,
+  KidsIcon,
+  KidsMocktailIcon,
+  MagicWandIcon,
+  MoneyHandIcon,
+  VoucherIcon,
+} from "@scandic-hotels/design-system/Icons"
+
+import { IconName } from "./iconName"
+
+export function IllustrationByIconName(iconName: IconName | null) {
+  switch (iconName) {
+    case IconName.Kids:
+      return KidsIcon
+    case IconName.KidsMocktail:
+      return KidsMocktailIcon
+    case IconName.MagicWand:
+      return MagicWandIcon
+    case IconName.MoneyHand:
+      return MoneyHandIcon
+    case IconName.HandKey:
+      return HandKeyIcon
+    case IconName.HotelNight:
+      return HotelNightIcon
+    case IconName.GiftOpen:
+      return GiftOpenIcon
+    case IconName.CutleryOne:
+      return CutleryOneIcon
+    case IconName.CutleryTwo:
+      return CutleryTwoIcon
+    case IconName.CroissantCoffeeEgg:
+      return CroissantCoffeeEggIcon
+    case IconName.Coin:
+      return CoinIcon
+    case IconName.Bed:
+      return BedIcon
+    case IconName.Voucher:
+      return VoucherIcon
+    default:
+      return null
+  }
+}
diff --git a/apps/scandic-web/components/Icons/Image.tsx b/apps/scandic-web/components/Icons/Image.tsx
deleted file mode 100644
index aa0b875df..000000000
--- a/apps/scandic-web/components/Icons/Image.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ImageIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5.09998 20.775C4.58434 20.775 4.14293 20.5914 3.77575 20.2242C3.40857 19.857 3.22498 19.4156 3.22498 18.9V5.09998C3.22498 4.58434 3.40857 4.14293 3.77575 3.77575C4.14293 3.40857 4.58434 3.22498 5.09998 3.22498H18.9C19.4156 3.22498 19.857 3.40857 20.2242 3.77575C20.5914 4.14293 20.775 4.58434 20.775 5.09998V18.9C20.775 19.4156 20.5914 19.857 20.2242 20.2242C19.857 20.5914 19.4156 20.775 18.9 20.775H5.09998ZM5.09998 18.9H18.9V5.09998H5.09998V18.9ZM7.13748 16.925H16.8826C17.0775 16.925 17.2208 16.8396 17.3125 16.6687C17.4041 16.4979 17.3875 16.3333 17.2625 16.175L14.575 12.6C14.4807 12.475 14.3551 12.4125 14.1981 12.4125C14.041 12.4125 13.9166 12.475 13.825 12.6L11.25 16.025L9.42498 13.6125C9.33074 13.4875 9.2051 13.425 9.04805 13.425C8.891 13.425 8.76664 13.4875 8.67498 13.6125L6.76588 16.1732C6.63861 16.3327 6.62185 16.4979 6.7156 16.6687C6.80935 16.8396 6.94998 16.925 7.13748 16.925ZM8.5007 9.93748C8.90022 9.93748 9.23956 9.79765 9.51873 9.518C9.79789 9.23833 9.93748 8.89875 9.93748 8.49925C9.93748 8.09973 9.79765 7.76039 9.518 7.48123C9.23833 7.20206 8.89875 7.06248 8.49925 7.06248C8.09973 7.06248 7.76039 7.2023 7.48123 7.48195C7.20206 7.76162 7.06248 8.1012 7.06248 8.5007C7.06248 8.90022 7.2023 9.23956 7.48195 9.51873C7.76162 9.79789 8.1012 9.93748 8.5007 9.93748Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/InfoCircle.tsx b/apps/scandic-web/components/Icons/InfoCircle.tsx
deleted file mode 100644
index ac7f81349..000000000
--- a/apps/scandic-web/components/Icons/InfoCircle.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function InfoCircleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M10.0061 13.8958C10.1965 13.8958 10.3612 13.8274 10.5 13.6906C10.6389 13.5538 10.7084 13.3896 10.7084 13.1979V9.71873C10.7084 9.52706 10.6404 9.36283 10.5044 9.22602C10.3685 9.08922 10.2053 9.02081 10.0149 9.02081C9.82442 9.02081 9.65976 9.08922 9.52087 9.22602C9.38199 9.36283 9.31254 9.52706 9.31254 9.71873V13.1979C9.31254 13.3896 9.38052 13.5538 9.51648 13.6906C9.65245 13.8274 9.81564 13.8958 10.0061 13.8958ZM9.99346 7.58331C10.1923 7.58331 10.3612 7.51606 10.5 7.38156C10.6389 7.24706 10.7084 7.0804 10.7084 6.88156C10.7084 6.68273 10.6411 6.51387 10.5066 6.37498C10.3721 6.23609 10.2055 6.16665 10.0066 6.16665C9.80779 6.16665 9.63893 6.2339 9.50004 6.3684C9.36115 6.5029 9.29171 6.66956 9.29171 6.8684C9.29171 7.06723 9.35896 7.23609 9.49346 7.37498C9.62796 7.51387 9.79462 7.58331 9.99346 7.58331ZM10.0058 17.7916C8.9338 17.7916 7.92449 17.5884 6.97785 17.182C6.0312 16.7756 5.20275 16.2165 4.4925 15.5049C3.78225 14.7933 3.224 13.9649 2.81775 13.0199C2.4115 12.0748 2.20837 11.065 2.20837 9.99044C2.20837 8.91476 2.41159 7.90707 2.81802 6.96738C3.22445 6.02767 3.78348 5.20269 4.4951 4.49244C5.20673 3.78219 6.03508 3.22394 6.98017 2.81769C7.92523 2.41144 8.93504 2.20831 10.0096 2.20831C11.0853 2.20831 12.093 2.41153 13.0326 2.81796C13.9724 3.22439 14.7973 3.78342 15.5076 4.49504C16.2178 5.20667 16.7761 6.0334 17.1823 6.97523C17.5886 7.91705 17.7917 8.92338 17.7917 9.99423C17.7917 11.0662 17.5885 12.0755 17.1821 13.0222C16.7756 13.9688 16.2166 14.7973 15.505 15.5075C14.7934 16.2178 13.9666 16.776 13.0248 17.1823C12.083 17.5885 11.0766 17.7916 10.0058 17.7916ZM10 16.3958C11.7709 16.3958 13.2796 15.7725 14.5261 14.526C15.7726 13.2795 16.3959 11.7708 16.3959 9.99998C16.3959 8.22915 15.7726 6.72047 14.5261 5.47394C13.2796 4.22741 11.7709 3.60415 10 3.60415C8.22921 3.60415 6.72053 4.22741 5.474 5.47394C4.22747 6.72047 3.60421 8.22915 3.60421 9.99998C3.60421 11.7708 4.22747 13.2795 5.474 14.526C6.72053 15.7725 8.22921 16.3958 10 16.3958Z"
-        fill="#CD0921"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Instagram.tsx b/apps/scandic-web/components/Icons/Instagram.tsx
deleted file mode 100644
index 5297456d2..000000000
--- a/apps/scandic-web/components/Icons/Instagram.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function InstagramIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M17.34 5.46C17.1027 5.46 16.8707 5.53038 16.6733 5.66224C16.476 5.79409 16.3222 5.98151 16.2313 6.20078C16.1405 6.42005 16.1168 6.66133 16.1631 6.89411C16.2094 7.12689 16.3236 7.34071 16.4915 7.50853C16.6593 7.67635 16.8731 7.79064 17.1059 7.83694C17.3387 7.88324 17.5799 7.85948 17.7992 7.76866C18.0185 7.67783 18.2059 7.52402 18.3378 7.32668C18.4696 7.12935 18.54 6.89734 18.54 6.66C18.54 6.34174 18.4136 6.03652 18.1885 5.81147C17.9635 5.58643 17.6583 5.46 17.34 5.46ZM21.94 7.88C21.9206 7.0503 21.7652 6.2294 21.48 5.45C21.2257 4.78313 20.83 4.17928 20.32 3.68C19.8248 3.16743 19.2196 2.77418 18.55 2.53C17.7727 2.23616 16.9508 2.07721 16.12 2.06C15.06 2 14.72 2 12 2C9.28 2 8.94 2 7.88 2.06C7.04915 2.07721 6.22734 2.23616 5.45 2.53C4.78168 2.77665 4.17693 3.16956 3.68 3.68C3.16743 4.17518 2.77418 4.78044 2.53 5.45C2.23616 6.22734 2.07721 7.04915 2.06 7.88C2 8.94 2 9.28 2 12C2 14.72 2 15.06 2.06 16.12C2.07721 16.9508 2.23616 17.7727 2.53 18.55C2.77418 19.2196 3.16743 19.8248 3.68 20.32C4.17693 20.8304 4.78168 21.2234 5.45 21.47C6.22734 21.7638 7.04915 21.9228 7.88 21.94C8.94 22 9.28 22 12 22C14.72 22 15.06 22 16.12 21.94C16.9508 21.9228 17.7727 21.7638 18.55 21.47C19.2196 21.2258 19.8248 20.8326 20.32 20.32C20.8322 19.8226 21.2283 19.2182 21.48 18.55C21.7652 17.7706 21.9206 16.9497 21.94 16.12C21.94 15.06 22 14.72 22 12C22 9.28 22 8.94 21.94 7.88ZM20.14 16C20.1327 16.6348 20.0178 17.2637 19.8 17.86C19.6403 18.2952 19.3839 18.6884 19.05 19.01C18.7256 19.3405 18.3332 19.5964 17.9 19.76C17.3037 19.9778 16.6748 20.0927 16.04 20.1C15.04 20.15 14.67 20.16 12.04 20.16C9.41 20.16 9.04 20.16 8.04 20.1C7.38089 20.1123 6.72459 20.0109 6.1 19.8C5.68578 19.6281 5.31136 19.3728 5 19.05C4.66809 18.7287 4.41484 18.3352 4.26 17.9C4.01586 17.2952 3.88044 16.6519 3.86 16C3.86 15 3.8 14.63 3.8 12C3.8 9.37 3.8 9 3.86 8C3.86448 7.35106 3.98295 6.70795 4.21 6.1C4.38605 5.67791 4.65627 5.30166 5 5C5.30381 4.65617 5.67929 4.3831 6.1 4.2C6.70955 3.98004 7.352 3.86508 8 3.86C9 3.86 9.37 3.8 12 3.8C14.63 3.8 15 3.8 16 3.86C16.6348 3.86728 17.2637 3.98225 17.86 4.2C18.3144 4.36865 18.7223 4.64285 19.05 5C19.3777 5.30718 19.6338 5.68273 19.8 6.1C20.0223 6.70893 20.1373 7.35178 20.14 8C20.19 9 20.2 9.37 20.2 12C20.2 14.63 20.19 15 20.14 16ZM12 6.87C10.9858 6.87198 9.99496 7.17453 9.15265 7.73942C8.31035 8.30431 7.65438 9.1062 7.26763 10.0438C6.88089 10.9813 6.78072 12.0125 6.97979 13.0069C7.17886 14.0014 7.66824 14.9145 8.38608 15.631C9.10392 16.3474 10.018 16.835 11.0129 17.0321C12.0077 17.2293 13.0387 17.1271 13.9755 16.7385C14.9123 16.35 15.7129 15.6924 16.2761 14.849C16.8394 14.0056 17.14 13.0142 17.14 12C17.1413 11.3251 17.0092 10.6566 16.7512 10.033C16.4933 9.40931 16.1146 8.84281 15.6369 8.36605C15.1592 7.88929 14.5919 7.51168 13.9678 7.25493C13.3436 6.99818 12.6749 6.86736 12 6.87ZM12 15.33C11.3414 15.33 10.6976 15.1347 10.15 14.7688C9.60234 14.4029 9.17552 13.8828 8.92348 13.2743C8.67144 12.6659 8.6055 11.9963 8.73398 11.3503C8.86247 10.7044 9.17963 10.111 9.64533 9.64533C10.111 9.17963 10.7044 8.86247 11.3503 8.73398C11.9963 8.6055 12.6659 8.67144 13.2743 8.92348C13.8828 9.17552 14.4029 9.60234 14.7688 10.15C15.1347 10.6976 15.33 11.3414 15.33 12C15.33 12.4373 15.2439 12.8703 15.0765 13.2743C14.9092 13.6784 14.6639 14.0454 14.3547 14.3547C14.0454 14.6639 13.6784 14.9092 13.2743 15.0765C12.8703 15.2439 12.4373 15.33 12 15.33Z"
-        fill="black"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Iron.tsx b/apps/scandic-web/components/Icons/Iron.tsx
deleted file mode 100644
index 4f5964a90..000000000
--- a/apps/scandic-web/components/Icons/Iron.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function IronIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M4.125 15.875H14.9875V12.9375H6.125C5.575 12.9375 5.10417 13.1271 4.7125 13.5062C4.32083 13.8854 4.125 14.3462 4.125 14.8887V15.875ZM20.8125 6.25C21.0708 6.25 21.2917 6.34167 21.475 6.525C21.6583 6.70833 21.75 6.92917 21.75 7.1875C21.75 7.44583 21.6583 7.66667 21.475 7.85C21.2917 8.03333 21.0708 8.125 20.8125 8.125C20.5256 8.125 20.2852 8.22083 20.0911 8.4125C19.897 8.60417 19.8 8.83647 19.8 9.1094V12.9625C19.8 13.7576 19.5125 14.4335 18.9375 14.9901C18.3625 15.5467 17.6708 15.825 16.8625 15.825V16.8125C16.8625 17.0708 16.7708 17.2917 16.5875 17.475C16.4042 17.6583 16.1833 17.75 15.925 17.75H3.1875C2.92917 17.75 2.70833 17.6583 2.525 17.475C2.34167 17.2917 2.25 17.0708 2.25 16.8125V14.8879C2.25 13.8293 2.62708 12.9271 3.38125 12.1813C4.13542 11.4354 5.05 11.0625 6.125 11.0625H14.9875V10.0801C14.9875 9.80168 14.8875 9.56667 14.6875 9.375C14.4875 9.18333 14.2458 9.0875 13.9625 9.0875H10.0458C9.91528 9.0875 9.785 9.11667 9.655 9.175C9.525 9.23333 9.41667 9.30417 9.33 9.3875C9.24333 9.47083 9.14583 9.53542 9.0375 9.58125C8.92917 9.62708 8.80833 9.65 8.675 9.65C8.41667 9.65 8.19375 9.55833 8.00625 9.375C7.81875 9.19167 7.725 8.97083 7.725 8.7125C7.725 8.57917 7.75208 8.45417 7.80625 8.3375C7.86042 8.22083 7.92917 8.12083 8.0125 8.0375C8.27917 7.77917 8.58508 7.57708 8.93025 7.43125C9.2754 7.28542 9.64865 7.2125 10.05 7.2125H13.9625C14.7681 7.2125 15.4528 7.4908 16.0167 8.0474C16.5806 8.604 16.8625 9.27987 16.8625 10.075V13.95C17.1542 13.95 17.4042 13.8554 17.6125 13.6661C17.8208 13.4768 17.925 13.2423 17.925 12.9625V9.1125C17.925 8.31737 18.2057 7.6415 18.7672 7.0849C19.3287 6.5283 20.0104 6.25 20.8125 6.25Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Kayaking.tsx b/apps/scandic-web/components/Icons/Kayaking.tsx
deleted file mode 100644
index 1c5e61304..000000000
--- a/apps/scandic-web/components/Icons/Kayaking.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function KayakingIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M3 22.9374C2.74167 22.9374 2.52083 22.8458 2.3375 22.6624C2.15417 22.4791 2.0625 22.2583 2.0625 21.9999C2.0625 21.7416 2.15417 21.5208 2.3375 21.3374C2.52083 21.1541 2.74167 21.0624 3 21.0624C3.43333 21.0624 3.86458 20.9999 4.29375 20.8749C4.72292 20.7499 5.1375 20.5624 5.5375 20.3124C5.67083 20.2291 5.825 20.1874 6 20.1874C6.175 20.1874 6.32917 20.2291 6.4625 20.3124C6.8625 20.5624 7.27708 20.7499 7.70625 20.8749C8.13542 20.9999 8.56667 21.0624 9 21.0624C9.43333 21.0624 9.86875 20.9999 10.3063 20.8749C10.7438 20.7499 11.1583 20.5624 11.55 20.3124C11.6833 20.2291 11.8375 20.1874 12.0125 20.1874C12.1875 20.1874 12.3375 20.2291 12.4625 20.3124C12.8625 20.5624 13.2771 20.7499 13.7063 20.8749C14.1354 20.9999 14.5667 21.0624 15 21.0624C15.4333 21.0624 15.8688 20.9999 16.3063 20.8749C16.7438 20.7499 17.1583 20.5624 17.55 20.3124C17.675 20.2291 17.825 20.1874 18 20.1874C18.175 20.1874 18.325 20.2291 18.45 20.3124C18.8417 20.5624 19.2563 20.7499 19.6938 20.8749C20.1313 20.9999 20.5667 21.0624 21 21.0624C21.2583 21.0624 21.4792 21.1541 21.6625 21.3374C21.8458 21.5208 21.9375 21.7416 21.9375 21.9999C21.9375 22.2583 21.8458 22.4791 21.6625 22.6624C21.4792 22.8458 21.2583 22.9374 21 22.9374C20.4917 22.9374 19.9854 22.8687 19.4813 22.7312C18.9771 22.5937 18.4833 22.3833 18 22.0999C17.5167 22.3833 17.0229 22.5937 16.5188 22.7312C16.0146 22.8687 15.5083 22.9374 15 22.9374C14.4917 22.9374 13.9854 22.8687 13.4812 22.7312C12.9771 22.5937 12.4833 22.3833 12 22.0999C11.5167 22.3833 11.0229 22.5937 10.5188 22.7312C10.0146 22.8687 9.50833 22.9374 9 22.9374C8.49167 22.9374 7.98542 22.8687 7.48125 22.7312C6.97708 22.5937 6.48333 22.3833 6 22.0999C5.51667 22.3833 5.02292 22.5937 4.51875 22.7312C4.01458 22.8687 3.50833 22.9374 3 22.9374ZM12 9.44995C11.4583 9.44995 10.9979 9.26036 10.6188 8.8812C10.2396 8.50203 10.05 8.04161 10.05 7.49995C10.05 6.95828 10.2396 6.49786 10.6188 6.1187C10.9979 5.73953 11.4583 5.54995 12 5.54995C12.5417 5.54995 13.0021 5.73953 13.3813 6.1187C13.7604 6.49786 13.95 6.95828 13.95 7.49995C13.95 8.04161 13.7604 8.50203 13.3813 8.8812C13.0021 9.26036 12.5417 9.44995 12 9.44995ZM9 19.1749C8.55 19.1749 8.11875 19.0874 7.70625 18.9124C7.29375 18.7374 6.91667 18.5041 6.575 18.2124C6.40833 18.0708 6.21458 17.9979 5.99375 17.9937C5.77292 17.9895 5.57917 18.0583 5.4125 18.1999C5.24583 18.3333 5.07083 18.4583 4.8875 18.5749C4.70417 18.6916 4.50833 18.7916 4.3 18.8749C4.01667 18.8083 3.73542 18.7374 3.45625 18.6624C3.17708 18.5874 2.9 18.5041 2.625 18.4124C2.08333 18.2458 1.8125 17.9416 1.8125 17.4999C1.8125 17.0583 2.08333 16.7541 2.625 16.5874C3.34167 16.3541 4.09167 16.1437 4.875 15.9562C5.65833 15.7687 6.425 15.6083 7.175 15.4749L8.5375 11.2749C8.7125 10.7499 9.04167 10.3895 9.525 10.1937C10.0083 9.99786 10.475 10.0166 10.925 10.2499L13.5 11.5749L16.375 10.0499L18.0375 6.29995L17.675 5.32495C17.6417 5.20828 17.625 5.09161 17.625 4.97495C17.625 4.85828 17.65 4.74161 17.7 4.62495L18.4625 2.93745C18.5708 2.69578 18.7438 2.5312 18.9813 2.4437C19.2188 2.3562 19.4542 2.36245 19.6875 2.46245L21.0625 3.08745C21.3042 3.18745 21.4688 3.3562 21.5562 3.5937C21.6437 3.8312 21.6375 4.07078 21.5375 4.31245L20.7875 5.99995C20.7375 6.11661 20.6667 6.21661 20.575 6.29995C20.4833 6.38328 20.3792 6.44578 20.2625 6.48745L19.3 6.84995L15.5625 15.2999C16.5542 15.4166 17.5542 15.5895 18.5625 15.8187C19.5708 16.0479 20.5125 16.3041 21.3875 16.5874C21.9042 16.7541 22.1625 17.0583 22.1625 17.4999C22.1625 17.9416 21.9042 18.2458 21.3875 18.4124C21.1125 18.5041 20.8313 18.5874 20.5438 18.6624C20.2563 18.7374 19.975 18.8083 19.7 18.8749C19.4917 18.7916 19.2938 18.6937 19.1063 18.5812C18.9188 18.4687 18.7417 18.3416 18.575 18.1999C18.4083 18.0583 18.2167 17.9895 18 17.9937C17.7833 17.9979 17.5917 18.0708 17.425 18.2124C17.0833 18.5041 16.7063 18.7374 16.2937 18.9124C15.8812 19.0874 15.45 19.1749 15 19.1749C14.55 19.1749 14.1188 19.0874 13.7063 18.9124C13.2937 18.7374 12.9167 18.5041 12.575 18.2124C12.4083 18.0708 12.2167 17.9999 12 17.9999C11.7833 17.9999 11.5917 18.0708 11.425 18.2124C11.0833 18.5041 10.7063 18.7374 10.2937 18.9124C9.88125 19.0874 9.45 19.1749 9 19.1749ZM14.1125 15.1374L15.15 12.8124L13.5 13.6749L11.7125 12.7624L10.9625 15.0624H12C12.35 15.0624 12.7063 15.0666 13.0688 15.0749C13.4313 15.0833 13.7792 15.1041 14.1125 15.1374Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Kettle.tsx b/apps/scandic-web/components/Icons/Kettle.tsx
deleted file mode 100644
index c75521398..000000000
--- a/apps/scandic-web/components/Icons/Kettle.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function KettleIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6.1875 17.0625V6.1L4.425 3.75C4.19167 3.44167 4.16082 3.11458 4.33245 2.76875C4.50408 2.42292 4.78493 2.25 5.175 2.25H15.7625C16.3411 2.25 16.8336 2.45328 17.2402 2.85983C17.6467 3.26638 17.85 3.75893 17.85 4.3375V5.1875H19.8875C20.4031 5.1875 20.8445 5.37109 21.2117 5.73828C21.5789 6.10546 21.7625 6.54687 21.7625 7.0625V12.125C21.7625 12.6406 21.5789 13.082 21.2117 13.4492C20.8445 13.8164 20.4031 14 19.8875 14H17.85V17.0625C17.85 17.5781 17.6664 18.0195 17.2992 18.3867C16.932 18.7539 16.4906 18.9375 15.975 18.9375H8.0625C7.54687 18.9375 7.10546 18.7539 6.73828 18.3867C6.37109 18.0195 6.1875 17.5781 6.1875 17.0625ZM8.0625 17.0625H15.975V4.125H7.05L8.0625 5.45V17.0625ZM17.85 12.125H19.8875V7.0625H17.85V12.125ZM13.6125 5.0625C13.2132 5.0625 12.8738 5.20104 12.5943 5.47813C12.3148 5.75521 12.175 6.09167 12.175 6.4875V14.7C12.175 15.0958 12.3148 15.4323 12.5945 15.7094C12.8741 15.9865 13.2137 16.125 13.6132 16.125C14.0127 16.125 14.35 15.9865 14.625 15.7094C14.9 15.4323 15.0375 15.0958 15.0375 14.7V6.4875C15.0375 6.09167 14.899 5.75521 14.6219 5.47813C14.3448 5.20104 14.0083 5.0625 13.6125 5.0625ZM4.1875 21.75C3.92917 21.75 3.70833 21.6583 3.525 21.475C3.34167 21.2917 3.25 21.0708 3.25 20.8125C3.25 20.5542 3.34167 20.3333 3.525 20.15C3.70833 19.9667 3.92917 19.875 4.1875 19.875H19.8125C20.0708 19.875 20.2917 19.9667 20.475 20.15C20.6583 20.3333 20.75 20.5542 20.75 20.8125C20.75 21.0708 20.6583 21.2917 20.475 21.475C20.2917 21.6583 20.0708 21.75 19.8125 21.75H4.1875Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Lamp.tsx b/apps/scandic-web/components/Icons/Lamp.tsx
deleted file mode 100644
index 785a09dce..000000000
--- a/apps/scandic-web/components/Icons/Lamp.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LampIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12 18.9375C11.7416 18.9375 11.5208 18.8458 11.3375 18.6625C11.1541 18.4792 11.0625 18.2583 11.0625 18V10.9375H5.99997C5.68937 10.9375 5.44089 10.8125 5.25452 10.5625C5.06816 10.3125 5.02081 10.0333 5.11247 9.725L7.07497 3.375C7.20041 2.98437 7.42776 2.66796 7.75705 2.42578C8.08631 2.18359 8.45479 2.0625 8.86247 2.0625H15.1375C15.5452 2.0625 15.9136 2.18359 16.2429 2.42578C16.5722 2.66796 16.7995 2.98437 16.925 3.375L18.8875 9.725C18.9791 10.0333 18.9318 10.3125 18.7454 10.5625C18.5591 10.8125 18.3106 10.9375 18 10.9375H12.9375V18C12.9375 18.2583 12.8458 18.4792 12.6625 18.6625C12.4791 18.8458 12.2583 18.9375 12 18.9375ZM7.26247 9.0625H16.7375L15.15 3.9375H8.84997L7.26247 9.0625ZM8.99997 21.9375C8.74164 21.9375 8.52081 21.8458 8.33747 21.6625C8.15414 21.4792 8.06247 21.2583 8.06247 21C8.06247 20.7417 8.15414 20.5208 8.33747 20.3375C8.52081 20.1542 8.74164 20.0625 8.99997 20.0625H15C15.2583 20.0625 15.4791 20.1542 15.6625 20.3375C15.8458 20.5208 15.9375 20.7417 15.9375 21C15.9375 21.2583 15.8458 21.4792 15.6625 21.6625C15.4791 21.8458 15.2583 21.9375 15 21.9375H8.99997Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Laptop.tsx b/apps/scandic-web/components/Icons/Laptop.tsx
deleted file mode 100644
index 932efb949..000000000
--- a/apps/scandic-web/components/Icons/Laptop.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LaptopIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M2.188 20.7a.903.903 0 0 1-.663-.275.903.903 0 0 1-.275-.663c0-.258.092-.479.275-.662a.903.903 0 0 1 .663-.275h19.625c.258 0 .479.092.662.275a.903.903 0 0 1 .275.662c0 .259-.092.48-.275.663a.903.903 0 0 1-.663.275H2.188Zm1.937-2.85c-.516 0-.957-.184-1.324-.55a1.806 1.806 0 0 1-.551-1.325V5.15c0-.516.184-.957.55-1.324.368-.367.81-.551 1.325-.551h15.75c.516 0 .957.184 1.324.55.367.368.551.81.551 1.325v10.825c0 .516-.184.957-.55 1.324-.368.367-.81.551-1.325.551H4.125Zm0-1.875h15.75V5.15H4.125v10.825Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/LaundryMachine.tsx b/apps/scandic-web/components/Icons/LaundryMachine.tsx
deleted file mode 100644
index 85f0bbb17..000000000
--- a/apps/scandic-web/components/Icons/LaundryMachine.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LaundryMachineIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6.1001 21.75C5.58446 21.75 5.14306 21.5664 4.77587 21.1992C4.40869 20.832 4.2251 20.3906 4.2251 19.875V4.125C4.2251 3.60937 4.40869 3.16796 4.77587 2.80078C5.14306 2.43359 5.58446 2.25 6.1001 2.25H17.9001C18.4157 2.25 18.8571 2.43359 19.2243 2.80078C19.5915 3.16796 19.7751 3.60937 19.7751 4.125V19.875C19.7751 20.3906 19.5915 20.832 19.2243 21.1992C18.8571 21.5664 18.4157 21.75 17.9001 21.75H6.1001ZM6.1001 19.875H17.9001V4.125H6.1001V19.875ZM11.9999 18.825C13.3417 18.825 14.4855 18.3521 15.4313 17.4064C16.3772 16.4607 16.8501 15.317 16.8501 13.9752C16.8501 12.6334 16.3772 11.4896 15.4315 10.5437C14.4858 9.59792 13.3421 9.125 12.0003 9.125C10.6585 9.125 9.51468 9.59786 8.56885 10.5436C7.62301 11.4893 7.1501 12.633 7.1501 13.9748C7.1501 15.3166 7.62296 16.4604 8.56867 17.4062C9.51439 18.3521 10.6581 18.825 11.9999 18.825ZM12.0235 17.1C11.6162 17.1 11.223 17.0229 10.8438 16.8688C10.4647 16.7146 10.1251 16.4917 9.8251 16.2L14.2251 11.8C14.5251 12.0957 14.7501 12.4342 14.9001 12.8155C15.0501 13.1968 15.1251 13.5911 15.1251 13.9984C15.1251 14.86 14.8236 15.5923 14.2205 16.1954C13.6174 16.7985 12.8851 17.1 12.0235 17.1ZM8.07247 7.025C8.34089 7.025 8.56676 6.93421 8.7501 6.75262C8.93343 6.57106 9.0251 6.34606 9.0251 6.07762C9.0251 5.80921 8.93431 5.58333 8.75272 5.4C8.57116 5.21667 8.34616 5.125 8.07772 5.125C7.80931 5.125 7.58343 5.21579 7.4001 5.39738C7.21676 5.57894 7.1251 5.80394 7.1251 6.07238C7.1251 6.34079 7.21589 6.56667 7.39747 6.75C7.57904 6.93333 7.80404 7.025 8.07247 7.025ZM10.9975 7.025C11.2659 7.025 11.4918 6.93421 11.6751 6.75262C11.8584 6.57106 11.9501 6.34606 11.9501 6.07762C11.9501 5.80921 11.8593 5.58333 11.6777 5.4C11.4962 5.21667 11.2712 5.125 11.0027 5.125C10.7343 5.125 10.5084 5.21579 10.3251 5.39738C10.1418 5.57894 10.0501 5.80394 10.0501 6.07238C10.0501 6.34079 10.1409 6.56667 10.3225 6.75C10.504 6.93333 10.729 7.025 10.9975 7.025Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Link.tsx b/apps/scandic-web/components/Icons/Link.tsx
deleted file mode 100644
index 81b775ad7..000000000
--- a/apps/scandic-web/components/Icons/Link.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LinkIcon({
-  className,
-  color,
-  width = "20",
-  height = "20",
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height={height}
-      viewBox="0 0 20 20"
-      width={width}
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M5.89583 14.0208C4.77778 14.0208 3.82812 13.6302 3.04688 12.8489C2.26562 12.0677 1.875 11.118 1.875 9.99999C1.875 8.88193 2.26562 7.93228 3.04688 7.15103C3.82812 6.36978 4.77778 5.97916 5.89583 5.97916H8.36458C8.57986 5.97916 8.76389 6.05555 8.91667 6.20832C9.06944 6.3611 9.14583 6.54513 9.14583 6.76041C9.14583 6.97568 9.06944 7.15971 8.91667 7.31249C8.76389 7.46527 8.57986 7.54166 8.36458 7.54166H5.89583C5.21528 7.54166 4.63542 7.78124 4.15625 8.26041C3.67708 8.73957 3.4375 9.31943 3.4375 9.99999C3.4375 10.6805 3.67708 11.2604 4.15625 11.7396C4.63542 12.2187 5.21528 12.4583 5.89583 12.4583H8.36458C8.57986 12.4583 8.76389 12.5347 8.91667 12.6875C9.06944 12.8403 9.14583 13.0243 9.14583 13.2396C9.14583 13.4549 9.06944 13.6389 8.91667 13.7917C8.76389 13.9444 8.57986 14.0208 8.36458 14.0208H5.89583ZM7.53125 10.7708C7.31597 10.7708 7.13194 10.6944 6.97917 10.5417C6.82639 10.3889 6.75 10.2049 6.75 9.98957C6.75 9.7743 6.82639 9.59027 6.97917 9.43749C7.13194 9.28471 7.31597 9.20832 7.53125 9.20832H12.4688C12.684 9.20832 12.8681 9.28471 13.0208 9.43749C13.1736 9.59027 13.25 9.7743 13.25 9.98957C13.25 10.2049 13.1736 10.3889 13.0208 10.5417C12.8681 10.6944 12.684 10.7708 12.4688 10.7708H7.53125ZM11.6354 14.0208C11.4201 14.0208 11.2361 13.9444 11.0833 13.7917C10.9306 13.6389 10.8542 13.4549 10.8542 13.2396C10.8542 13.0243 10.9306 12.8403 11.0833 12.6875C11.2361 12.5347 11.4201 12.4583 11.6354 12.4583H14.1042C14.7847 12.4583 15.3646 12.2187 15.8438 11.7396C16.3229 11.2604 16.5625 10.6805 16.5625 9.99999C16.5625 9.31943 16.3229 8.73957 15.8438 8.26041C15.3646 7.78124 14.7847 7.54166 14.1042 7.54166H11.6354C11.4201 7.54166 11.2361 7.46527 11.0833 7.31249C10.9306 7.15971 10.8542 6.97568 10.8542 6.76041C10.8542 6.54513 10.9306 6.3611 11.0833 6.20832C11.2361 6.05555 11.4201 5.97916 11.6354 5.97916H14.1042C15.2222 5.97916 16.1719 6.36978 16.9531 7.15103C17.7344 7.93228 18.125 8.88193 18.125 9.99999C18.125 11.118 17.7344 12.0677 16.9531 12.8489C16.1719 13.6302 15.2222 14.0208 14.1042 14.0208H11.6354Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/LocalBar.tsx b/apps/scandic-web/components/Icons/LocalBar.tsx
deleted file mode 100644
index cd6b2f5dc..000000000
--- a/apps/scandic-web/components/Icons/LocalBar.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LocalBarIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.0625 18.95V13.875L3.68755 5.56248C3.57088 5.42914 3.47713 5.28539 3.4063 5.13123C3.33547 4.97706 3.30005 4.81248 3.30005 4.63748C3.30005 4.23748 3.43963 3.90206 3.7188 3.63123C3.99797 3.36039 4.33755 3.22498 4.73755 3.22498H19.2625C19.6625 3.22498 20.0021 3.36039 20.2813 3.63123C20.5605 3.90206 20.7 4.23748 20.7 4.63748C20.7 4.81248 20.6646 4.97706 20.5938 5.13123C20.523 5.28539 20.4292 5.42914 20.3125 5.56248L12.9375 13.875V18.95H16.875C17.1334 18.95 17.3542 19.0416 17.5375 19.225C17.7209 19.4083 17.8125 19.6291 17.8125 19.8875C17.8125 20.1458 17.7209 20.3666 17.5375 20.55C17.3542 20.7333 17.1334 20.825 16.875 20.825H7.12505C6.86672 20.825 6.64588 20.7333 6.46255 20.55C6.27922 20.3666 6.18755 20.1458 6.18755 19.8875C6.18755 19.6291 6.27922 19.4083 6.46255 19.225C6.64588 19.0416 6.86672 18.95 7.12505 18.95H11.0625ZM7.52505 7.07498H16.475L18.25 5.09998H5.75005L7.52505 7.07498ZM12 12.075L14.8125 8.94998H9.18755L12 12.075Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Location.tsx b/apps/scandic-web/components/Icons/Location.tsx
deleted file mode 100644
index 1b4eba611..000000000
--- a/apps/scandic-web/components/Icons/Location.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LocationIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M12 19.2752C13.9917 17.4169 15.4688 15.7356 16.4313 14.2314C17.3938 12.7273 17.875 11.396 17.875 10.2377C17.875 8.44603 17.3077 6.98145 16.1732 5.84395C15.0386 4.70645 13.6469 4.1377 11.9982 4.1377C10.3494 4.1377 8.95833 4.70645 7.825 5.84395C6.69167 6.98145 6.125 8.44603 6.125 10.2377C6.125 11.396 6.60625 12.7273 7.56875 14.2314C8.53125 15.7356 10.0083 17.4169 12 19.2752ZM12 21.1002C11.775 21.1002 11.5533 21.0606 11.3349 20.9814C11.1166 20.9023 10.9216 20.7835 10.75 20.6252C9.88333 19.8335 9.05833 19.0064 8.275 18.1439C7.49167 17.2814 6.80208 16.4064 6.20625 15.5189C5.61042 14.6314 5.13542 13.7419 4.78125 12.8502C4.42708 11.9585 4.25 11.0877 4.25 10.2377C4.25 7.8063 5.03125 5.86928 6.59375 4.42665C8.15625 2.98401 9.95833 2.2627 12 2.2627C14.0417 2.2627 15.8438 2.98401 17.4062 4.42665C18.9688 5.86928 19.75 7.8063 19.75 10.2377C19.75 11.0877 19.5729 11.9585 19.2188 12.8502C18.8646 13.7419 18.3896 14.6314 17.7937 15.5189C17.1979 16.4064 16.5083 17.2814 15.725 18.1439C14.9417 19.0064 14.1167 19.8335 13.25 20.6252C13.0784 20.7835 12.8834 20.9023 12.6651 20.9814C12.4467 21.0606 12.225 21.1002 12 21.1002ZM12.0006 11.9377C12.5335 11.9377 12.9896 11.7479 13.3688 11.3684C13.7479 10.9889 13.9375 10.5326 13.9375 9.99965C13.9375 9.46668 13.7477 9.01061 13.3682 8.63145C12.9887 8.25228 12.5324 8.0627 11.9995 8.0627C11.4665 8.0627 11.0104 8.25246 10.6312 8.63199C10.2521 9.01153 10.0625 9.46778 10.0625 10.0007C10.0625 10.5337 10.2523 10.9898 10.6318 11.3689C11.0113 11.7481 11.4676 11.9377 12.0006 11.9377Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Lock.tsx b/apps/scandic-web/components/Icons/Lock.tsx
deleted file mode 100644
index 5a29f5f3b..000000000
--- a/apps/scandic-web/components/Icons/Lock.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LockIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M6.10156 21.75C5.58593 21.75 5.14452 21.5664 4.77734 21.1992C4.41015 20.832 4.22656 20.3906 4.22656 19.875V10.025C4.22656 9.50937 4.41015 9.06796 4.77734 8.70078C5.14452 8.33359 5.58593 8.15 6.10156 8.15H7.17656V6.20522C7.17656 4.86007 7.64531 3.71875 8.58281 2.78125C9.52031 1.84375 10.6599 1.375 12.0016 1.375C13.3432 1.375 14.4828 1.84375 15.4203 2.78125C16.3578 3.71875 16.8266 4.86007 16.8266 6.20522V8.15H17.9016C18.4172 8.15 18.8586 8.33359 19.2258 8.70078C19.593 9.06796 19.7766 9.50937 19.7766 10.025V19.875C19.7766 20.3906 19.593 20.832 19.2258 21.1992C18.8586 21.5664 18.4172 21.75 17.9016 21.75H6.10156ZM6.10156 19.875H17.9016V10.025H6.10156V19.875ZM12.0016 16.875C12.5309 16.875 12.9841 16.6865 13.3611 16.3095C13.7381 15.9326 13.9266 15.4794 13.9266 14.95C13.9266 14.4206 13.7381 13.9674 13.3611 13.5905C12.9841 13.2135 12.5309 13.025 12.0016 13.025C11.4722 13.025 11.019 13.2135 10.642 13.5905C10.2651 13.9674 10.0766 14.4206 10.0766 14.95C10.0766 15.4794 10.2651 15.9326 10.642 16.3095C11.019 16.6865 11.4722 16.875 12.0016 16.875ZM9.05156 8.15H14.9516V6.19615C14.9516 5.38205 14.665 4.6875 14.092 4.1125C13.519 3.5375 12.8231 3.25 12.0045 3.25C11.1859 3.25 10.4891 3.53681 9.91406 4.11042C9.33906 4.68402 9.05156 5.38055 9.05156 6.2V8.15Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Luggage.tsx b/apps/scandic-web/components/Icons/Luggage.tsx
deleted file mode 100644
index e4cf0ba21..000000000
--- a/apps/scandic-web/components/Icons/Luggage.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function LuggageIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M6.938 20.938c-.516 0-.958-.184-1.325-.551a1.806 1.806 0 0 1-.55-1.325V8c0-.533.19-.989.569-1.368.38-.38.835-.57 1.368-.57h2.063V3.237c0-.35.137-.633.412-.85a1.51 1.51 0 0 1 .963-.325h3.124c.367 0 .688.109.963.326.275.216.412.5.412.85v2.825h2.126c.515 0 .957.183 1.324.55.367.367.55.809.55 1.324v11.125c0 .516-.183.957-.55 1.325-.367.367-.809.55-1.325.55a.846.846 0 0 1-.252.624.85.85 0 0 1-.625.252.843.843 0 0 1-.622-.252.85.85 0 0 1-.25-.623H8.686c0 .25-.084.458-.252.625a.852.852 0 0 1-.625.25.843.843 0 0 1-.622-.252.85.85 0 0 1-.25-.623Zm0-1.875h10.125V7.938H6.938v11.125Zm1.813-1.125a.665.665 0 0 0 .687-.688v-7.5a.667.667 0 0 0-.69-.688.665.665 0 0 0-.685.688v7.5a.667.667 0 0 0 .688.688Zm3.25 0a.665.665 0 0 0 .687-.688v-7.5a.667.667 0 0 0-.69-.688.665.665 0 0 0-.685.688v7.5a.667.667 0 0 0 .688.688Zm3.25 0a.665.665 0 0 0 .687-.688v-7.5a.667.667 0 0 0-.69-.688.665.665 0 0 0-.685.688v7.5a.667.667 0 0 0 .688.688ZM10.438 6.063h3.124V3.438h-3.124v2.624Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Map.tsx b/apps/scandic-web/components/Icons/Map.tsx
deleted file mode 100644
index e8b1b5727..000000000
--- a/apps/scandic-web/components/Icons/Map.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function MapIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="25"
-      height="25"
-      viewBox="0 0 25 25"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M15.5 21.1943L9.5 19.0943L4.85 20.8943C4.51667 21.0277 4.20833 20.9902 3.925 20.7818C3.64167 20.5735 3.5 20.2943 3.5 19.9443V5.94434C3.5 5.72767 3.5625 5.536 3.6875 5.36934C3.8125 5.20267 3.98333 5.07767 4.2 4.99434L9.5 3.19434L15.5 5.29434L20.15 3.49434C20.4833 3.361 20.7917 3.3985 21.075 3.60684C21.3583 3.81517 21.5 4.09434 21.5 4.44434V18.4443C21.5 18.661 21.4375 18.8527 21.3125 19.0193C21.1875 19.186 21.0167 19.311 20.8 19.3943L15.5 21.1943ZM14.5 18.7443V7.04434L10.5 5.64434V17.3443L14.5 18.7443ZM16.5 18.7443L19.5 17.7443V5.89434L16.5 7.04434V18.7443ZM5.5 18.4943L8.5 17.3443V5.64434L5.5 6.64434V18.4943Z"
-        fill="white"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Measure.tsx b/apps/scandic-web/components/Icons/Measure.tsx
deleted file mode 100644
index d535ac3ab..000000000
--- a/apps/scandic-web/components/Icons/Measure.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function MeasureIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="16"
-      height="17"
-      viewBox="0 0 16 17"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M2.66634 12.2502C2.29967 12.2502 1.98579 12.1197 1.72467 11.8586C1.46356 11.5975 1.33301 11.2836 1.33301 10.9169V5.58358C1.33301 5.21691 1.46356 4.90302 1.72467 4.64191C1.98579 4.3808 2.29967 4.25024 2.66634 4.25024H13.333C13.6997 4.25024 14.0136 4.3808 14.2747 4.64191C14.5358 4.90302 14.6663 5.21691 14.6663 5.58358V10.9169C14.6663 11.2836 14.5358 11.5975 14.2747 11.8586C14.0136 12.1197 13.6997 12.2502 13.333 12.2502H2.66634ZM2.66634 10.9169H13.333V5.58358H11.333V8.25024H9.99967V5.58358H8.66634V8.25024H7.33301V5.58358H5.99967V8.25024H4.66634V5.58358H2.66634V10.9169Z"
-        fill="#787472"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Microwave.tsx b/apps/scandic-web/components/Icons/Microwave.tsx
deleted file mode 100644
index ce4c73752..000000000
--- a/apps/scandic-web/components/Icons/Microwave.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function MicrowaveIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="25"
-      height="25"
-      viewBox="0 0 25 25"
-      fill="none"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M8.247 6.938c-.323 0-.63-.06-.922-.182a4.548 4.548 0 0 1-.838-.456 29.36 29.36 0 0 0-.355-.246.664.664 0 0 0-.382-.117.863.863 0 0 0-.488.142c-.142.094-.275.21-.4.346-.09.114-.196.203-.317.267a.861.861 0 0 1-.409.095.901.901 0 0 1-.661-.274.903.903 0 0 1-.275-.663.94.94 0 0 1 .262-.65c.3-.333.644-.606 1.032-.819a2.577 2.577 0 0 1 1.26-.319c.322 0 .627.065.915.194.287.13.569.286.844.469.122.087.24.164.355.234.114.069.242.104.382.104.267 0 .583-.192.95-.575a.917.917 0 0 1 .663-.275c.258 0 .479.091.662.274a.904.904 0 0 1 .275.663.939.939 0 0 1-.263.65c-.3.333-.643.606-1.03.819a2.577 2.577 0 0 1-1.26.319Zm0 5c-.323 0-.63-.06-.922-.182a4.554 4.554 0 0 1-.838-.456 30.073 30.073 0 0 0-.355-.246.663.663 0 0 0-.382-.117.863.863 0 0 0-.488.142c-.142.094-.275.21-.4.346-.09.114-.196.203-.317.267a.862.862 0 0 1-.409.095.901.901 0 0 1-.661-.275.903.903 0 0 1-.275-.662.94.94 0 0 1 .262-.65c.3-.333.644-.606 1.032-.819a2.577 2.577 0 0 1 1.26-.319c.322 0 .627.065.915.194.287.13.569.286.844.469.122.087.24.164.355.234.114.069.242.104.382.104a.803.803 0 0 0 .519-.188 5.57 5.57 0 0 0 .431-.387 1.02 1.02 0 0 1 .305-.213.864.864 0 0 1 .357-.075c.259 0 .48.094.663.281.183.188.275.41.275.67a.939.939 0 0 1-.263.649c-.3.333-.643.606-1.03.819a2.577 2.577 0 0 1-1.26.319Zm-6.31 4c-.515 0-.957-.184-1.324-.551a1.806 1.806 0 0 1-.55-1.325V1.938c0-.516.183-.958.55-1.325.367-.367.809-.55 1.325-.55h16.125c.515 0 .957.183 1.324.55.367.367.55.809.55 1.325v12.124c0 .516-.183.958-.55 1.325-.367.367-.809.55-1.325.55H1.938Zm0-1.876h10.126V1.938H1.937v12.124Zm12 0h4.126V1.938h-4.125v12.124Zm1.6-9.124h.938a.438.438 0 0 0 .331-.138.47.47 0 0 0 .131-.337v-.938a.438.438 0 0 0-.137-.331.47.47 0 0 0-.338-.131h-.937a.438.438 0 0 0-.331.137.47.47 0 0 0-.132.337v.938c0 .133.046.244.138.331a.47.47 0 0 0 .338.131Zm.463 4c.258 0 .48-.092.663-.276A.903.903 0 0 0 16.937 8a.903.903 0 0 0-.274-.662.903.903 0 0 0-.663-.276.903.903 0 0 0-.662.276.903.903 0 0 0-.275.662c0 .258.091.48.274.662a.903.903 0 0 0 .663.275Zm0 4c.258 0 .48-.092.663-.276a.903.903 0 0 0 .274-.662.903.903 0 0 0-.274-.662.903.903 0 0 0-.663-.275.903.903 0 0 0-.662.274.903.903 0 0 0-.275.663c0 .258.091.48.274.662a.903.903 0 0 0 .663.275Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Minus.tsx b/apps/scandic-web/components/Icons/Minus.tsx
deleted file mode 100644
index 84ada8943..000000000
--- a/apps/scandic-web/components/Icons/Minus.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function MinusIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="14"
-      height="2"
-      viewBox="0 0 14 2"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M1.125 1.86249C0.877083 1.86249 0.669267 1.77842 0.50155 1.61029C0.33385 1.44217 0.25 1.23384 0.25 0.985287C0.25 0.736754 0.33385 0.529154 0.50155 0.362488C0.669267 0.195821 0.877083 0.112488 1.125 0.112488H12.875C13.1229 0.112488 13.3307 0.196555 13.4985 0.364688C13.6662 0.532805 13.75 0.741138 13.75 0.989688C13.75 1.23822 13.6662 1.44582 13.4985 1.61249C13.3307 1.77915 13.1229 1.86249 12.875 1.86249H1.125Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Mirror.tsx b/apps/scandic-web/components/Icons/Mirror.tsx
deleted file mode 100644
index f7f873a53..000000000
--- a/apps/scandic-web/components/Icons/Mirror.tsx
+++ /dev/null
@@ -1,25 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function MirrorIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M5.26544 9.89998H5.87357C6.53214 12.6815 8.99277 14.7 12.0001 14.7C15.0074 14.7 17.468 12.6815 18.1266 9.89998H18.7347C18.0448 12.9797 15.2797 15.3 12 15.3C8.72041 15.3 5.95525 12.9797 5.26544 9.89998ZM18.9446 8.09998C18.9856 7.96928 19.055 7.85077 19.1529 7.75287C19.3218 7.58403 19.5519 7.5 19.8 7.5C20.0482 7.5 20.2783 7.58403 20.4472 7.75287C20.616 7.9217 20.7 8.15183 20.7 8.4C20.7 12.9416 17.3143 16.6123 12.9 17.0552V20.1H15.0001C15.2483 20.1 15.4784 20.1841 15.6472 20.3529C15.8161 20.5217 15.9001 20.7519 15.9001 21C15.9001 21.2482 15.8161 21.4783 15.6472 21.6472C15.4784 21.816 15.2483 21.9 15.0001 21.9H9.0001C8.75192 21.9 8.5218 21.816 8.35297 21.6472C8.18413 21.4783 8.1001 21.2482 8.1001 21C8.1001 20.7519 8.18413 20.5217 8.35297 20.3529C8.5218 20.1841 8.75192 20.1 9.0001 20.1H11.1V17.0551C6.68567 16.6122 3.30005 12.9415 3.30005 8.4C3.30005 8.15183 3.38408 7.9217 3.55292 7.75287C3.72175 7.58403 3.95187 7.5 4.20005 7.5C4.44822 7.5 4.67835 7.58403 4.84718 7.75287C4.94508 7.85077 5.01447 7.96928 5.0555 8.09998H5.70681C5.85905 4.71819 8.57502 2.09998 12.0001 2.09998C15.4251 2.09998 18.1411 4.71819 18.2933 8.09998H18.9446ZM12.0001 3.89998C9.52576 3.89998 7.50007 5.92566 7.50007 8.39998C7.50007 10.8743 9.52576 12.9 12.0001 12.9C14.4744 12.9 16.5001 10.8743 16.5001 8.39998C16.5001 5.92566 14.4744 3.89998 12.0001 3.89998ZM13.108 8.42789C12.7508 8.78504 12.7508 9.33499 13.108 9.69215C13.2345 9.81866 13.4 9.86247 13.5108 9.88094C13.6255 9.90006 13.7361 9.90003 13.7956 9.90002L13.8071 9.90002C13.8639 9.90007 13.9791 9.90015 14.0839 9.87919C14.1372 9.86854 14.2177 9.84713 14.2915 9.79605L14.3059 9.78613C14.3607 9.74859 14.4548 9.68419 14.5201 9.60002L15.5722 8.49215C15.9294 8.13499 15.9294 7.58504 15.5722 7.22789C15.2151 6.87073 14.6651 6.87073 14.308 7.22789L13.108 8.42789ZM10.8495 9.5809C10.9603 9.56244 11.0691 9.52149 11.2523 9.39212L14.1347 6.38975C14.4895 6.03253 14.4887 5.48422 14.1323 5.12785C13.7752 4.7707 13.2252 4.7707 12.868 5.12785L9.86805 8.12785C9.51089 8.48501 9.51089 9.03496 9.86805 9.39212C9.99455 9.51862 10.1601 9.56244 10.2709 9.5809C10.3856 9.60002 10.4962 9.6 10.5556 9.59999H10.5557H10.5647H10.5647C10.6242 9.6 10.7348 9.60002 10.8495 9.5809Z"
-        fill="black"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Museum.tsx b/apps/scandic-web/components/Icons/Museum.tsx
deleted file mode 100644
index 5cbada97a..000000000
--- a/apps/scandic-web/components/Icons/Museum.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function MuseumIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M2.5 21V19.1H4.4V10.55H2.5V8.65L12 2L21.5 8.65V10.55H19.6V19.1H21.5V21H2.5ZM8.2 17.2H10.1V13.4L12 16.25L13.9 13.4V17.2H15.8V10.55H13.9L12 13.4L10.1 10.55H8.2V17.2ZM17.7 19.1V8.3175L12 4.3275L6.3 8.3175V19.1H17.7Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Nature.tsx b/apps/scandic-web/components/Icons/Nature.tsx
deleted file mode 100644
index 592620ab9..000000000
--- a/apps/scandic-web/components/Icons/Nature.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function NatureIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5 22V20H11V16H9C7.61667 16 6.4375 15.5125 5.4625 14.5375C4.4875 13.5625 4 12.3833 4 11C4 10 4.275 9.07917 4.825 8.2375C5.375 7.39583 6.11667 6.78333 7.05 6.4C7.2 5.15 7.74583 4.10417 8.6875 3.2625C9.62917 2.42083 10.7333 2 12 2C13.2667 2 14.3708 2.42083 15.3125 3.2625C16.2542 4.10417 16.8 5.15 16.95 6.4C17.8833 6.78333 18.625 7.39583 19.175 8.2375C19.725 9.07917 20 10 20 11C20 12.3833 19.5125 13.5625 18.5375 14.5375C17.5625 15.5125 16.3833 16 15 16H13V20H19V22H5ZM9 14H15C15.8333 14 16.5417 13.7083 17.125 13.125C17.7083 12.5417 18 11.8333 18 11C18 10.4 17.8292 9.85 17.4875 9.35C17.1458 8.85 16.7 8.48333 16.15 8.25L15.1 7.8L14.95 6.65C14.85 5.9 14.5208 5.27083 13.9625 4.7625C13.4042 4.25417 12.75 4 12 4C11.25 4 10.5958 4.25417 10.0375 4.7625C9.47917 5.27083 9.15 5.9 9.05 6.65L8.9 7.8L7.85 8.25C7.3 8.48333 6.85417 8.85 6.5125 9.35C6.17083 9.85 6 10.4 6 11C6 11.8333 6.29167 12.5417 6.875 13.125C7.45833 13.7083 8.16667 14 9 14Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Nightlife.tsx b/apps/scandic-web/components/Icons/Nightlife.tsx
deleted file mode 100644
index 817f2ed5d..000000000
--- a/apps/scandic-web/components/Icons/Nightlife.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function NightlifeIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M7.06249 17.975V13.9L2.22499 6.64995C2.00833 6.34162 1.99166 6.02287 2.17499 5.6937C2.35833 5.36453 2.63749 5.19995 3.01249 5.19995H12.9875C13.3625 5.19995 13.6417 5.36453 13.825 5.6937C14.0083 6.02287 13.9917 6.34162 13.775 6.64995L8.93749 13.9V17.975H9.97499C10.2333 17.975 10.4542 18.0666 10.6375 18.25C10.8208 18.4333 10.9125 18.6541 10.9125 18.9125C10.9125 19.1708 10.8208 19.3916 10.6375 19.575C10.4542 19.7583 10.2333 19.85 9.97499 19.85H6.02499C5.76666 19.85 5.54583 19.7583 5.36249 19.575C5.17916 19.3916 5.08749 19.1708 5.08749 18.9125C5.08749 18.6541 5.17916 18.4333 5.36249 18.25C5.54583 18.0666 5.76666 17.975 6.02499 17.975H7.06249ZM5.93749 9.04995H10.0875L11.4625 7.07495H4.56249L5.93749 9.04995ZM15.8625 19.85C15.0542 19.85 14.3646 19.5645 13.7937 18.9937C13.2229 18.4229 12.9375 17.7333 12.9375 16.925C12.9375 16.1166 13.2229 15.427 13.7937 14.8562C14.3646 14.2854 15.0542 14 15.8625 14C16.0458 14 16.225 14.0145 16.4 14.0437C16.575 14.0729 16.7458 14.1333 16.9125 14.225V6.13745C16.9125 5.87912 17.0042 5.65828 17.1875 5.47495C17.3708 5.29162 17.5917 5.19995 17.85 5.19995H20.3125C20.7125 5.19995 21.05 5.33745 21.325 5.61245C21.6 5.88745 21.7375 6.22495 21.7375 6.62495C21.7375 7.02495 21.6 7.36245 21.325 7.63745C21.05 7.91245 20.7125 8.04995 20.3125 8.04995H18.7875V16.925C18.7875 17.7333 18.5021 18.4229 17.9312 18.9937C17.3604 19.5645 16.6708 19.85 15.8625 19.85Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/NoBreakfast.tsx b/apps/scandic-web/components/Icons/NoBreakfast.tsx
deleted file mode 100644
index 063b5defe..000000000
--- a/apps/scandic-web/components/Icons/NoBreakfast.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function NoBreakfastIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="33"
-      viewBox="0 0 32 33"
-      width="32"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M28.4824 25.3833L26.1824 23.0833L27.4991 10H15.0324L14.8991 8.9C14.8546 8.52223 14.9546 8.19445 15.1991 7.91667C15.4435 7.63889 15.7546 7.5 16.1324 7.5H21.2324V3.48334C21.2324 3.13889 21.3546 2.84445 21.5991 2.6C21.8435 2.35556 22.138 2.23334 22.4824 2.23334C22.8269 2.23334 23.1213 2.35556 23.3658 2.6C23.6102 2.84445 23.7324 3.13889 23.7324 3.48334V7.5H28.8824C29.2602 7.5 29.5741 7.63334 29.8241 7.9C30.0741 8.16667 30.1769 8.48889 30.1324 8.86667L28.4824 25.3833ZM26.3324 30.35L2.18242 6.21667C1.92687 5.96111 1.79909 5.66389 1.79909 5.325C1.79909 4.98612 1.92687 4.68889 2.18242 4.43334C2.43798 4.17778 2.7352 4.05 3.07409 4.05C3.41298 4.05 3.7102 4.17778 3.96576 4.43334L28.1158 28.5833C28.3713 28.8389 28.4991 29.1333 28.4991 29.4667C28.4991 29.8 28.3713 30.0944 28.1158 30.35C27.8602 30.6056 27.563 30.7333 27.2241 30.7333C26.8852 30.7333 26.588 30.6056 26.3324 30.35ZM2.98242 25.75C2.63798 25.75 2.34353 25.6278 2.09909 25.3833C1.85464 25.1389 1.73242 24.8444 1.73242 24.5C1.73242 24.1556 1.85464 23.8611 2.09909 23.6167C2.34353 23.3722 2.63798 23.25 2.98242 23.25H19.9491C20.2935 23.25 20.588 23.3722 20.8324 23.6167C21.0769 23.8611 21.1991 24.1556 21.1991 24.5C21.1991 24.8444 21.0769 25.1389 20.8324 25.3833C20.588 25.6278 20.2935 25.75 19.9491 25.75H2.98242ZM2.98242 30.8333C2.63798 30.8333 2.34353 30.7111 2.09909 30.4667C1.85464 30.2222 1.73242 29.9278 1.73242 29.5833C1.73242 29.2389 1.85464 28.9444 2.09909 28.7C2.34353 28.4556 2.63798 28.3333 2.98242 28.3333H19.9491C20.2935 28.3333 20.588 28.4556 20.8324 28.7C21.0769 28.9444 21.1991 29.2389 21.1991 29.5833C21.1991 29.9278 21.0769 30.2222 20.8324 30.4667C20.588 30.7111 20.2935 30.8333 19.9491 30.8333H2.98242ZM12.7491 13.2167V15.7167C12.538 15.6944 12.3241 15.675 12.1074 15.6583C11.8908 15.6417 11.6769 15.6333 11.4658 15.6333C10.1546 15.6333 8.91853 15.8444 7.75742 16.2667C6.59631 16.6889 5.69909 17.3333 5.06575 18.2H17.7324L20.2324 20.7H3.26576C2.86576 20.7 2.54076 20.55 2.29076 20.25C2.04076 19.95 1.95464 19.6 2.03242 19.2C2.25464 18.1111 2.68242 17.1806 3.31576 16.4083C3.94909 15.6361 4.69909 15.0056 5.56575 14.5167C6.43242 14.0278 7.37964 13.675 8.40742 13.4583C9.4352 13.2417 10.4546 13.1333 11.4658 13.1333C11.6769 13.1333 11.8908 13.1417 12.1074 13.1583C12.3241 13.175 12.538 13.1944 12.7491 13.2167Z"
-        fill="#787472"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/NoSmoking.tsx b/apps/scandic-web/components/Icons/NoSmoking.tsx
deleted file mode 100644
index 9ca2be0de..000000000
--- a/apps/scandic-web/components/Icons/NoSmoking.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function NoSmokingIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M3.6999 15.825C3.31795 15.825 2.9933 15.6912 2.72595 15.4236C2.45859 15.1559 2.3249 14.8309 2.3249 14.4486C2.3249 14.0662 2.45859 13.7417 2.72595 13.475C2.9933 13.2084 3.31795 13.075 3.6999 13.075H10.5499L1.7749 4.30005L3.0999 3.00005L21.0999 21L19.7999 22.325L13.2999 15.825H3.6999ZM18.5889 13.075C18.7879 13.075 18.952 13.14 19.0812 13.2698C19.2103 13.3997 19.2749 13.5639 19.2749 13.7625V15.1375C19.2749 15.3459 19.2136 15.5125 19.091 15.6375C18.9684 15.7625 18.8172 15.825 18.6374 15.825H18.5749L17.8999 15.15V13.7625C17.8999 13.5639 17.965 13.3997 18.0951 13.2698C18.2252 13.14 18.3898 13.075 18.5889 13.075ZM20.9639 13.075C21.1629 13.075 21.327 13.14 21.4562 13.27C21.5853 13.4 21.6499 13.5644 21.6499 13.7631V15.1394C21.6499 15.3382 21.5848 15.5021 21.4547 15.6313C21.3246 15.7605 21.16 15.825 20.961 15.825C20.7619 15.825 20.5978 15.7601 20.4687 15.6301C20.3395 15.5001 20.2749 15.3357 20.2749 15.1369V13.7607C20.2749 13.5619 20.34 13.398 20.4701 13.2688C20.6002 13.1396 20.7648 13.075 20.9639 13.075ZM15.8249 13.075H16.2374C16.436 13.075 16.6003 13.14 16.7301 13.2698C16.86 13.3997 16.9249 13.5639 16.9249 13.7625V14.175L15.8249 13.075ZM18.586 12.025C18.3869 12.025 18.2228 11.9601 18.0937 11.8302C17.9645 11.7004 17.8999 11.5362 17.8999 11.3375V10.75C17.8999 10.125 17.7132 9.63963 17.3397 9.2938C16.9662 8.94797 16.5196 8.77505 15.9999 8.77505H14.4499C13.5582 8.77505 12.8062 8.4646 12.1937 7.8437C11.5812 7.22281 11.2749 6.4666 11.2749 5.57505C11.2749 4.69172 11.5812 3.93755 12.1937 3.31255C12.8062 2.68755 13.5582 2.37505 14.4499 2.37505C14.6485 2.37505 14.8128 2.44012 14.9426 2.57025C15.0725 2.70038 15.1374 2.86497 15.1374 3.064C15.1374 3.26303 15.0725 3.42713 14.9426 3.5563C14.8128 3.68547 14.6485 3.75005 14.4499 3.75005C13.9582 3.75005 13.5353 3.92505 13.1812 4.27505C12.827 4.62505 12.6499 5.05838 12.6499 5.57505C12.6499 6.09172 12.827 6.52505 13.1812 6.87505C13.5353 7.22505 13.9582 7.40005 14.4499 7.40005H15.9999C16.8916 7.40005 17.6603 7.69172 18.3062 8.27505C18.952 8.85838 19.2749 9.58338 19.2749 10.45V11.3375C19.2749 11.5362 19.2098 11.7004 19.0797 11.8302C18.9496 11.9601 18.785 12.025 18.586 12.025ZM20.961 12.025C20.7619 12.025 20.5978 11.9601 20.4687 11.8302C20.3395 11.7004 20.2749 11.5362 20.2749 11.3375V9.82505C20.2749 8.73338 19.8964 7.80213 19.1393 7.0313C18.3822 6.26047 17.4441 5.87505 16.3249 5.87505C16.1263 5.87505 15.9621 5.80998 15.8322 5.67985C15.7023 5.54972 15.6374 5.38513 15.6374 5.1861C15.6374 4.98707 15.7023 4.82297 15.8322 4.6938C15.9621 4.56463 16.1263 4.50005 16.3249 4.50005C16.8182 4.50005 17.2456 4.31919 17.6073 3.95747C17.969 3.59577 18.1499 3.1683 18.1499 2.67505C18.1499 2.47643 18.215 2.3122 18.3451 2.18235C18.4752 2.05248 18.6398 1.98755 18.8389 1.98755C19.0379 1.98755 19.202 2.05248 19.3312 2.18235C19.4603 2.3122 19.5249 2.47643 19.5249 2.67505C19.5249 3.14172 19.4332 3.5688 19.2499 3.9563C19.0666 4.3438 18.8249 4.68972 18.5249 4.99407C19.4332 5.38972 20.1812 6.02088 20.7687 6.88755C21.3562 7.75422 21.6499 8.73338 21.6499 9.82505V11.3375C21.6499 11.5362 21.5848 11.7004 21.4547 11.8302C21.3246 11.9601 21.16 12.025 20.961 12.025Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/OpenInNew.tsx b/apps/scandic-web/components/Icons/OpenInNew.tsx
deleted file mode 100644
index fa42ddb24..000000000
--- a/apps/scandic-web/components/Icons/OpenInNew.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function OpenInNewIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5.09998 20.775C4.58434 20.775 4.14293 20.5914 3.77575 20.2242C3.40857 19.857 3.22498 19.4156 3.22498 18.9V5.09998C3.22498 4.58434 3.40857 4.14293 3.77575 3.77575C4.14293 3.40857 4.58434 3.22498 5.09998 3.22498H10.9875C11.2458 3.22498 11.4666 3.31664 11.65 3.49998C11.8333 3.68331 11.925 3.90414 11.925 4.16248C11.925 4.42081 11.8333 4.64164 11.65 4.82498C11.4666 5.00831 11.2458 5.09998 10.9875 5.09998H5.09998V18.9H18.9V13.0125C18.9 12.7541 18.9916 12.5333 19.175 12.35C19.3583 12.1666 19.5791 12.075 19.8375 12.075C20.0958 12.075 20.3166 12.1666 20.5 12.35C20.6833 12.5333 20.775 12.7541 20.775 13.0125V18.9C20.775 19.4156 20.5914 19.857 20.2242 20.2242C19.857 20.5914 19.4156 20.775 18.9 20.775H5.09998ZM18.9 6.41248L10.3875 14.925C10.2125 15.1 9.99789 15.1875 9.74373 15.1875C9.48956 15.1875 9.27081 15.0958 9.08748 14.9125C8.90414 14.7291 8.81248 14.5104 8.81248 14.2562C8.81248 14.0021 8.90311 13.7843 9.08438 13.6031L17.5875 5.09998H14.7375C14.4791 5.09998 14.2583 5.00831 14.075 4.82498C13.8916 4.64164 13.8 4.42081 13.8 4.16248C13.8 3.90414 13.8916 3.68331 14.075 3.49998C14.2583 3.31664 14.4791 3.22498 14.7375 3.22498H20.775V9.26248C20.775 9.52081 20.6833 9.74164 20.5 9.92498C20.3166 10.1083 20.0958 10.2 19.8375 10.2C19.5791 10.2 19.3583 10.1083 19.175 9.92498C18.9916 9.74164 18.9 9.52081 18.9 9.26248V6.41248Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/OpenInNewSmall.tsx b/apps/scandic-web/components/Icons/OpenInNewSmall.tsx
deleted file mode 100644
index a7ff6547f..000000000
--- a/apps/scandic-web/components/Icons/OpenInNewSmall.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function OpenInNewSmallIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.58333 16.8125C4.19949 16.8125 3.87088 16.6758 3.59752 16.4025C3.32417 16.1291 3.1875 15.8005 3.1875 15.4167V4.58333C3.1875 4.19947 3.32417 3.87087 3.59752 3.59752C3.87088 3.32417 4.19949 3.1875 4.58333 3.1875H9.9375V4.58333H4.58333V15.4167H15.4167V10.0625H16.8125V15.4167C16.8125 15.8005 16.6758 16.1291 16.4025 16.4025C16.1291 16.6758 15.8005 16.8125 15.4167 16.8125H4.58333ZM8.09375 12.8958L7.10417 11.9062L14.4271 4.58333H11.8333V3.1875H16.8125V8.16667H15.4167V5.57292L8.09375 12.8958Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/OutdoorFurniture.tsx b/apps/scandic-web/components/Icons/OutdoorFurniture.tsx
deleted file mode 100644
index d0cdb78f3..000000000
--- a/apps/scandic-web/components/Icons/OutdoorFurniture.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function OutdoorFurnitureIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.0625 20.8625V9.00002H3.77497C3.54164 9.00002 3.39164 8.89169 3.32497 8.67502C3.25831 8.45836 3.32081 8.28336 3.51247 8.15002L11.4625 2.57502C11.6291 2.45836 11.8083 2.40002 12 2.40002C12.1916 2.40002 12.3708 2.45836 12.5375 2.57502L20.4875 8.15002C20.6791 8.28336 20.7416 8.45836 20.675 8.67502C20.6083 8.89169 20.4583 9.00002 20.225 9.00002H12.9375V20.8625C12.9375 21.1209 12.8458 21.3417 12.6625 21.525C12.4791 21.7084 12.2583 21.8 12 21.8C11.7416 21.8 11.5208 21.7084 11.3375 21.525C11.1541 21.3417 11.0625 21.1209 11.0625 20.8625ZM3.17497 20.8625V16.675L2.56247 13.2875C2.52081 13.0292 2.57289 12.7959 2.71872 12.5875C2.86456 12.3792 3.06664 12.2542 3.32497 12.2125C3.57497 12.1709 3.80206 12.2209 4.00622 12.3625C4.21039 12.5042 4.33747 12.7 4.38747 12.95L4.97497 15.975H8.06247C8.32081 15.975 8.54164 16.0667 8.72497 16.25C8.90831 16.4334 8.99997 16.6542 8.99997 16.9125V20.8625C8.99997 21.1209 8.90831 21.3417 8.72497 21.525C8.54164 21.7084 8.32081 21.8 8.06247 21.8C7.80414 21.8 7.58331 21.7084 7.39997 21.525C7.21664 21.3417 7.12497 21.1209 7.12497 20.8625V17.85H5.04997V20.8625C5.04997 21.1209 4.95831 21.3417 4.77497 21.525C4.59164 21.7084 4.37081 21.8 4.11247 21.8C3.85414 21.8 3.63331 21.7084 3.44997 21.525C3.26664 21.3417 3.17497 21.1209 3.17497 20.8625ZM15 20.8625V16.9125C15 16.6542 15.0916 16.4334 15.275 16.25C15.4583 16.0667 15.6791 15.975 15.9375 15.975H19.025L19.6125 12.95C19.6625 12.7 19.7896 12.5042 19.9937 12.3625C20.1979 12.2209 20.4291 12.1709 20.6875 12.2125C20.9458 12.2542 21.1458 12.3792 21.2875 12.5875C21.4291 12.7959 21.4791 13.0292 21.4375 13.2875L20.825 16.675V20.8625C20.825 21.1209 20.7333 21.3417 20.55 21.525C20.3666 21.7084 20.1458 21.8 19.8875 21.8C19.6291 21.8 19.4083 21.7084 19.225 21.525C19.0416 21.3417 18.95 21.1209 18.95 20.8625V17.85H16.875V20.8625C16.875 21.1209 16.7833 21.3417 16.6 21.525C16.4166 21.7084 16.1958 21.8 15.9375 21.8C15.6791 21.8 15.4583 21.7084 15.275 21.525C15.0916 21.3417 15 21.1209 15 20.8625ZM8.24997 7.12502H15.75L12 4.50002L8.24997 7.12502Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Parking.tsx b/apps/scandic-web/components/Icons/Parking.tsx
deleted file mode 100644
index cbcf30927..000000000
--- a/apps/scandic-web/components/Icons/Parking.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ParkingIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M9.94995 14.9V18.875C9.94995 19.3906 9.76625 19.832 9.39885 20.1992C9.03143 20.5664 8.58977 20.75 8.07385 20.75C7.55792 20.75 7.11662 20.5664 6.74995 20.1992C6.38328 19.832 6.19995 19.3906 6.19995 18.875V5.125C6.19995 4.60937 6.38354 4.16796 6.75073 3.80078C7.11791 3.43359 7.55932 3.25 8.07495 3.25H13C14.6 3.25 15.9666 3.82083 17.1 4.9625C18.2333 6.10417 18.8 7.475 18.8 9.075C18.8 10.675 18.2333 12.0458 17.1 13.1875C15.9666 14.3292 14.6 14.9 13 14.9H9.94995ZM9.94995 11.15H13.075C13.6456 11.15 14.1341 10.9468 14.5404 10.5405C14.9468 10.1341 15.15 9.64562 15.15 9.075C15.15 8.50438 14.9468 8.01589 14.5404 7.60952C14.1341 7.20317 13.6456 7 13.075 7H9.94995V11.15Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/People2.tsx b/apps/scandic-web/components/Icons/People2.tsx
deleted file mode 100644
index 55f16de36..000000000
--- a/apps/scandic-web/components/Icons/People2.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function People2Icon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M1 20V17.2C1 16.6333 1.14583 16.1125 1.4375 15.6375C1.72917 15.1625 2.11667 14.8 2.6 14.55C3.63333 14.0333 4.68333 13.6458 5.75 13.3875C6.81667 13.1292 7.9 13 9 13C10.1 13 11.1833 13.1292 12.25 13.3875C13.3167 13.6458 14.3667 14.0333 15.4 14.55C15.8833 14.8 16.2708 15.1625 16.5625 15.6375C16.8542 16.1125 17 16.6333 17 17.2V20H1ZM19 20V17C19 16.2667 18.7958 15.5625 18.3875 14.8875C17.9792 14.2125 17.4 13.6333 16.65 13.15C17.5 13.25 18.3 13.4208 19.05 13.6625C19.8 13.9042 20.5 14.2 21.15 14.55C21.75 14.8833 22.2083 15.2542 22.525 15.6625C22.8417 16.0708 23 16.5167 23 17V20H19ZM9 12C7.9 12 6.95833 11.6083 6.175 10.825C5.39167 10.0417 5 9.1 5 8C5 6.9 5.39167 5.95833 6.175 5.175C6.95833 4.39167 7.9 4 9 4C10.1 4 11.0417 4.39167 11.825 5.175C12.6083 5.95833 13 6.9 13 8C13 9.1 12.6083 10.0417 11.825 10.825C11.0417 11.6083 10.1 12 9 12ZM19 8C19 9.1 18.6083 10.0417 17.825 10.825C17.0417 11.6083 16.1 12 15 12C14.8167 12 14.5833 11.9792 14.3 11.9375C14.0167 11.8958 13.7833 11.85 13.6 11.8C14.05 11.2667 14.3958 10.675 14.6375 10.025C14.8792 9.375 15 8.7 15 8C15 7.3 14.8792 6.625 14.6375 5.975C14.3958 5.325 14.05 4.73333 13.6 4.2C13.8333 4.11667 14.0667 4.0625 14.3 4.0375C14.5333 4.0125 14.7667 4 15 4C16.1 4 17.0417 4.39167 17.825 5.175C18.6083 5.95833 19 6.9 19 8ZM3 18H15V17.2C15 17.0167 14.9542 16.85 14.8625 16.7C14.7708 16.55 14.65 16.4333 14.5 16.35C13.6 15.9 12.6917 15.5625 11.775 15.3375C10.8583 15.1125 9.93333 15 9 15C8.06667 15 7.14167 15.1125 6.225 15.3375C5.30833 15.5625 4.4 15.9 3.5 16.35C3.35 16.4333 3.22917 16.55 3.1375 16.7C3.04583 16.85 3 17.0167 3 17.2V18ZM9 10C9.55 10 10.0208 9.80417 10.4125 9.4125C10.8042 9.02083 11 8.55 11 8C11 7.45 10.8042 6.97917 10.4125 6.5875C10.0208 6.19583 9.55 6 9 6C8.45 6 7.97917 6.19583 7.5875 6.5875C7.19583 6.97917 7 7.45 7 8C7 8.55 7.19583 9.02083 7.5875 9.4125C7.97917 9.80417 8.45 10 9 10Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Person.tsx b/apps/scandic-web/components/Icons/Person.tsx
deleted file mode 100644
index 5f2671194..000000000
--- a/apps/scandic-web/components/Icons/Person.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function PersonIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12 12.025C10.925 12.025 10.0104 11.6479 9.25623 10.8938C8.50206 10.1396 8.12498 9.22503 8.12498 8.15002C8.12498 7.07502 8.50206 6.16044 9.25623 5.40627C10.0104 4.65211 10.925 4.27502 12 4.27502C13.075 4.27502 13.9896 4.65211 14.7437 5.40627C15.4979 6.16044 15.875 7.07502 15.875 8.15002C15.875 9.22503 15.4979 10.1396 14.7437 10.8938C13.9896 11.6479 13.075 12.025 12 12.025ZM4.22498 17.8V17.0243C4.22498 16.4748 4.36456 15.9729 4.64373 15.5188C4.92289 15.0646 5.30016 14.7166 5.77553 14.4748C6.79183 13.9749 7.81873 13.5979 8.85623 13.3438C9.89373 13.0896 10.9416 12.9625 12 12.9625C13.0583 12.9625 14.1062 13.0896 15.1437 13.3438C16.1812 13.5979 17.2081 13.9749 18.2244 14.4748C18.6998 14.7166 19.0771 15.0646 19.3562 15.5188C19.6354 15.9729 19.775 16.4748 19.775 17.0243V17.8C19.775 18.3157 19.5914 18.7571 19.2242 19.1243C18.857 19.4914 18.4156 19.675 17.9 19.675H6.09998C5.58434 19.675 5.14293 19.4914 4.77575 19.1243C4.40857 18.7571 4.22498 18.3157 4.22498 17.8ZM6.09998 17.8H17.9V17.025C17.9 16.8385 17.8541 16.669 17.7625 16.5164C17.6708 16.3638 17.5458 16.2459 17.3875 16.1625C16.4958 15.7209 15.6027 15.3896 14.7081 15.1688C13.8135 14.9479 12.9108 14.8375 12 14.8375C11.0833 14.8375 10.1791 14.9479 9.28748 15.1688C8.39581 15.3896 7.50414 15.7209 6.61248 16.1625C6.45414 16.2459 6.32914 16.3638 6.23748 16.5164C6.14581 16.669 6.09998 16.8385 6.09998 17.025V17.8ZM12 10.15C12.55 10.15 13.0208 9.95419 13.4125 9.56252C13.8041 9.17086 14 8.70003 14 8.15002C14 7.60002 13.8041 7.12919 13.4125 6.73752C13.0208 6.34586 12.55 6.15002 12 6.15002C11.45 6.15002 10.9791 6.34586 10.5875 6.73752C10.1958 7.12919 9.99998 7.60002 9.99998 8.15002C9.99998 8.70003 10.1958 9.17086 10.5875 9.56252C10.9791 9.95419 11.45 10.15 12 10.15Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Pets.tsx b/apps/scandic-web/components/Icons/Pets.tsx
deleted file mode 100644
index e5e475b2e..000000000
--- a/apps/scandic-web/components/Icons/Pets.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function PetsIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.6251 12.05C3.95843 12.05 3.39176 11.8166 2.9251 11.35C2.45843 10.8833 2.2251 10.3166 2.2251 9.64995C2.2251 8.98328 2.45843 8.41662 2.9251 7.94995C3.39176 7.48328 3.95843 7.24995 4.6251 7.24995C5.29176 7.24995 5.85843 7.48328 6.3251 7.94995C6.79176 8.41662 7.0251 8.98328 7.0251 9.64995C7.0251 10.3166 6.79176 10.8833 6.3251 11.35C5.85843 11.8166 5.29176 12.05 4.6251 12.05ZM9.0501 8.12495C8.38343 8.12495 7.81676 7.89162 7.3501 7.42495C6.88343 6.95828 6.6501 6.39162 6.6501 5.72495C6.6501 5.05828 6.88343 4.49162 7.3501 4.02495C7.81676 3.55828 8.38343 3.32495 9.0501 3.32495C9.71676 3.32495 10.2834 3.55828 10.7501 4.02495C11.2168 4.49162 11.4501 5.05828 11.4501 5.72495C11.4501 6.39162 11.2168 6.95828 10.7501 7.42495C10.2834 7.89162 9.71676 8.12495 9.0501 8.12495ZM14.9751 8.12495C14.3084 8.12495 13.7418 7.89162 13.2751 7.42495C12.8084 6.95828 12.5751 6.39162 12.5751 5.72495C12.5751 5.05828 12.8084 4.49162 13.2751 4.02495C13.7418 3.55828 14.3084 3.32495 14.9751 3.32495C15.6418 3.32495 16.2084 3.55828 16.6751 4.02495C17.1418 4.49162 17.3751 5.05828 17.3751 5.72495C17.3751 6.39162 17.1418 6.95828 16.6751 7.42495C16.2084 7.89162 15.6418 8.12495 14.9751 8.12495ZM19.4001 12.05C18.7334 12.05 18.1668 11.8166 17.7001 11.35C17.2334 10.8833 17.0001 10.3166 17.0001 9.64995C17.0001 8.98328 17.2334 8.41662 17.7001 7.94995C18.1668 7.48328 18.7334 7.24995 19.4001 7.24995C20.0668 7.24995 20.6334 7.48328 21.1001 7.94995C21.5668 8.41662 21.8001 8.98328 21.8001 9.64995C21.8001 10.3166 21.5668 10.8833 21.1001 11.35C20.6334 11.8166 20.0668 12.05 19.4001 12.05ZM6.7559 21.925C6.0187 21.925 5.40426 21.6474 4.9126 21.0922C4.42093 20.537 4.1751 19.8813 4.1751 19.125C4.1751 18.2666 4.4626 17.5187 5.0376 16.8812C5.6126 16.2437 6.19176 15.615 6.7751 14.995C7.25843 14.4893 7.6751 13.9387 8.0251 13.3432C8.3751 12.7477 8.78343 12.1833 9.2501 11.65C9.60843 11.2416 10.0188 10.8979 10.4813 10.6187C10.9438 10.3395 11.4506 10.2 12.0015 10.2C12.5524 10.2 13.0628 10.3333 13.5327 10.6C14.0026 10.8666 14.4168 11.2083 14.7751 11.625C15.2418 12.15 15.6522 12.7125 16.0063 13.3125C16.3605 13.9125 16.7755 14.4753 17.2513 15.001C17.8255 15.6253 18.4022 16.2541 18.9813 16.8875C19.5605 17.5208 19.8501 18.2666 19.8501 19.125C19.8501 19.8813 19.6043 20.537 19.1126 21.0922C18.6209 21.6474 18.0073 21.925 17.2718 21.925C16.3892 21.925 15.5147 21.85 14.6484 21.7C13.7822 21.55 12.9077 21.475 12.0251 21.475C11.1334 21.475 10.2535 21.55 9.38522 21.7C8.51697 21.85 7.64053 21.925 6.7559 21.925Z"
-        fill="#787472"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Phone.tsx b/apps/scandic-web/components/Icons/Phone.tsx
deleted file mode 100644
index a63adc769..000000000
--- a/apps/scandic-web/components/Icons/Phone.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function PhoneIcon({
-  className,
-  color,
-  height = "24",
-  width = "24",
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height={height}
-      viewBox="0 0 24 24"
-      width={width}
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M19.725 20.75C17.725 20.75 15.7375 20.3063 13.7625 19.4188C11.7875 18.5313 9.9875 17.2708 8.3625 15.6375C6.72917 14.0125 5.46875 12.2125 4.58125 10.2375C3.69375 8.2625 3.25 6.2734 3.25 4.2702C3.25 3.98173 3.34762 3.73958 3.54285 3.54375C3.7381 3.34792 3.98215 3.25 4.275 3.25H8.15C8.38333 3.25 8.58542 3.32292 8.75625 3.46875C8.92708 3.61458 9.03333 3.8 9.075 4.025L9.725 7.425C9.75833 7.65 9.74792 7.85208 9.69375 8.03125C9.63958 8.21042 9.55 8.36667 9.425 8.5L7.0625 10.9C7.40417 11.5167 7.79766 12.1082 8.24297 12.6747C8.68829 13.2412 9.17813 13.7871 9.7125 14.3125C10.2125 14.8125 10.7438 15.2833 11.3063 15.725C11.8688 16.1667 12.4667 16.575 13.1 16.95L15.475 14.6C15.6167 14.4583 15.7833 14.3583 15.975 14.3C16.1667 14.2417 16.3667 14.225 16.575 14.25L19.95 14.925C20.1833 14.9833 20.375 15.1013 20.525 15.2788C20.675 15.4564 20.75 15.6552 20.75 15.875V19.725C20.75 20.0179 20.6524 20.2619 20.4572 20.4572C20.2619 20.6524 20.0179 20.75 19.725 20.75ZM6.1625 9.125L7.8125 7.475L7.375 5.125H5.1625C5.22917 5.79167 5.34167 6.4625 5.5 7.1375C5.65833 7.8125 5.87917 8.475 6.1625 9.125ZM14.8625 17.825C15.5042 18.1083 16.1625 18.3333 16.8375 18.5C17.5125 18.6667 18.1917 18.775 18.875 18.825V16.625L16.575 16.1375L14.8625 17.825Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Plus.tsx b/apps/scandic-web/components/Icons/Plus.tsx
deleted file mode 100644
index b8826bb2f..000000000
--- a/apps/scandic-web/components/Icons/Plus.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function PlusIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="14"
-      height="14"
-      viewBox="0 0 14 14"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6.125 7.86249H1.125C0.877083 7.86249 0.669267 7.77842 0.50155 7.61029C0.33385 7.44217 0.25 7.23384 0.25 6.98529C0.25 6.73675 0.33385 6.52915 0.50155 6.36249C0.669267 6.19582 0.877083 6.11249 1.125 6.11249H6.125V1.11249C6.125 0.864571 6.20907 0.656755 6.3772 0.489038C6.54532 0.321338 6.75365 0.237488 7.0022 0.237488C7.25073 0.237488 7.45833 0.321338 7.625 0.489038C7.79167 0.656755 7.875 0.864571 7.875 1.11249V6.11249H12.875C13.1229 6.11249 13.3307 6.19656 13.4985 6.36469C13.6662 6.5328 13.75 6.74114 13.75 6.98969C13.75 7.23822 13.6662 7.44582 13.4985 7.61249C13.3307 7.77915 13.1229 7.86249 12.875 7.86249H7.875V12.8625C7.875 13.1104 7.79093 13.3182 7.6228 13.4859C7.45468 13.6536 7.24635 13.7375 6.9978 13.7375C6.74927 13.7375 6.54167 13.6536 6.375 13.4859C6.20833 13.3182 6.125 13.1104 6.125 12.8625V7.86249Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/PlusCircle.tsx b/apps/scandic-web/components/Icons/PlusCircle.tsx
deleted file mode 100644
index 3f391672a..000000000
--- a/apps/scandic-web/components/Icons/PlusCircle.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function PlusCircleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="24"
-      viewBox="0 0 24 24"
-      width="24"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M11.075 12.95V15.9375C11.075 16.1958 11.1667 16.4167 11.35 16.6C11.5333 16.7833 11.7542 16.875 12.0125 16.875C12.2708 16.875 12.4917 16.7833 12.675 16.6C12.8583 16.4167 12.95 16.1958 12.95 15.9375V12.95H15.9375C16.1958 12.95 16.4167 12.8583 16.6 12.675C16.7833 12.4917 16.875 12.2708 16.875 12.0125C16.875 11.7542 16.7833 11.5333 16.6 11.35C16.4167 11.1667 16.1958 11.075 15.9375 11.075H12.95V8.0625C12.95 7.80417 12.8583 7.58333 12.675 7.4C12.4917 7.21667 12.2708 7.125 12.0125 7.125C11.7542 7.125 11.5333 7.21667 11.35 7.4C11.1667 7.58333 11.075 7.80417 11.075 8.0625V11.075H8.0625C7.80417 11.075 7.58333 11.1667 7.4 11.35C7.21667 11.5333 7.125 11.7542 7.125 12.0125C7.125 12.2708 7.21667 12.4917 7.4 12.675C7.58333 12.8583 7.80417 12.95 8.0625 12.95H11.075ZM12 21.75C10.6516 21.75 9.38434 21.4936 8.19838 20.9809C7.01239 20.4682 5.98075 19.7724 5.10345 18.8934C4.22615 18.0145 3.53125 16.9826 3.01875 15.7978C2.50625 14.613 2.25 13.3471 2.25 12C2.25 10.6516 2.50636 9.38434 3.01908 8.19838C3.53179 7.01239 4.22762 5.98075 5.10658 5.10345C5.98553 4.22615 7.01739 3.53125 8.20218 3.01875C9.38698 2.50625 10.6529 2.25 12 2.25C13.3484 2.25 14.6157 2.50636 15.8016 3.01908C16.9876 3.53179 18.0193 4.22762 18.8966 5.10658C19.7739 5.98553 20.4688 7.01739 20.9813 8.20217C21.4938 9.38697 21.75 10.6529 21.75 12C21.75 13.3484 21.4936 14.6157 20.9809 15.8016C20.4682 16.9876 19.7724 18.0193 18.8934 18.8966C18.0145 19.7739 16.9826 20.4688 15.7978 20.9813C14.613 21.4938 13.3471 21.75 12 21.75ZM12 19.875C14.1917 19.875 16.0521 19.1104 17.5813 17.5813C19.1104 16.0521 19.875 14.1917 19.875 12C19.875 9.80833 19.1104 7.94792 17.5813 6.41875C16.0521 4.88958 14.1917 4.125 12 4.125C9.80833 4.125 7.94792 4.88958 6.41875 6.41875C4.88958 7.94792 4.125 9.80833 4.125 12C4.125 14.1917 4.88958 16.0521 6.41875 17.5813C7.94792 19.1104 9.80833 19.875 12 19.875Z"
-        fill="#CD0921"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/PriceTag.tsx b/apps/scandic-web/components/Icons/PriceTag.tsx
deleted file mode 100644
index fd735a1d3..000000000
--- a/apps/scandic-web/components/Icons/PriceTag.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function PriceTagIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M14.15 21.2C13.7833 21.5667 13.3375 21.75 12.8125 21.75C12.2875 21.75 11.8417 21.5667 11.475 21.2L2.825 12.525C2.6493 12.3529 2.50955 12.1494 2.40575 11.9146C2.30192 11.6799 2.25 11.4333 2.25 11.175V4.125C2.25 3.60937 2.43359 3.16796 2.80077 2.80078C3.16796 2.43359 3.60937 2.25 4.125 2.25H11.175C11.4372 2.25 11.684 2.29792 11.9154 2.39375C12.1468 2.48958 12.35 2.625 12.525 2.8L21.2 11.4875C21.5667 11.8542 21.75 12.2979 21.75 12.8188C21.75 13.3396 21.5667 13.7833 21.2 14.15L14.15 21.2ZM12.8375 19.875L19.8625 12.825L11.175 4.125H4.125V11.175L12.8375 19.875ZM6.5875 8C6.98333 8 7.31979 7.86146 7.59688 7.58437C7.87396 7.30729 8.0125 6.97083 8.0125 6.575C8.0125 6.17917 7.87396 5.84271 7.59688 5.56562C7.31979 5.28854 6.98333 5.15 6.5875 5.15C6.19167 5.15 5.85521 5.28854 5.57812 5.56562C5.30104 5.84271 5.1625 6.17917 5.1625 6.575C5.1625 6.97083 5.30104 7.30729 5.57812 7.58437C5.85521 7.86146 6.19167 8 6.5875 8Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Printer.tsx b/apps/scandic-web/components/Icons/Printer.tsx
deleted file mode 100644
index e82696d37..000000000
--- a/apps/scandic-web/components/Icons/Printer.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function PrinterIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="21"
-      height="20"
-      viewBox="0 0 21 20"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M7.20964 17.3127C6.77994 17.3127 6.4121 17.1598 6.10611 16.8538C5.80013 16.5478 5.64714 16.1799 5.64714 15.7502V14.0419H3.98047C3.55077 14.0419 3.18293 13.8889 2.87695 13.5829C2.57096 13.2769 2.41797 12.9091 2.41797 12.4794V9.14608C2.41797 8.47941 2.64887 7.91691 3.11068 7.45858C3.57248 7.00024 4.13325 6.77108 4.79297 6.77108H16.2096C16.8763 6.77108 17.4388 7.00024 17.8971 7.45858C18.3555 7.91691 18.5846 8.47941 18.5846 9.14608V12.4794C18.5846 12.9091 18.4316 13.2769 18.1257 13.5829C17.8197 13.8889 17.4518 14.0419 17.0221 14.0419H15.3555V15.7502C15.3555 16.1799 15.2025 16.5478 14.8965 16.8538C14.5905 17.1598 14.2227 17.3127 13.793 17.3127H7.20964ZM3.98047 12.4794H5.64714V12.4169C5.64714 11.9872 5.80013 11.6194 6.10611 11.3134C6.4121 11.0074 6.77994 10.8544 7.20964 10.8544H13.793C14.2227 10.8544 14.5905 11.0074 14.8965 11.3134C15.2025 11.6194 15.3555 11.9872 15.3555 12.4169V12.4794H17.0221V9.14608C17.0221 8.91587 16.944 8.7229 16.7878 8.56718C16.6316 8.41145 16.438 8.33358 16.207 8.33358H4.79564C4.56469 8.33358 4.37109 8.41145 4.21484 8.56718C4.05859 8.7229 3.98047 8.91587 3.98047 9.14608V12.4794ZM13.793 6.77108V4.31274H7.20964V6.77108H5.64714V4.31274C5.64714 3.88305 5.80013 3.51521 6.10611 3.20922C6.4121 2.90324 6.77994 2.75024 7.20964 2.75024H13.793C14.2227 2.75024 14.5905 2.90324 14.8965 3.20922C15.2025 3.51521 15.3555 3.88305 15.3555 4.31274V6.77108H13.793ZM15.3971 10.344C15.6124 10.344 15.7964 10.2676 15.9492 10.1148C16.102 9.96205 16.1784 9.77802 16.1784 9.56274C16.1784 9.34747 16.102 9.16344 15.9492 9.01066C15.7964 8.85788 15.6124 8.78149 15.3971 8.78149C15.1819 8.78149 14.9978 8.85788 14.8451 9.01066C14.6923 9.16344 14.6159 9.34747 14.6159 9.56274C14.6159 9.77802 14.6923 9.96205 14.8451 10.1148C14.9978 10.2676 15.1819 10.344 15.3971 10.344ZM13.793 15.7502V12.4169H7.20964V15.7502H13.793Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Refresh.tsx b/apps/scandic-web/components/Icons/Refresh.tsx
deleted file mode 100644
index ecca80a0f..000000000
--- a/apps/scandic-web/components/Icons/Refresh.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function Refresh({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M6.0249 12.0254C6.0249 12.2921 6.04157 12.5546 6.0749 12.8129C6.10824 13.0712 6.16657 13.3296 6.2499 13.5879C6.3249 13.8462 6.31657 14.0962 6.2249 14.3379C6.13324 14.5796 5.96657 14.7546 5.7249 14.8629C5.4749 14.9796 5.23115 14.9858 4.99365 14.8816C4.75615 14.7775 4.59574 14.5962 4.5124 14.3379C4.3874 13.9629 4.29574 13.5816 4.2374 13.1941C4.17907 12.8066 4.1499 12.4171 4.1499 12.0254C4.1499 9.83372 4.91032 7.97331 6.43115 6.44414C7.95199 4.91497 9.81657 4.15039 12.0249 4.15039H12.2749L11.3124 3.18789C11.1291 3.00456 11.0374 2.78372 11.0374 2.52539C11.0374 2.26706 11.1291 2.04622 11.3124 1.86289C11.4957 1.67956 11.7166 1.58789 11.9749 1.58789C12.2332 1.58789 12.4541 1.67956 12.6374 1.86289L15.1999 4.43789C15.3916 4.62956 15.4853 4.85039 15.4812 5.10039C15.477 5.35039 15.3791 5.57122 15.1874 5.76289L12.6374 8.31289C12.4541 8.49622 12.2332 8.58789 11.9749 8.58789C11.7166 8.58789 11.4957 8.49622 11.3124 8.31289C11.1291 8.12956 11.0374 7.90872 11.0374 7.65039C11.0374 7.39206 11.1291 7.17122 11.3124 6.98789L12.2749 6.02539H12.0249C10.3499 6.02539 8.93115 6.60664 7.76865 7.76914C6.60615 8.93164 6.0249 10.3504 6.0249 12.0254ZM17.9749 11.9254C17.9749 11.6587 17.9582 11.4004 17.9249 11.1504C17.8916 10.9004 17.8374 10.6504 17.7624 10.4004C17.6874 10.1421 17.6957 9.88789 17.7874 9.63789C17.8791 9.38789 18.0457 9.20872 18.2874 9.10039C18.5374 8.98372 18.7791 8.97539 19.0124 9.07539C19.2457 9.17539 19.4041 9.35456 19.4874 9.61289C19.6124 9.98789 19.7041 10.3691 19.7624 10.7566C19.8207 11.1441 19.8499 11.5337 19.8499 11.9254C19.8499 14.1171 19.0895 15.9775 17.5687 17.5066C16.0478 19.0358 14.1832 19.8004 11.9749 19.8004H11.7249L12.6874 20.7629C12.8707 20.9462 12.9624 21.1671 12.9624 21.4254C12.9624 21.6837 12.8707 21.9046 12.6874 22.0879C12.5041 22.2712 12.2832 22.3629 12.0249 22.3629C11.7666 22.3629 11.5457 22.2712 11.3624 22.0879L8.7999 19.5129C8.60824 19.3212 8.51449 19.1004 8.51865 18.8504C8.52282 18.6004 8.62074 18.3796 8.8124 18.1879L11.3624 15.6379C11.5457 15.4546 11.7666 15.3629 12.0249 15.3629C12.2832 15.3629 12.5041 15.4546 12.6874 15.6379C12.8707 15.8212 12.9624 16.0421 12.9624 16.3004C12.9624 16.5587 12.8707 16.7796 12.6874 16.9629L11.7249 17.9254H11.9749C13.6499 17.9254 15.0687 17.3441 16.2312 16.1816C17.3937 15.0191 17.9749 13.6004 17.9749 11.9254Z"
-        fill="white"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Restaurant.tsx b/apps/scandic-web/components/Icons/Restaurant.tsx
deleted file mode 100644
index adeea74a1..000000000
--- a/apps/scandic-web/components/Icons/Restaurant.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function RestaurantIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M7.12505 9.04999V3.11249C7.12505 2.85415 7.21672 2.63332 7.40005 2.44999C7.58338 2.26665 7.80422 2.17499 8.06255 2.17499C8.32088 2.17499 8.54172 2.26665 8.72505 2.44999C8.90838 2.63332 9.00005 2.85415 9.00005 3.11249V9.04999H10.05V3.11249C10.05 2.85415 10.1417 2.63332 10.325 2.44999C10.5084 2.26665 10.7292 2.17499 10.9875 2.17499C11.2459 2.17499 11.4667 2.26665 11.65 2.44999C11.8334 2.63332 11.925 2.85415 11.925 3.11249V9.04999C11.925 9.95832 11.6438 10.7562 11.0813 11.4437C10.5188 12.1312 9.82505 12.5833 9.00005 12.8V20.8625C9.00005 21.1208 8.90838 21.3417 8.72505 21.525C8.54172 21.7083 8.32088 21.8 8.06255 21.8C7.80422 21.8 7.58338 21.7083 7.40005 21.525C7.21672 21.3417 7.12505 21.1208 7.12505 20.8625V12.8C6.30005 12.5833 5.60213 12.1312 5.0313 11.4437C4.46047 10.7562 4.17505 9.95832 4.17505 9.04999V3.11249C4.17505 2.85415 4.26672 2.63332 4.45005 2.44999C4.63338 2.26665 4.85422 2.17499 5.11255 2.17499C5.37088 2.17499 5.59172 2.26665 5.77505 2.44999C5.95838 2.63332 6.05005 2.85415 6.05005 3.11249V9.04999H7.12505ZM16.9 13.9H14.9375C14.6792 13.9 14.4584 13.8083 14.275 13.625C14.0917 13.4417 14 13.2208 14 12.9625V7.07499C14 5.94165 14.4125 4.84165 15.2375 3.77499C16.0625 2.70832 16.9125 2.17499 17.7875 2.17499C18.0792 2.17499 18.3167 2.28957 18.5 2.51874C18.6834 2.7479 18.775 3.01249 18.775 3.31249V20.8625C18.775 21.1208 18.6834 21.3417 18.5 21.525C18.3167 21.7083 18.0959 21.8 17.8375 21.8C17.5792 21.8 17.3584 21.7083 17.175 21.525C16.9917 21.3417 16.9 21.1208 16.9 20.8625V13.9Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/RocketLaunch.tsx b/apps/scandic-web/components/Icons/RocketLaunch.tsx
deleted file mode 100644
index e63fbb1ff..000000000
--- a/apps/scandic-web/components/Icons/RocketLaunch.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function RocketLaunch({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5.6498 10.0249L7.5998 10.8499C7.83314 10.3832 8.0748 9.93319 8.3248 9.49986C8.5748 9.06653 8.8498 8.63319 9.1498 8.19986L7.7498 7.92486L5.6498 10.0249ZM9.1998 12.0999L12.0498 14.9249C12.7498 14.6582 13.4998 14.2499 14.2998 13.6999C15.0998 13.1499 15.8498 12.5249 16.5498 11.8249C17.7165 10.6582 18.629 9.36236 19.2873 7.93736C19.9456 6.51236 20.2331 5.19986 20.1498 3.99986C18.9498 3.91653 17.6331 4.20403 16.1998 4.86236C14.7665 5.52069 13.4665 6.4332 12.2998 7.59986C11.5998 8.29986 10.9748 9.04986 10.4248 9.84986C9.8748 10.6499 9.46647 11.3999 9.1998 12.0999ZM13.6498 10.4749C13.2665 10.0915 13.0748 9.62069 13.0748 9.06236C13.0748 8.50403 13.2665 8.0332 13.6498 7.64986C14.0331 7.26653 14.5081 7.07486 15.0748 7.07486C15.6415 7.07486 16.1165 7.26653 16.4998 7.64986C16.8831 8.0332 17.0748 8.50403 17.0748 9.06236C17.0748 9.62069 16.8831 10.0915 16.4998 10.4749C16.1165 10.8582 15.6415 11.0499 15.0748 11.0499C14.5081 11.0499 14.0331 10.8582 13.6498 10.4749ZM14.1248 18.4999L16.2248 16.3999L15.9498 14.9999C15.5165 15.2999 15.0831 15.5707 14.6498 15.8124C14.2165 16.054 13.7665 16.2915 13.2998 16.5249L14.1248 18.4999ZM21.9498 2.17486C22.2665 4.19153 22.0706 6.15403 21.3623 8.06236C20.654 9.9707 19.4331 11.7915 17.6998 13.5249L18.1998 15.9999C18.2665 16.3332 18.2498 16.6582 18.1498 16.9749C18.0498 17.2915 17.8831 17.5665 17.6498 17.7999L13.4498 21.9999L11.3498 17.0749L7.0748 12.7999L2.1498 10.6999L6.3248 6.49986C6.55814 6.26653 6.83731 6.09986 7.1623 5.99986C7.4873 5.89986 7.81647 5.88319 8.1498 5.94986L10.6248 6.44986C12.3581 4.71653 14.1748 3.49153 16.0748 2.77486C17.9748 2.05819 19.9331 1.85819 21.9498 2.17486ZM3.9248 15.9749C4.50814 15.3915 5.22064 15.0957 6.0623 15.0874C6.90397 15.079 7.61647 15.3665 8.1998 15.9499C8.78314 16.5332 9.07064 17.2457 9.0623 18.0874C9.05397 18.929 8.75814 19.6415 8.1748 20.2249C7.75814 20.6415 7.0623 20.9999 6.0873 21.2999C5.1123 21.5999 3.76647 21.8665 2.0498 22.0999C2.28314 20.3832 2.5498 19.0374 2.8498 18.0624C3.1498 17.0874 3.50814 16.3915 3.9248 15.9749ZM5.3498 17.3749C5.18314 17.5415 5.01647 17.8457 4.8498 18.2874C4.68314 18.729 4.56647 19.1749 4.4998 19.6249C4.9498 19.5582 5.39564 19.4457 5.8373 19.2874C6.27897 19.129 6.58314 18.9665 6.7498 18.7999C6.9498 18.5999 7.05814 18.3582 7.0748 18.0749C7.09147 17.7915 6.9998 17.5499 6.7998 17.3499C6.5998 17.1499 6.35814 17.054 6.0748 17.0624C5.79147 17.0707 5.5498 17.1749 5.3498 17.3749Z"
-        fill="#003DF0"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/RoomService.tsx b/apps/scandic-web/components/Icons/RoomService.tsx
deleted file mode 100644
index b472c7e2a..000000000
--- a/apps/scandic-web/components/Icons/RoomService.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function RoomServiceIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M3.23755 18.6875C2.97922 18.6875 2.75838 18.5959 2.57505 18.4125C2.39172 18.2292 2.30005 18.0084 2.30005 17.75C2.30005 17.4917 2.39172 17.2709 2.57505 17.0875C2.75838 16.9042 2.97922 16.8125 3.23755 16.8125H20.775C21.0334 16.8125 21.2542 16.9042 21.4375 17.0875C21.6209 17.2709 21.7125 17.4917 21.7125 17.75C21.7125 18.0084 21.6209 18.2292 21.4375 18.4125C21.2542 18.5959 21.0334 18.6875 20.775 18.6875H3.23755ZM3.23755 15.875V14.9625C3.23755 12.8852 3.88338 11.0513 5.17505 9.46077C6.46672 7.87029 8.11672 6.86255 10.125 6.43755V6.17505C10.125 5.65942 10.3087 5.21801 10.6761 4.85082C11.0436 4.48364 11.4852 4.30005 12.0011 4.30005C12.5171 4.30005 12.9584 4.48364 13.325 4.85082C13.6917 5.21801 13.875 5.65942 13.875 6.17505V6.43755C15.9 6.86255 17.5563 7.87029 18.8438 9.46077C20.1313 11.0513 20.775 12.8852 20.775 14.9625V15.875H3.23755ZM5.16255 14H18.85C18.6167 12.3 17.8515 10.8896 16.5544 9.7688C15.2573 8.64797 13.7386 8.08755 11.9981 8.08755C10.2577 8.08755 8.7438 8.64797 7.4563 9.7688C6.1688 10.8896 5.40422 12.3 5.16255 14Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/SafetyBox.tsx b/apps/scandic-web/components/Icons/SafetyBox.tsx
deleted file mode 100644
index 7dc9e9590..000000000
--- a/apps/scandic-web/components/Icons/SafetyBox.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SafetyBoxIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M4.875 18.55C4.35937 18.55 3.91796 18.3664 3.55078 17.9992C3.18359 17.632 3 17.1906 3 16.675V4.875C3 4.35937 3.18359 3.91796 3.55078 3.55078C3.91796 3.18359 4.35937 3 4.875 3H18.675C19.1906 3 19.632 3.18359 19.9992 3.55078C20.3664 3.91796 20.55 4.35937 20.55 4.875V16.675C20.55 17.1906 20.3664 17.632 19.9992 17.9992C19.632 18.3664 19.1906 18.55 18.675 18.55V19.5875C18.675 19.8458 18.5833 20.0667 18.4 20.25C18.2167 20.4333 17.9958 20.525 17.7375 20.525C17.4792 20.525 17.2583 20.4333 17.075 20.25C16.8917 20.0667 16.8 19.8458 16.8 19.5875V18.55H6.75V19.5875C6.75 19.8458 6.65833 20.0667 6.475 20.25C6.29167 20.4333 6.07083 20.525 5.8125 20.525C5.55417 20.525 5.33333 20.4333 5.15 20.25C4.96667 20.0667 4.875 19.8458 4.875 19.5875V18.55ZM4.875 4.875V16.675H18.675V14.275H17.675C17.4167 14.275 17.1958 14.1834 17.0125 14C16.8292 13.8167 16.7375 13.5959 16.7375 13.3375C16.7375 13.0792 16.8292 12.8584 17.0125 12.675C17.1958 12.4917 17.4167 12.4 17.675 12.4H18.675V9.15002H17.675C17.4167 9.15002 17.1958 9.05836 17.0125 8.87502C16.8292 8.69169 16.7375 8.47086 16.7375 8.21252C16.7375 7.95419 16.8292 7.73336 17.0125 7.55002C17.1958 7.36669 17.4167 7.27502 17.675 7.27502H18.675V4.875H4.875Z"
-        fill="#26201E"
-      />
-      <path
-        d="M13.2845 11.2845C13.6615 10.9076 13.85 10.4544 13.85 9.925C13.85 9.39562 13.6615 8.94244 13.2845 8.56548C12.9076 8.18849 12.4544 8 11.925 8C11.3956 8 10.9424 8.18849 10.5655 8.56548C10.1885 8.94244 10 9.39562 10 9.925C10 10.4544 10.1885 10.9076 10.5655 11.2845C10.7069 11.426 10.8419 11.5315 11.0049 11.6199V12.6375C11.0049 12.8959 11.0965 13.1167 11.2799 13.3C11.4632 13.4834 11.684 13.575 11.9424 13.575C12.2007 13.575 12.4215 13.4834 12.6049 13.3C12.7882 13.1167 12.8799 12.8959 12.8799 12.6375V11.6C13.0318 11.514 13.1516 11.4175 13.2845 11.2845Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Sauna.tsx b/apps/scandic-web/components/Icons/Sauna.tsx
deleted file mode 100644
index f5535c270..000000000
--- a/apps/scandic-web/components/Icons/Sauna.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SaunaIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M4 22C3.45 22 2.97917 21.8042 2.5875 21.4125C2.19583 21.0208 2 20.55 2 20V4C2 3.45 2.19583 2.97917 2.5875 2.5875C2.97917 2.19583 3.45 2 4 2H20C20.55 2 21.0208 2.19583 21.4125 2.5875C21.8042 2.97917 22 3.45 22 4V20C22 20.55 21.8042 21.0208 21.4125 21.4125C21.0208 21.8042 20.55 22 20 22H4ZM4 16V20H6V18H5V16H4ZM4 14H5C5 13.7167 5.09583 13.4792 5.2875 13.2875C5.47917 13.0958 5.71667 13 6 13V10.5C6 10.0833 6.14583 9.72917 6.4375 9.4375C6.72917 9.14583 7.08333 9 7.5 9H9.5C9.91667 9 10.2708 9.14583 10.5625 9.4375C10.8542 9.72917 11 10.0833 11 10.5V13C11.2833 13 11.5208 13.0958 11.7125 13.2875C11.9042 13.4792 12 13.7167 12 14H20V4H4V14ZM6.5 16.5H10.5V14.5H6.5V16.5ZM8.5 8C8.08333 8 7.72917 7.85417 7.4375 7.5625C7.14583 7.27083 7 6.91667 7 6.5C7 6.08333 7.14583 5.72917 7.4375 5.4375C7.72917 5.14583 8.08333 5 8.5 5C8.91667 5 9.27083 5.14583 9.5625 5.4375C9.85417 5.72917 10 6.08333 10 6.5C10 6.91667 9.85417 7.27083 9.5625 7.5625C9.27083 7.85417 8.91667 8 8.5 8ZM8 20H9V18H8V20ZM11 20H20V16H12V18H11V20ZM12.25 10C12.2833 9.78333 12.3042 9.62083 12.3125 9.5125C12.3208 9.40417 12.325 9.29167 12.325 9.175C12.325 8.99167 12.2875 8.81667 12.2125 8.65C12.1375 8.48333 11.9833 8.25833 11.75 7.975C11.5 7.65833 11.3125 7.34167 11.1875 7.025C11.0625 6.70833 11 6.38333 11 6.05C11 5.91667 11.0083 5.77917 11.025 5.6375L11.1 5H12.6C12.5667 5.18333 12.5417 5.35417 12.525 5.5125C12.5083 5.67083 12.5 5.85 12.5 6.05C12.5 6.23333 12.5375 6.4125 12.6125 6.5875C12.6875 6.7625 12.8167 6.95 13 7.15C13.3 7.51667 13.5167 7.8625 13.65 8.1875C13.7833 8.5125 13.85 8.84167 13.85 9.175C13.85 9.35833 13.8417 9.50833 13.825 9.625C13.8083 9.74167 13.7833 9.86667 13.75 10H12.25ZM14.75 10C14.7833 9.78333 14.8042 9.62083 14.8125 9.5125C14.8208 9.40417 14.825 9.29167 14.825 9.175C14.825 8.99167 14.7875 8.81667 14.7125 8.65C14.6375 8.48333 14.4833 8.25833 14.25 7.975C14 7.65833 13.8125 7.34167 13.6875 7.025C13.5625 6.70833 13.5 6.38333 13.5 6.05C13.5 5.91667 13.5083 5.77917 13.525 5.6375L13.6 5H15.1C15.0667 5.18333 15.0417 5.35417 15.025 5.5125C15.0083 5.67083 15 5.85 15 6.05C15 6.23333 15.0375 6.4125 15.1125 6.5875C15.1875 6.7625 15.3167 6.95 15.5 7.15C15.8 7.51667 16.0167 7.8625 16.15 8.1875C16.2833 8.5125 16.35 8.84167 16.35 9.175C16.35 9.35833 16.3417 9.50833 16.325 9.625C16.3083 9.74167 16.2833 9.86667 16.25 10H14.75ZM17.3 10C17.3333 9.78333 17.3542 9.62083 17.3625 9.5125C17.3708 9.40417 17.375 9.29167 17.375 9.175C17.375 8.99167 17.3375 8.81667 17.2625 8.65C17.1875 8.48333 17.0333 8.25833 16.8 7.975C16.55 7.65833 16.3625 7.34167 16.2375 7.025C16.1125 6.70833 16.05 6.38333 16.05 6.05C16.05 5.91667 16.0583 5.77917 16.075 5.6375L16.15 5H17.65C17.6167 5.18333 17.5917 5.35417 17.575 5.5125C17.5583 5.67083 17.55 5.85 17.55 6.05C17.55 6.23333 17.5875 6.4125 17.6625 6.5875C17.7375 6.7625 17.8667 6.95 18.05 7.15C18.35 7.51667 18.5667 7.8625 18.7 8.1875C18.8333 8.5125 18.9 8.84167 18.9 9.175C18.9 9.35833 18.8917 9.50833 18.875 9.625C18.8583 9.74167 18.8333 9.86667 18.8 10H17.3Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Search.tsx b/apps/scandic-web/components/Icons/Search.tsx
deleted file mode 100644
index a849ffcbe..000000000
--- a/apps/scandic-web/components/Icons/Search.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SearchIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M9.54147 15.85C7.77261 15.85 6.27557 15.2379 5.05035 14.0137C3.82513 12.7894 3.21252 11.2936 3.21252 9.52616C3.21252 7.75873 3.82464 6.26251 5.04887 5.03751C6.27311 3.81251 7.76894 3.20001 9.53637 3.20001C11.3038 3.20001 12.8 3.81262 14.025 5.03784C15.25 6.26305 15.8625 7.7601 15.8625 9.52896C15.8625 10.243 15.75 10.9229 15.525 11.5688C15.3 12.2146 14.9917 12.7833 14.6 13.275L20.1404 18.8035C20.3218 18.9845 20.4125 19.2042 20.4125 19.4625C20.4125 19.7208 20.3209 19.9417 20.1375 20.125C19.9542 20.3083 19.7334 20.4 19.475 20.4C19.2167 20.4 18.9969 20.3094 18.8156 20.1283L13.279 14.5875C12.7847 14.9875 12.2167 15.2979 11.575 15.5188C10.9334 15.7396 10.2555 15.85 9.54147 15.85ZM9.53752 13.975C10.7792 13.975 11.8313 13.5438 12.6938 12.6813C13.5563 11.8188 13.9875 10.7667 13.9875 9.52501C13.9875 8.28335 13.5563 7.23126 12.6938 6.36876C11.8313 5.50626 10.7792 5.07501 9.53752 5.07501C8.29586 5.07501 7.24377 5.50626 6.38127 6.36876C5.51877 7.23126 5.08752 8.28335 5.08752 9.52501C5.08752 10.7667 5.51877 11.8188 6.38127 12.6813C7.24377 13.5438 8.29586 13.975 9.53752 13.975Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Service.tsx b/apps/scandic-web/components/Icons/Service.tsx
deleted file mode 100644
index 9ebb97d6a..000000000
--- a/apps/scandic-web/components/Icons/Service.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ServiceIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="20"
-      height="20"
-      viewBox="0 0 20 20"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M15.792 18.3337C14.0559 18.3337 12.3406 17.9552 10.6462 17.1982C8.95171 16.4413 7.41005 15.3684 6.02116 13.9795C4.63227 12.5906 3.55935 11.0489 2.80241 9.35449C2.04546 7.66005 1.66699 5.94477 1.66699 4.20866C1.66699 3.95866 1.75033 3.75033 1.91699 3.58366C2.08366 3.41699 2.29199 3.33366 2.54199 3.33366H5.91699C6.11144 3.33366 6.28505 3.39963 6.43783 3.53158C6.5906 3.66352 6.68088 3.81977 6.70866 4.00033L7.25033 6.91699C7.2781 7.13921 7.27116 7.32671 7.22949 7.47949C7.18783 7.63227 7.11144 7.76421 7.00033 7.87533L4.97949 9.91699C5.25727 10.4309 5.58713 10.9274 5.96908 11.4066C6.35102 11.8857 6.77116 12.3475 7.22949 12.792C7.66005 13.2225 8.11144 13.6219 8.58366 13.9899C9.05588 14.358 9.55588 14.6948 10.0837 15.0003L12.042 13.042C12.167 12.917 12.3302 12.8232 12.5316 12.7607C12.733 12.6982 12.9309 12.6809 13.1253 12.7087L16.0003 13.292C16.1948 13.3475 16.3545 13.4482 16.4795 13.5941C16.6045 13.7399 16.667 13.9031 16.667 14.0837V17.4587C16.667 17.7087 16.5837 17.917 16.417 18.0837C16.2503 18.2503 16.042 18.3337 15.792 18.3337ZM4.18783 8.33366L5.56283 6.95866L5.20866 5.00033H3.35449C3.42394 5.56977 3.52116 6.13227 3.64616 6.68783C3.77116 7.24338 3.95171 7.79199 4.18783 8.33366ZM11.6462 15.792C12.1878 16.0281 12.7399 16.2156 13.3024 16.3545C13.8649 16.4934 14.4309 16.5837 15.0003 16.6253V14.792L13.042 14.3962L11.6462 15.792ZM14.167 10.0003C13.0142 10.0003 12.0316 9.59408 11.2191 8.78158C10.4066 7.96908 10.0003 6.98644 10.0003 5.83366C10.0003 4.68088 10.4066 3.69824 11.2191 2.88574C12.0316 2.07324 13.0142 1.66699 14.167 1.66699C15.3198 1.66699 16.3024 2.07324 17.1149 2.88574C17.9274 3.69824 18.3337 4.68088 18.3337 5.83366C18.3337 6.98644 17.9274 7.96908 17.1149 8.78158C16.3024 9.59408 15.3198 10.0003 14.167 10.0003ZM13.7503 8.33366H14.5837V5.00033H13.7503V8.33366ZM14.167 4.16699C14.2781 4.16699 14.3753 4.12533 14.4587 4.04199C14.542 3.95866 14.5837 3.86144 14.5837 3.75033C14.5837 3.63921 14.542 3.54199 14.4587 3.45866C14.3753 3.37533 14.2781 3.33366 14.167 3.33366C14.0559 3.33366 13.9587 3.37533 13.8753 3.45866C13.792 3.54199 13.7503 3.63921 13.7503 3.75033C13.7503 3.86144 13.792 3.95866 13.8753 4.04199C13.9587 4.12533 14.0559 4.16699 14.167 4.16699Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Shopping.tsx b/apps/scandic-web/components/Icons/Shopping.tsx
deleted file mode 100644
index d427f3a38..000000000
--- a/apps/scandic-web/components/Icons/Shopping.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ShoppingIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6.125 21.75C5.60937 21.75 5.16796 21.5664 4.80078 21.1992C4.43359 20.832 4.25 20.3906 4.25 19.875V8.05C4.25 7.53437 4.43359 7.09296 4.80078 6.72578C5.16796 6.35859 5.60937 6.175 6.125 6.175H8.0625C8.0625 5.09167 8.4481 4.16667 9.2193 3.4C9.9905 2.63333 10.9176 2.25 12.0006 2.25C13.0835 2.25 14.0104 2.63433 14.7812 3.40298C15.5521 4.17161 15.9375 5.09562 15.9375 6.175H17.875C18.3906 6.175 18.832 6.35859 19.1992 6.72578C19.5664 7.09296 19.75 7.53437 19.75 8.05V19.875C19.75 20.3906 19.5664 20.832 19.1992 21.1992C18.832 21.5664 18.3906 21.75 17.875 21.75H6.125ZM6.125 19.875H17.875V8.05H15.9375V10.1125C15.9375 10.3708 15.8458 10.5917 15.6625 10.775C15.4792 10.9583 15.2583 11.05 15 11.05C14.7417 11.05 14.5208 10.9583 14.3375 10.775C14.1542 10.5917 14.0625 10.3708 14.0625 10.1125V8.05H9.9375V10.1125C9.9375 10.3708 9.84583 10.5917 9.6625 10.775C9.47917 10.9583 9.25833 11.05 9 11.05C8.74167 11.05 8.52083 10.9583 8.3375 10.775C8.15417 10.5917 8.0625 10.3708 8.0625 10.1125V8.05H6.125V19.875ZM9.9375 6.175H14.0625C14.0625 5.60833 13.8606 5.125 13.4568 4.725C13.053 4.325 12.5676 4.125 12.0006 4.125C11.4335 4.125 10.9479 4.32573 10.5438 4.7272C10.1396 5.12865 9.9375 5.61125 9.9375 6.175Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Shower.tsx b/apps/scandic-web/components/Icons/Shower.tsx
deleted file mode 100644
index 0f54c4829..000000000
--- a/apps/scandic-web/components/Icons/Shower.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ShowerIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M8.02495 17.7625C7.75828 17.7625 7.53537 17.6709 7.3562 17.4875C7.17703 17.3042 7.08745 17.0834 7.08745 16.825C7.08745 16.5667 7.17703 16.3459 7.3562 16.1625C7.53537 15.9792 7.75828 15.8875 8.02495 15.8875C8.28328 15.8875 8.50412 15.9792 8.68745 16.1625C8.87078 16.3459 8.96245 16.5667 8.96245 16.825C8.96245 17.0834 8.87078 17.3042 8.68745 17.4875C8.50412 17.6709 8.28328 17.7625 8.02495 17.7625ZM12 17.7625C11.7416 17.7625 11.5208 17.6709 11.3375 17.4875C11.1541 17.3042 11.0625 17.0834 11.0625 16.825C11.0625 16.5667 11.1541 16.3459 11.3375 16.1625C11.5208 15.9792 11.7416 15.8875 12 15.8875C12.2666 15.8875 12.4895 15.9792 12.6687 16.1625C12.8479 16.3459 12.9375 16.5667 12.9375 16.825C12.9375 17.0834 12.8479 17.3042 12.6687 17.4875C12.4895 17.6709 12.2666 17.7625 12 17.7625ZM16 17.7625C15.7416 17.7625 15.5208 17.6709 15.3375 17.4875C15.1541 17.3042 15.0625 17.0834 15.0625 16.825C15.0625 16.5667 15.1541 16.3459 15.3375 16.1625C15.5208 15.9792 15.7416 15.8875 16 15.8875C16.2666 15.8875 16.4895 15.9792 16.6687 16.1625C16.8479 16.3459 16.9375 16.5667 16.9375 16.825C16.9375 17.0834 16.8479 17.3042 16.6687 17.4875C16.4895 17.6709 16.2666 17.7625 16 17.7625ZM6.13745 14.0125C5.87912 14.0125 5.65828 13.9209 5.47495 13.7375C5.29162 13.5542 5.19995 13.3334 5.19995 13.075V12.1375C5.19995 10.4209 5.7562 8.92713 6.8687 7.6563C7.9812 6.38547 9.37912 5.64172 11.0625 5.42505V4.30005C11.0625 4.04172 11.1541 3.82088 11.3375 3.63755C11.5208 3.45422 11.7416 3.36255 12 3.36255C12.2583 3.36255 12.4791 3.45422 12.6625 3.63755C12.8458 3.82088 12.9375 4.04172 12.9375 4.30005V5.42505C14.6291 5.64172 16.0291 6.38547 17.1375 7.6563C18.2458 8.92713 18.8 10.4209 18.8 12.1375V13.075C18.8 13.3334 18.7083 13.5542 18.525 13.7375C18.3416 13.9209 18.1208 14.0125 17.8625 14.0125H6.13745ZM7.07495 12.1375H16.925C16.925 10.7709 16.4458 9.60838 15.4875 8.65005C14.5291 7.69172 13.3666 7.21255 12 7.21255C10.6416 7.21255 9.4812 7.69172 8.5187 8.65005C7.5562 9.60838 7.07495 10.7709 7.07495 12.1375ZM8.02495 20.575C7.75828 20.575 7.53537 20.4834 7.3562 20.3C7.17703 20.1167 7.08745 19.8959 7.08745 19.6375C7.08745 19.3792 7.17703 19.1584 7.3562 18.975C7.53537 18.7917 7.75828 18.7 8.02495 18.7C8.28328 18.7 8.50412 18.7917 8.68745 18.975C8.87078 19.1584 8.96245 19.3792 8.96245 19.6375C8.96245 19.8959 8.87078 20.1167 8.68745 20.3C8.50412 20.4834 8.28328 20.575 8.02495 20.575ZM12 20.575C11.7416 20.575 11.5208 20.4834 11.3375 20.3C11.1541 20.1167 11.0625 19.8959 11.0625 19.6375C11.0625 19.3792 11.1541 19.1584 11.3375 18.975C11.5208 18.7917 11.7416 18.7 12 18.7C12.2666 18.7 12.4895 18.7917 12.6687 18.975C12.8479 19.1584 12.9375 19.3792 12.9375 19.6375C12.9375 19.8959 12.8479 20.1167 12.6687 20.3C12.4895 20.4834 12.2666 20.575 12 20.575ZM16 20.575C15.7416 20.575 15.5208 20.4834 15.3375 20.3C15.1541 20.1167 15.0625 19.8959 15.0625 19.6375C15.0625 19.3792 15.1541 19.1584 15.3375 18.975C15.5208 18.7917 15.7416 18.7 16 18.7C16.2666 18.7 16.4895 18.7917 16.6687 18.975C16.8479 19.1584 16.9375 19.3792 16.9375 19.6375C16.9375 19.8959 16.8479 20.1167 16.6687 20.3C16.4895 20.4834 16.2666 20.575 16 20.575Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Skateboarding.tsx b/apps/scandic-web/components/Icons/Skateboarding.tsx
deleted file mode 100644
index a94dd0ff2..000000000
--- a/apps/scandic-web/components/Icons/Skateboarding.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SkateboardingIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M7.24998 24C7.04998 24 6.87498 23.925 6.72498 23.775C6.57498 23.625 6.49998 23.4501 6.49998 23.25C6.49998 23.05 6.57498 22.875 6.72498 22.725C6.87498 22.5751 7.04998 22.5 7.24998 22.5C7.44998 22.5 7.62498 22.5751 7.77498 22.725C7.92498 22.875 7.99998 23.05 7.99998 23.25C7.99998 23.4501 7.92498 23.625 7.77498 23.775C7.62498 23.925 7.44998 24 7.24998 24ZM15.75 24C15.55 24 15.375 23.925 15.225 23.775C15.075 23.625 15 23.4501 15 23.25C15 23.05 15.075 22.875 15.225 22.725C15.375 22.5751 15.55 22.5 15.75 22.5C15.95 22.5 16.125 22.5751 16.275 22.725C16.425 22.875 16.5 23.05 16.5 23.25C16.5 23.4501 16.425 23.625 16.275 23.775C16.125 23.925 15.95 24 15.75 24ZM6.74998 21.9375C6.01664 21.9375 5.33956 21.7771 4.71873 21.4563C4.09789 21.1355 3.58331 20.7042 3.17498 20.1625C3.13331 20.0875 3.09998 20.0188 3.07498 19.9563C3.04998 19.8938 3.03748 19.8251 3.03748 19.75C3.03748 19.5667 3.09998 19.4063 3.22498 19.2688C3.34998 19.1313 3.51664 19.0625 3.72498 19.0625C3.84164 19.0625 3.94373 19.0855 4.03123 19.1313C4.11873 19.1771 4.19998 19.2459 4.27498 19.3375C4.48331 19.6209 4.74373 19.8625 5.05623 20.0625C5.36873 20.2626 5.70831 20.4084 6.07498 20.5L9.24998 16.6625L7.83748 12.4875C7.77081 12.2709 7.75414 12.0188 7.78748 11.7313C7.82081 11.4438 7.90831 11.1875 8.04998 10.9625L10.5625 6.93755H8.06248L6.66248 9.17505C6.52081 9.39172 6.32706 9.5313 6.08123 9.5938C5.83539 9.6563 5.60414 9.61672 5.38748 9.47505C5.17081 9.33338 5.03123 9.13547 4.96873 8.8813C4.90623 8.62713 4.94581 8.39172 5.08748 8.17505L6.76248 5.50005C6.84581 5.35838 6.95623 5.25005 7.09373 5.17505C7.23123 5.10005 7.38331 5.06255 7.54998 5.06255H12.7C13.1333 5.06255 13.4833 5.18338 13.75 5.42505C14.0166 5.66672 14.1958 5.89172 14.2875 6.10005L14.8125 7.30005C15.1041 7.97505 15.5312 8.55005 16.0937 9.02505C16.6562 9.50005 17.3041 9.81672 18.0375 9.97505C18.2958 10.0334 18.5104 10.1542 18.6812 10.3375C18.8521 10.5209 18.9375 10.7417 18.9375 11C18.9375 11.2584 18.85 11.475 18.675 11.65C18.5 11.825 18.2875 11.8959 18.0375 11.8625C17.0791 11.7209 16.2062 11.3813 15.4187 10.8438C14.6312 10.3063 13.9833 9.63755 13.475 8.83755L11.5875 11.8375L15.5 14.2625C15.6416 14.3459 15.75 14.4563 15.825 14.5938C15.9 14.7313 15.9375 14.8834 15.9375 15.05V20.5625H16.275C16.775 20.5625 17.2375 20.4521 17.6625 20.2313C18.0875 20.0105 18.4416 19.7125 18.725 19.3375C18.8 19.2459 18.8812 19.1771 18.9687 19.1313C19.0562 19.0855 19.1583 19.0625 19.275 19.0625C19.475 19.0625 19.6396 19.1313 19.7687 19.2688C19.8979 19.4063 19.9625 19.5667 19.9625 19.75C19.9625 19.8251 19.95 19.8938 19.925 19.9563C19.9 20.0188 19.8666 20.0875 19.825 20.1625C19.4166 20.7042 18.9062 21.1355 18.2937 21.4563C17.6812 21.7771 17.0083 21.9375 16.275 21.9375H6.74998ZM8.46248 20.5625H14.0625V15.8625L10.3125 13.5L11.275 16.5C11.325 16.65 11.3354 16.8042 11.3062 16.9625C11.2771 17.1209 11.2083 17.2625 11.1 17.3875L8.46248 20.5625ZM15 4.95005C14.4583 4.95005 13.9979 4.76047 13.6187 4.3813C13.2396 4.00213 13.05 3.54172 13.05 3.00005C13.05 2.45838 13.2396 1.99797 13.6187 1.6188C13.9979 1.23963 14.4583 1.05005 15 1.05005C15.5416 1.05005 16.0021 1.23963 16.3812 1.6188C16.7604 1.99797 16.95 2.45838 16.95 3.00005C16.95 3.54172 16.7604 4.00213 16.3812 4.3813C16.0021 4.76047 15.5416 4.95005 15 4.95005Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Smoking.tsx b/apps/scandic-web/components/Icons/Smoking.tsx
deleted file mode 100644
index e382ccc34..000000000
--- a/apps/scandic-web/components/Icons/Smoking.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SmokingIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M3.69995 18.725C3.318 18.725 2.99335 18.5912 2.726 18.3236C2.45863 18.0559 2.32495 17.7309 2.32495 17.3486C2.32495 16.9662 2.45863 16.6417 2.726 16.3751C2.99335 16.1084 3.318 15.975 3.69995 15.975H16.2125C16.4111 15.975 16.5753 16.04 16.7052 16.17C16.835 16.3 16.9 16.4644 16.9 16.6631V18.0394C16.9 18.2382 16.835 18.4021 16.7052 18.5313C16.5753 18.6605 16.4111 18.725 16.2125 18.725H3.69995ZM18.586 18.725C18.387 18.725 18.2229 18.6601 18.0937 18.5301C17.9645 18.4001 17.9 18.2357 17.9 18.037V16.6607C17.9 16.4619 17.965 16.298 18.0952 16.1688C18.2253 16.0396 18.3899 15.975 18.5889 15.975C18.7879 15.975 18.952 16.04 19.0812 16.17C19.2104 16.3 19.275 16.4644 19.275 16.6631V18.0394C19.275 18.2382 19.2099 18.4021 19.0798 18.5313C18.9496 18.6605 18.785 18.725 18.586 18.725ZM20.961 18.725C20.762 18.725 20.5979 18.6601 20.4687 18.5301C20.3395 18.4001 20.275 18.2357 20.275 18.037V16.6607C20.275 16.4619 20.34 16.298 20.4702 16.1688C20.6003 16.0396 20.7649 15.975 20.9639 15.975C21.1629 15.975 21.327 16.04 21.4562 16.17C21.5854 16.3 21.65 16.4644 21.65 16.6631V18.0394C21.65 18.2382 21.5849 18.4021 21.4548 18.5313C21.3246 18.6605 21.16 18.725 20.961 18.725ZM18.586 14.975C18.387 14.975 18.2229 14.9101 18.0937 14.7803C17.9645 14.6504 17.9 14.4862 17.9 14.2875V13.7C17.9 13.075 17.7083 12.5896 17.325 12.2438C16.9416 11.898 16.4916 11.725 15.975 11.725H14.45C13.5584 11.725 12.8022 11.4105 12.1813 10.7813C11.5604 10.1521 11.25 9.3938 11.25 8.5063C11.25 7.6188 11.5604 6.86672 12.1813 6.25005C12.8022 5.63338 13.5584 5.32505 14.45 5.32505C14.6486 5.32505 14.8128 5.39012 14.9427 5.52025C15.0725 5.65038 15.1375 5.81497 15.1375 6.014C15.1375 6.21303 15.0725 6.37713 14.9427 6.5063C14.8128 6.63547 14.6486 6.70005 14.45 6.70005C13.9567 6.70005 13.5292 6.8701 13.1675 7.2102C12.8058 7.55028 12.625 7.97945 12.625 8.4977C12.625 9.01593 12.8056 9.45422 13.1669 9.81255C13.5281 10.1709 13.9551 10.35 14.4478 10.35H15.975C16.8677 10.35 17.6409 10.6417 18.2945 11.225C18.9481 11.8084 19.275 12.5334 19.275 13.4001V14.2875C19.275 14.4862 19.2099 14.6504 19.0798 14.7803C18.9496 14.9101 18.785 14.975 18.586 14.975ZM20.961 14.975C20.762 14.975 20.5979 14.9101 20.4687 14.7803C20.3395 14.6504 20.275 14.4862 20.275 14.2875V12.75C20.275 11.6584 19.9 10.7313 19.15 9.9688C18.4 9.2063 17.4666 8.82505 16.35 8.82505C16.1513 8.82505 15.9871 8.75998 15.8573 8.62985C15.7274 8.49972 15.6625 8.33513 15.6625 8.1361C15.6625 7.93707 15.7274 7.77297 15.8573 7.6438C15.9871 7.51463 16.1513 7.45005 16.35 7.45005C16.8416 7.45005 17.2645 7.26919 17.6187 6.90747C17.9729 6.54577 18.15 6.1183 18.15 5.62505C18.15 5.12505 17.9729 4.69588 17.6187 4.33755C17.2645 3.97922 16.8416 3.80005 16.35 3.80005C16.1513 3.80005 15.9871 3.73498 15.8573 3.60485C15.7274 3.47472 15.6625 3.31013 15.6625 3.1111C15.6625 2.91207 15.7274 2.74797 15.8573 2.6188C15.9871 2.48963 16.1513 2.42505 16.35 2.42505C17.2416 2.42505 17.9937 2.73609 18.6062 3.35817C19.2187 3.98026 19.525 4.73792 19.525 5.63117C19.525 6.09376 19.4375 6.5188 19.2625 6.9063C19.0875 7.2938 18.85 7.63972 18.55 7.94407C19.4583 8.33972 20.202 8.96672 20.7812 9.82505C21.3604 10.6834 21.65 11.6584 21.65 12.75V14.2875C21.65 14.4862 21.5849 14.6504 21.4548 14.7803C21.3246 14.9101 21.16 14.975 20.961 14.975Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Snowflake.tsx b/apps/scandic-web/components/Icons/Snowflake.tsx
deleted file mode 100644
index 06389343f..000000000
--- a/apps/scandic-web/components/Icons/Snowflake.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SnowflakeIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="48"
-      height="48"
-      viewBox="0 0 48 48"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M24.0005 48C23.6026 48 23.2211 47.842 22.9398 47.5607C22.6585 47.2794 22.5005 46.8978 22.5005 46.5V42.621L20.5625 44.562C20.2808 44.8433 19.8989 45.0011 19.5009 45.0008C19.1028 45.0006 18.7212 44.8422 18.44 44.5605C18.1587 44.2788 18.0008 43.897 18.0011 43.4989C18.0014 43.1009 18.1598 42.7193 18.4415 42.438L22.5005 38.379V26.598L12.3005 32.487L10.8125 38.037C10.709 38.4213 10.4572 38.7488 10.1123 38.9474C9.7674 39.146 9.35775 39.1994 8.97345 39.096C8.58915 38.9926 8.26168 38.7407 8.06308 38.3958C7.86448 38.0509 7.81102 37.6413 7.91445 37.257L8.62545 34.611L5.26545 36.549C4.92112 36.7448 4.51332 36.7964 4.13106 36.6926C3.74879 36.5888 3.4231 36.3381 3.22504 35.995C3.02699 35.652 2.97265 35.2446 3.0739 34.8616C3.17514 34.4787 3.42374 34.1513 3.76545 33.951L7.12545 32.013L4.47345 31.302C4.28317 31.2508 4.10483 31.1626 3.94863 31.0425C3.79243 30.9223 3.66142 30.7726 3.56308 30.6018C3.46475 30.4311 3.40101 30.2426 3.3755 30.0472C3.35 29.8518 3.36324 29.6533 3.41445 29.463C3.46567 29.2727 3.55386 29.0944 3.674 28.9382C3.79413 28.782 3.94386 28.651 4.11463 28.5526C4.28539 28.4543 4.47386 28.3906 4.66926 28.3651C4.86466 28.3396 5.06317 28.3528 5.25345 28.404L10.7975 29.889L21.0005 24L10.8005 18.111L5.25045 19.596C4.86865 19.6912 4.46475 19.6325 4.12581 19.4326C3.78687 19.2328 3.54003 18.9077 3.4385 18.5276C3.33697 18.1474 3.38888 17.7426 3.58303 17.4004C3.77719 17.0581 4.09805 16.8059 4.47645 16.698L7.12545 15.987L3.76545 14.049C3.59348 13.9512 3.44255 13.8204 3.32135 13.6641C3.20015 13.5077 3.11107 13.3289 3.05924 13.138C3.00741 12.9471 2.99385 12.7479 3.01935 12.5517C3.04485 12.3555 3.1089 12.1663 3.20781 11.995C3.30672 11.8237 3.43854 11.6736 3.59568 11.5535C3.75283 11.4333 3.93218 11.3454 4.12343 11.2949C4.31468 11.2443 4.51404 11.2321 4.71004 11.2589C4.90604 11.2857 5.0948 11.351 5.26545 11.451L8.62545 13.389L7.91445 10.74C7.85987 10.5485 7.84395 10.3481 7.86761 10.1504C7.89128 9.95275 7.95407 9.76176 8.05231 9.58859C8.15055 9.41542 8.28228 9.26354 8.43983 9.14181C8.59737 9.02007 8.77757 8.93092 8.96992 8.87955C9.16227 8.82817 9.36293 8.81561 9.56019 8.84258C9.75745 8.86955 9.94737 8.93552 10.1189 9.03665C10.2904 9.13778 10.44 9.27203 10.5591 9.43159C10.6782 9.59115 10.7643 9.77281 10.8125 9.966L12.2975 15.513L22.5005 21.402V9.621L18.4415 5.562C18.302 5.42273 18.1913 5.25736 18.1158 5.07532C18.0402 4.89329 18.0013 4.69815 18.0011 4.50106C18.001 4.30397 18.0397 4.10878 18.115 3.92664C18.1903 3.74449 18.3007 3.57896 18.44 3.4395C18.5792 3.30004 18.7446 3.18937 18.9266 3.11382C19.1087 3.03826 19.3038 2.99931 19.5009 2.99917C19.698 2.99903 19.8932 3.03771 20.0753 3.113C20.2575 3.1883 20.423 3.29873 20.5625 3.438L22.5005 5.379V1.5C22.5005 1.10218 22.6585 0.720644 22.9398 0.43934C23.2211 0.158035 23.6026 0 24.0005 0C24.3983 0 24.7798 0.158035 25.0611 0.43934C25.3424 0.720644 25.5005 1.10218 25.5005 1.5V5.379L27.4415 3.438C27.7231 3.15674 28.105 2.99888 28.503 2.99917C28.9011 2.99945 29.2827 3.15784 29.564 3.4395C29.8452 3.72116 30.0031 4.10301 30.0028 4.50106C30.0025 4.89911 29.8441 5.28074 29.5625 5.562L25.5005 9.621V21.402L35.7005 15.513L37.1885 9.963C37.2919 9.5787 37.5437 9.25123 37.8886 9.05263C38.2335 8.85403 38.6432 8.80057 39.0275 8.904C39.4118 9.00743 39.7392 9.25929 39.9378 9.60417C40.1364 9.94905 40.1899 10.3587 40.0865 10.743L39.3785 13.389L42.7385 11.451C43.0828 11.2552 43.4906 11.2036 43.8728 11.3074C44.2551 11.4112 44.5808 11.6619 44.7789 12.005C44.9769 12.348 45.0313 12.7554 44.93 13.1384C44.8288 13.5213 44.5802 13.8487 44.2385 14.049L40.8785 15.987L43.5275 16.698C43.9118 16.8014 44.2392 17.0533 44.4378 17.3982C44.6364 17.7431 44.6899 18.1527 44.5865 18.537C44.483 18.9213 44.2312 19.2488 43.8863 19.4474C43.5414 19.646 43.1318 19.6994 42.7475 19.596L37.2035 18.111L27.0005 24L37.2005 29.889L42.7475 28.404C43.1318 28.301 43.5412 28.3548 43.8858 28.5537C44.2304 28.7526 44.4819 29.0802 44.585 29.4645C44.688 29.8488 44.6341 30.2583 44.4353 30.6029C44.2364 30.9475 43.9088 31.199 43.5245 31.302L40.8755 32.013L44.2355 33.951C44.5772 34.1513 44.8258 34.4787 44.927 34.8616C45.0283 35.2446 44.9739 35.652 44.7759 35.995C44.5778 36.3381 44.2521 36.5888 43.8699 36.6926C43.4876 36.7964 43.0798 36.7448 42.7355 36.549L39.3755 34.611L40.0835 37.26C40.138 37.4515 40.154 37.6519 40.1303 37.8496C40.1066 38.0472 40.0438 38.2382 39.9456 38.4114C39.8474 38.5846 39.7156 38.7365 39.5581 38.8582C39.4005 38.9799 39.2203 39.0691 39.028 39.1205C38.8356 39.1718 38.635 39.1844 38.4377 39.1574C38.2405 39.1305 38.0505 39.0645 37.879 38.9633C37.7075 38.8622 37.5579 38.728 37.4388 38.5684C37.3197 38.4089 37.2336 38.2272 37.1855 38.034L35.7005 32.487L25.5005 26.598V38.379L29.5595 42.438C29.8411 42.7193 29.9995 43.1009 29.9998 43.4989C30.0001 43.897 29.8422 44.2788 29.561 44.5605C29.2797 44.8422 28.8981 45.0006 28.5 45.0008C28.102 45.0011 27.7201 44.8433 27.4385 44.562L25.4975 42.621V46.5C25.4975 46.8978 25.3394 47.2794 25.0581 47.5607C24.7768 47.842 24.3983 48 24.0005 48Z"
-        fill="#CD0921"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Spa.tsx b/apps/scandic-web/components/Icons/Spa.tsx
deleted file mode 100644
index 7cc26f820..000000000
--- a/apps/scandic-web/components/Icons/Spa.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SpaIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12.0013 4.97502C11.7254 4.97502 11.4938 4.88172 11.3063 4.6951C11.1188 4.50847 11.025 4.27722 11.025 4.00135C11.025 3.72547 11.1183 3.49377 11.3049 3.30627C11.4916 3.11877 11.7228 3.02502 11.9987 3.02502C12.2746 3.02502 12.5062 3.11833 12.6937 3.30495C12.8812 3.49158 12.975 3.72283 12.975 3.9987C12.975 4.27458 12.8817 4.50627 12.6951 4.69377C12.5084 4.88127 12.2772 4.97502 12.0013 4.97502ZM12.0013 1.97502C11.7254 1.97502 11.4938 1.88172 11.3063 1.6951C11.1188 1.50847 11.025 1.27722 11.025 1.00135C11.025 0.725466 11.1183 0.493774 11.3049 0.306274C11.4916 0.118774 11.7228 0.0250244 11.9987 0.0250244C12.2746 0.0250244 12.5062 0.118333 12.6937 0.30495C12.8812 0.491583 12.975 0.722833 12.975 0.9987C12.975 1.27458 12.8817 1.50627 12.6951 1.69377C12.5084 1.88127 12.2772 1.97502 12.0013 1.97502ZM8.4125 21.9375C7.3625 21.3042 6.54583 20.4604 5.9625 19.4063C5.37917 18.3521 5.07917 17.2167 5.0625 16C5.07083 14.65 5.43333 13.4104 6.15 12.2813C6.86667 11.1521 7.8375 10.2959 9.0625 9.71252V7.00002C9.0625 6.74169 9.15417 6.52086 9.3375 6.33752C9.52083 6.15419 9.74167 6.06252 10 6.06252H14C14.2583 6.06252 14.4792 6.15419 14.6625 6.33752C14.8458 6.52086 14.9375 6.74169 14.9375 7.00002V9.71252C16.1458 10.2959 17.1104 11.1521 17.8313 12.2813C18.5521 13.4104 18.9208 14.65 18.9375 16C18.9292 17.2167 18.6292 18.3521 18.0375 19.4063C17.4458 20.4604 16.6292 21.3042 15.5875 21.9375H8.4125ZM8.97152 20.0625H15.0285C15.6678 19.5792 16.1667 18.9834 16.525 18.275C16.8833 17.5667 17.0625 16.8076 17.0625 15.9977C17.0625 15.0192 16.8042 14.1207 16.2875 13.3024C15.7708 12.4842 15.0667 11.8625 14.175 11.4375L13.0625 10.9125V7.93752H10.9375V10.9125L9.825 11.4375C8.93005 11.86 8.22506 12.481 7.71003 13.3005C7.19501 14.1201 6.9375 15.0199 6.9375 16C6.9375 16.8084 7.11667 17.5667 7.475 18.275C7.83333 18.9834 8.33218 19.5792 8.97152 20.0625ZM7.00133 2.97502C6.72544 2.97502 6.49375 2.88172 6.30625 2.6951C6.11875 2.50847 6.025 2.27722 6.025 2.00135C6.025 1.72547 6.11831 1.49377 6.30493 1.30627C6.49156 1.11877 6.72281 1.02502 6.99867 1.02502C7.27456 1.02502 7.50625 1.11833 7.69375 1.30495C7.88125 1.49158 7.975 1.72283 7.975 1.9987C7.975 2.27458 7.88169 2.50627 7.69508 2.69377C7.50844 2.88127 7.27719 2.97502 7.00133 2.97502ZM17.0013 2.97502C16.7254 2.97502 16.4938 2.88172 16.3063 2.6951C16.1188 2.50847 16.025 2.27722 16.025 2.00135C16.025 1.72547 16.1183 1.49377 16.3049 1.30627C16.4916 1.11877 16.7228 1.02502 16.9987 1.02502C17.2746 1.02502 17.5063 1.11833 17.6938 1.30495C17.8813 1.49158 17.975 1.72283 17.975 1.9987C17.975 2.27458 17.8817 2.50627 17.6951 2.69377C17.5084 2.88127 17.2772 2.97502 17.0013 2.97502ZM9.00133 4.97502C8.72544 4.97502 8.49375 4.88172 8.30625 4.6951C8.11875 4.50847 8.025 4.27722 8.025 4.00135C8.025 3.72547 8.11831 3.49377 8.30492 3.30627C8.49156 3.11877 8.72281 3.02502 8.99867 3.02502C9.27456 3.02502 9.50625 3.11833 9.69375 3.30495C9.88125 3.49158 9.975 3.72283 9.975 3.9987C9.975 4.27458 9.88169 4.50627 9.69508 4.69377C9.50844 4.88127 9.27719 4.97502 9.00133 4.97502ZM15.0013 4.97502C14.7254 4.97502 14.4938 4.88172 14.3063 4.6951C14.1188 4.50847 14.025 4.27722 14.025 4.00135C14.025 3.72547 14.1183 3.49377 14.3049 3.30627C14.4916 3.11877 14.7228 3.02502 14.9987 3.02502C15.2746 3.02502 15.5063 3.11833 15.6938 3.30495C15.8813 3.49158 15.975 3.72283 15.975 3.9987C15.975 4.27458 15.8817 4.50627 15.6951 4.69377C15.5084 4.88127 15.2772 4.97502 15.0013 4.97502Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Speaker.tsx b/apps/scandic-web/components/Icons/Speaker.tsx
deleted file mode 100644
index eeb76d4d5..000000000
--- a/apps/scandic-web/components/Icons/Speaker.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SpeakerIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      fill="none"
-      height="20"
-      viewBox="0 0 20 20"
-      width="20"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fill="#26201E"
-        d="M16.925 21.75h-9.85c-.516 0-.957-.184-1.324-.55a1.806 1.806 0 0 1-.551-1.325V4.125c0-.516.184-.957.55-1.324.368-.367.81-.551 1.325-.551h9.85c.516 0 .957.184 1.324.55.367.368.551.81.551 1.325v15.75c0 .516-.184.957-.55 1.324-.368.367-.81.551-1.325.551Zm0-1.875V4.125h-9.85v15.75h9.85ZM12 9c.53 0 .982-.188 1.36-.565.377-.377.565-.83.565-1.36 0-.53-.189-.983-.566-1.36A1.854 1.854 0 0 0 12 5.15c-.53 0-.983.188-1.36.565-.377.377-.565.83-.565 1.36 0 .53.188.983.565 1.36.377.377.83.565 1.36.565Zm.003 9.85c1.073 0 1.99-.382 2.753-1.146.763-.765 1.144-1.683 1.144-2.757 0-1.073-.382-1.99-1.146-2.753-.765-.763-1.684-1.144-2.757-1.144-1.073 0-1.99.382-2.753 1.146-.763.765-1.144 1.683-1.144 2.757 0 1.073.382 1.99 1.146 2.753.765.763 1.683 1.144 2.757 1.144Zm-.005-1.875a1.946 1.946 0 0 1-1.43-.595 1.954 1.954 0 0 1-.593-1.431c0-.558.198-1.034.595-1.43a1.954 1.954 0 0 1 1.431-.594c.558 0 1.034.198 1.43.595.396.397.594.874.594 1.432 0 .557-.199 1.033-.595 1.43a1.954 1.954 0 0 1-1.432.593Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/StarFilled.tsx b/apps/scandic-web/components/Icons/StarFilled.tsx
deleted file mode 100644
index 300924a37..000000000
--- a/apps/scandic-web/components/Icons/StarFilled.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function StarFilledIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.9999 17.5625L7.81244 20.0875C7.63744 20.1958 7.45619 20.2417 7.26869 20.225C7.08119 20.2083 6.91661 20.1458 6.77494 20.0375C6.63328 19.9292 6.52494 19.7917 6.44994 19.625C6.37494 19.4583 6.36244 19.275 6.41244 19.075L7.52494 14.3125L3.82494 11.1125C3.66661 10.9708 3.56661 10.8104 3.52494 10.6312C3.48328 10.4521 3.49161 10.2792 3.54994 10.1125C3.60828 9.94583 3.70619 9.80417 3.84369 9.6875C3.98119 9.57083 4.15411 9.5 4.36244 9.475L9.23744 9.05L11.1374 4.5625C11.2208 4.37083 11.3416 4.22917 11.4999 4.1375C11.6583 4.04583 11.8249 4 11.9999 4C12.1749 4 12.3416 4.04583 12.4999 4.1375C12.6583 4.22917 12.7791 4.37083 12.8624 4.5625L14.7624 9.05L19.6374 9.475C19.8458 9.5 20.0187 9.57083 20.1562 9.6875C20.2937 9.80417 20.3916 9.94583 20.4499 10.1125C20.5083 10.2792 20.5166 10.4521 20.4749 10.6312C20.4333 10.8104 20.3333 10.9708 20.1749 11.1125L16.4749 14.3125L17.5874 19.075C17.6374 19.275 17.6249 19.4583 17.5499 19.625C17.4749 19.7917 17.3666 19.9292 17.2249 20.0375C17.0833 20.1458 16.9187 20.2083 16.7312 20.225C16.5437 20.2417 16.3624 20.1958 16.1874 20.0875L11.9999 17.5625Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Store.tsx b/apps/scandic-web/components/Icons/Store.tsx
deleted file mode 100644
index 925b908eb..000000000
--- a/apps/scandic-web/components/Icons/Store.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function StoreIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5.07502 20.8C4.55938 20.8 4.11797 20.6165 3.75079 20.2493C3.38361 19.8821 3.20002 19.4407 3.20002 18.925V11.075C2.79168 10.7584 2.4896 10.3188 2.29377 9.7563C2.09793 9.1938 2.10002 8.59172 2.30002 7.95005L3.32502 4.62505C3.4566 4.20617 3.69097 3.85977 4.02814 3.58587C4.36531 3.31199 4.75593 3.17505 5.20002 3.17505H18.8258C19.267 3.17505 19.6542 3.3063 19.9875 3.5688C20.3209 3.8313 20.5603 4.18272 20.7059 4.62305L21.725 7.95005C21.925 8.59172 21.9271 9.18755 21.7313 9.73755C21.5354 10.2875 21.2334 10.7334 20.825 11.075V18.925C20.825 19.4407 20.6414 19.8821 20.2742 20.2493C19.9071 20.6165 19.4657 20.8 18.95 20.8H5.07502ZM14.175 10.075C14.6417 10.075 14.9896 9.92088 15.2188 9.61255C15.4479 9.30422 15.5375 8.95838 15.4875 8.57505L14.95 5.05005H12.95V8.72505C12.95 9.08852 13.0691 9.40438 13.3073 9.67265C13.5455 9.94092 13.8347 10.075 14.175 10.075ZM9.74902 10.075C10.14 10.075 10.4588 9.94092 10.7053 9.67265C10.9518 9.40438 11.075 9.08852 11.075 8.72505V5.05005H9.07502L8.53752 8.57505C8.47918 8.96672 8.56877 9.31463 8.80627 9.6188C9.04377 9.92297 9.35802 10.075 9.74902 10.075ZM5.37502 10.075C5.69168 10.075 5.96252 9.96436 6.18752 9.74297C6.41252 9.52161 6.55002 9.24063 6.60002 8.90005L7.16252 5.05005H5.13752L4.12502 8.37505C4.00835 8.76672 4.0646 9.14797 4.29377 9.5188C4.52293 9.88963 4.88335 10.075 5.37502 10.075ZM18.65 10.075C19.1334 10.075 19.4958 9.8938 19.7375 9.5313C19.9792 9.1688 20.0333 8.78338 19.9 8.37505L18.8625 5.05005H16.8625L17.4235 8.90005C17.4745 9.23338 17.6125 9.51255 17.8375 9.73755C18.0625 9.96255 18.3333 10.075 18.65 10.075ZM5.07502 18.925H18.95V11.9125C18.875 11.9375 18.8167 11.95 18.775 11.95H18.65C18.2066 11.95 17.8166 11.875 17.48 11.725C17.1433 11.575 16.8149 11.3334 16.4947 11C16.2066 11.3 15.8728 11.5334 15.4933 11.7C15.1139 11.8667 14.7097 11.95 14.2807 11.95C13.8352 11.95 13.4229 11.8667 13.0438 11.7C12.6646 11.5334 12.325 11.3 12.025 11C11.7417 11.3 11.4125 11.5334 11.0375 11.7C10.6625 11.8667 10.2662 11.95 9.84864 11.95C9.38289 11.95 8.95418 11.8709 8.56252 11.7125C8.17085 11.5542 7.82502 11.3167 7.52502 11C7.15835 11.3667 6.81043 11.6167 6.48127 11.75C6.1521 11.8834 5.78335 11.95 5.37502 11.95H5.23037C5.1768 11.95 5.12502 11.9375 5.07502 11.9125V18.925Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Street.tsx b/apps/scandic-web/components/Icons/Street.tsx
deleted file mode 100644
index b2b0c2dfb..000000000
--- a/apps/scandic-web/components/Icons/Street.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function StreetIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4 20V4H6V20H4ZM11 20V16H13V20H11ZM18 20V4H20V20H18ZM11 14V10H13V14H11ZM11 8V4H13V8H11Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Swim.tsx b/apps/scandic-web/components/Icons/Swim.tsx
deleted file mode 100644
index 534bb2068..000000000
--- a/apps/scandic-web/components/Icons/Swim.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SwimIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12 19.85C11.4 19.85 10.9333 20.0125 10.6 20.3375C10.2666 20.6625 9.64162 20.825 8.72495 20.825C7.80828 20.825 7.18328 20.6625 6.84995 20.3375C6.51662 20.0125 6.04995 19.85 5.44995 19.85C4.96662 19.85 4.58953 19.9584 4.3187 20.175C4.04787 20.3917 3.65968 20.5667 3.15413 20.7C2.90134 20.7667 2.67912 20.7141 2.48745 20.5422C2.29578 20.3704 2.19995 20.1516 2.19995 19.886C2.19995 19.6204 2.29162 19.3917 2.47495 19.2C2.65828 19.0084 2.87078 18.85 3.11245 18.725C3.39578 18.5834 3.69683 18.423 4.01558 18.2438C4.33433 18.0646 4.81245 17.975 5.44995 17.975C6.36662 17.975 6.99162 18.1375 7.32495 18.4625C7.65828 18.7875 8.12495 18.95 8.72495 18.95C9.32495 18.95 9.79162 18.7875 10.125 18.4625C10.4583 18.1375 11.0833 17.975 12 17.975C12.9166 17.975 13.5416 18.1375 13.875 18.4625C14.2083 18.7875 14.675 18.95 15.275 18.95C15.875 18.95 16.3416 18.7875 16.675 18.4625C17.0083 18.1375 17.6333 17.975 18.55 17.975C19.1875 17.975 19.6656 18.0646 19.9843 18.2438C20.3031 18.423 20.6041 18.5834 20.8875 18.725C21.1291 18.85 21.3416 19.0093 21.525 19.2027C21.7083 19.3962 21.8 19.6244 21.8 19.8875C21.8 20.1506 21.7034 20.3685 21.5103 20.5411C21.3172 20.7137 21.0971 20.7667 20.85 20.7C20.3416 20.5667 19.952 20.3917 19.6812 20.175C19.4104 19.9584 19.0333 19.85 18.55 19.85C17.95 19.85 17.4833 20.0125 17.15 20.3375C16.8166 20.6625 16.1916 20.825 15.275 20.825C14.3583 20.825 13.7333 20.6625 13.4 20.3375C13.0666 20.0125 12.6 19.85 12 19.85ZM12 15.4C11.3833 15.4 10.9187 15.5625 10.6062 15.8875C10.2937 16.2125 9.66662 16.375 8.72495 16.375C7.78328 16.375 7.15103 16.2125 6.8282 15.8875C6.50537 15.5625 6.04595 15.4 5.44995 15.4C4.96662 15.4 4.58953 15.5084 4.3187 15.725C4.04787 15.9417 3.65968 16.1167 3.15413 16.25C2.90134 16.3167 2.67912 16.2641 2.48745 16.0922C2.29578 15.9204 2.19995 15.7016 2.19995 15.436C2.19995 15.1704 2.29162 14.9417 2.47495 14.75C2.65828 14.5584 2.87078 14.4 3.11245 14.275C3.39578 14.1334 3.69683 13.973 4.01558 13.7938C4.33433 13.6146 4.81245 13.525 5.44995 13.525C6.36662 13.525 6.9937 13.6875 7.3312 14.0125C7.6687 14.3375 8.13328 14.5 8.72495 14.5C9.32495 14.5 9.79162 14.3375 10.125 14.0125C10.4583 13.6875 11.0833 13.525 12 13.525C12.9166 13.525 13.5416 13.6875 13.875 14.0125C14.2083 14.3375 14.675 14.5 15.275 14.5C15.875 14.5 16.3416 14.3375 16.675 14.0125C17.0083 13.6875 17.6333 13.525 18.55 13.525C19.1875 13.525 19.6656 13.6146 19.9843 13.7938C20.3031 13.973 20.6041 14.1334 20.8875 14.275C21.1291 14.4 21.3416 14.5593 21.525 14.7527C21.7083 14.9462 21.8 15.1744 21.8 15.4375C21.8 15.7006 21.7034 15.9185 21.5103 16.0911C21.3172 16.2637 21.0971 16.3167 20.85 16.25C20.3416 16.1167 19.952 15.9417 19.6812 15.725C19.4104 15.5084 19.0333 15.4 18.55 15.4C17.95 15.4 17.4895 15.5625 17.1687 15.8875C16.8479 16.2125 16.2166 16.375 15.275 16.375C14.354 16.375 13.728 16.2125 13.3968 15.8875C13.0656 15.5625 12.6 15.4 12 15.4ZM7.07495 11.375L10.3375 8.11255L9.26245 7.03755C8.85412 6.62922 8.43166 6.30955 7.99508 6.07855C7.55848 5.84753 7.0601 5.6922 6.49995 5.61255C6.18328 5.56255 5.91245 5.41871 5.68745 5.18102C5.46245 4.94336 5.34995 4.66607 5.34995 4.34917C5.34995 4.01642 5.4687 3.73755 5.7062 3.51255C5.9437 3.28755 6.22078 3.19172 6.53745 3.22505C7.41363 3.30625 8.16812 3.48894 8.8009 3.77312C9.4337 4.05731 10.0584 4.50795 10.675 5.12505L16.925 11.375C16.6666 11.5417 16.4125 11.6792 16.1625 11.7875C15.9125 11.8959 15.6186 11.95 15.2809 11.95C14.7019 11.95 14.2401 11.7834 13.8955 11.45C13.5508 11.1167 12.919 10.95 12 10.95C11.0809 10.95 10.4491 11.1167 10.1044 11.45C9.75978 11.7834 9.29798 11.95 8.71903 11.95C8.38131 11.95 8.08745 11.8959 7.83745 11.7875C7.58745 11.6792 7.33328 11.5417 7.07495 11.375ZM16.6 3.17505C17.279 3.17505 17.8529 3.41309 18.3217 3.88917C18.7905 4.36526 19.025 4.93414 19.025 5.59582C19.025 6.27364 18.7905 6.84797 18.3217 7.3188C17.8529 7.78963 17.279 8.02505 16.6 8.02505C15.921 8.02505 15.347 7.79024 14.8782 7.32062C14.4094 6.85099 14.175 6.27611 14.175 5.59597C14.175 4.93202 14.4094 4.36255 14.8782 3.88755C15.347 3.41255 15.921 3.17505 16.6 3.17505Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Swipe.tsx b/apps/scandic-web/components/Icons/Swipe.tsx
deleted file mode 100644
index ed01ef8ed..000000000
--- a/apps/scandic-web/components/Icons/Swipe.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function SwipeIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <mask
-        id="mask0_4743_35236"
-        style={{ maskType: "alpha" }}
-        maskUnits="userSpaceOnUse"
-        x="0"
-        y="0"
-        width="24"
-        height="24"
-      >
-        <rect width="24" height="24" fill="#D9D9D9" />
-      </mask>
-      <g mask="url(#mask0_4743_35236)">
-        <path
-          d="M11.825 22C11.425 22 11.0417 21.925 10.675 21.775C10.3083 21.625 9.98333 21.4083 9.7 21.125L4.6 16L5.35 15.225C5.61667 14.9583 5.92917 14.7792 6.2875 14.6875C6.64583 14.5958 7 14.6 7.35 14.7L9 15.175V7C9 6.71667 9.09583 6.47917 9.2875 6.2875C9.47917 6.09583 9.71667 6 10 6C10.2833 6 10.5208 6.09583 10.7125 6.2875C10.9042 6.47917 11 6.71667 11 7V17.825L8.575 17.15L11.125 19.7C11.2083 19.7833 11.3125 19.8542 11.4375 19.9125C11.5625 19.9708 11.6917 20 11.825 20H16C16.55 20 17.0208 19.8042 17.4125 19.4125C17.8042 19.0208 18 18.55 18 18V14C18 13.7167 18.0958 13.4792 18.2875 13.2875C18.4792 13.0958 18.7167 13 19 13C19.2833 13 19.5208 13.0958 19.7125 13.2875C19.9042 13.4792 20 13.7167 20 14V18C20 19.1 19.6083 20.0417 18.825 20.825C18.0417 21.6083 17.1 22 16 22H11.825ZM12 15V11C12 10.7167 12.0958 10.4792 12.2875 10.2875C12.4792 10.0958 12.7167 10 13 10C13.2833 10 13.5208 10.0958 13.7125 10.2875C13.9042 10.4792 14 10.7167 14 11V15H12ZM15 15V12C15 11.7167 15.0958 11.4792 15.2875 11.2875C15.4792 11.0958 15.7167 11 16 11C16.2833 11 16.5208 11.0958 16.7125 11.2875C16.9042 11.4792 17 11.7167 17 12V15H15ZM22 7H17V5.5H19.9C18.8 4.53333 17.575 3.79167 16.225 3.275C14.875 2.75833 13.4667 2.5 12 2.5C10.5333 2.5 9.125 2.75833 7.775 3.275C6.425 3.79167 5.2 4.53333 4.1 5.5H7V7H2V2H3.5V4.025C4.7 3.04167 6.025 2.29167 7.475 1.775C8.925 1.25833 10.4333 1 12 1C13.5667 1 15.075 1.25833 16.525 1.775C17.975 2.29167 19.3 3.04167 20.5 4.025V2H22V7Z"
-          fill="white"
-        />
-      </g>
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Thermostat.tsx b/apps/scandic-web/components/Icons/Thermostat.tsx
deleted file mode 100644
index 490f2f042..000000000
--- a/apps/scandic-web/components/Icons/Thermostat.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function ThermostatIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M12 21.75C10.6584 21.75 9.5188 21.2812 8.5813 20.3438C7.6438 19.4062 7.17505 18.267 7.17505 16.9258C7.17505 16.1503 7.34797 15.4208 7.6938 14.7375C8.03963 14.0542 8.52505 13.4833 9.15005 13.025V5.1C9.15005 4.30833 9.42713 3.63542 9.9813 3.08125C10.5355 2.52708 11.2084 2.25 12 2.25C12.7917 2.25 13.4646 2.52708 14.0188 3.08125C14.573 3.63542 14.85 4.30833 14.85 5.1V13.025C15.475 13.4833 15.9605 14.0542 16.3063 14.7375C16.6521 15.4208 16.825 16.1503 16.825 16.9258C16.825 18.267 16.3563 19.4062 15.4188 20.3438C14.4813 21.2812 13.3417 21.75 12 21.75ZM11.025 11.05H12.975V10.025H12V9.04375H12.975V7.08125H12V6.1H12.975V5.1C12.975 4.82375 12.8817 4.59219 12.6951 4.40533C12.5085 4.21844 12.2772 4.125 12.0014 4.125C11.7255 4.125 11.4938 4.21844 11.3063 4.40533C11.1188 4.59219 11.025 4.82375 11.025 5.1V11.05Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Train.tsx b/apps/scandic-web/components/Icons/Train.tsx
deleted file mode 100644
index b892a9064..000000000
--- a/apps/scandic-web/components/Icons/Train.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function TrainIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.22498 15.425V6.1C4.22498 5.25 4.43956 4.57292 4.86873 4.06875C5.29789 3.56458 5.87081 3.17917 6.58748 2.9125C7.30414 2.64583 8.13123 2.46875 9.06873 2.38125C10.0062 2.29375 10.9833 2.25 12 2.25C13.0666 2.25 14.0729 2.29375 15.0187 2.38125C15.9646 2.46875 16.7896 2.64583 17.4937 2.9125C18.1979 3.17917 18.7541 3.56458 19.1625 4.06875C19.5708 4.57292 19.775 5.25 19.775 6.1V15.425C19.775 16.3833 19.4521 17.1854 18.8062 17.8313C18.1604 18.4771 17.3583 18.8 16.4 18.8L16.9375 19.3375C17.1958 19.5958 17.2541 19.8917 17.1125 20.225C16.9708 20.5583 16.7166 20.725 16.35 20.725C16.2416 20.725 16.1396 20.7063 16.0437 20.6688C15.9479 20.6313 15.8583 20.5708 15.775 20.4875L14.0875 18.8H9.91248L8.22498 20.4875C8.14164 20.5708 8.05206 20.6313 7.95623 20.6688C7.86039 20.7063 7.75831 20.725 7.64998 20.725C7.29164 20.725 7.03956 20.5583 6.89373 20.225C6.74789 19.8917 6.80414 19.5958 7.06248 19.3375L7.59998 18.8C6.64164 18.8 5.83956 18.4771 5.19373 17.8313C4.54789 17.1854 4.22498 16.3833 4.22498 15.425ZM12 4.125C10.2583 4.125 8.96456 4.22708 8.11873 4.43125C7.27289 4.63542 6.71664 4.875 6.44998 5.15H17.6C17.3583 4.85833 16.8125 4.61458 15.9625 4.41875C15.1125 4.22292 13.7916 4.125 12 4.125ZM6.09998 10.125H11.075V7.025H6.09998V10.125ZM12.95 10.125H17.9V7.025H12.95V10.125ZM8.54998 15.875C8.96664 15.875 9.30831 15.7417 9.57498 15.475C9.84164 15.2083 9.97498 14.8667 9.97498 14.45C9.97498 14.0333 9.84164 13.6917 9.57498 13.425C9.30831 13.1583 8.96664 13.025 8.54998 13.025C8.13331 13.025 7.79164 13.1583 7.52498 13.425C7.25831 13.6917 7.12498 14.0333 7.12498 14.45C7.12498 14.8667 7.25831 15.2083 7.52498 15.475C7.79164 15.7417 8.13331 15.875 8.54998 15.875ZM15.45 15.875C15.8666 15.875 16.2083 15.7417 16.475 15.475C16.7416 15.2083 16.875 14.8667 16.875 14.45C16.875 14.0333 16.7416 13.6917 16.475 13.425C16.2083 13.1583 15.8666 13.025 15.45 13.025C15.0333 13.025 14.6916 13.1583 14.425 13.425C14.1583 13.6917 14.025 14.0333 14.025 14.45C14.025 14.8667 14.1583 15.2083 14.425 15.475C14.6916 15.7417 15.0333 15.875 15.45 15.875ZM7.59998 16.925H16.4C16.8333 16.925 17.1916 16.7833 17.475 16.5C17.7583 16.2167 17.9 15.8583 17.9 15.425V12H6.09998V15.425C6.09998 15.8583 6.24164 16.2167 6.52498 16.5C6.80831 16.7833 7.16664 16.925 7.59998 16.925Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/TripAdvisor.tsx b/apps/scandic-web/components/Icons/TripAdvisor.tsx
deleted file mode 100644
index 0b58ca839..000000000
--- a/apps/scandic-web/components/Icons/TripAdvisor.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function TripAdvisorIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        fillRule="evenodd"
-        clipRule="evenodd"
-        d="M9.05211 12.7618C9.05211 13.6531 8.29824 14.3757 7.3683 14.3757C6.43836 14.3757 5.68449 13.6531 5.68449 12.7618C5.68449 11.8705 6.43836 11.148 7.3683 11.148C8.29809 11.1473 9.05234 11.8692 9.05299 12.7604V12.7618H9.05211ZM16.8618 11.148C15.9318 11.148 15.1779 11.8705 15.1779 12.7618C15.1779 13.6531 15.9318 14.3757 16.8618 14.3757C17.7917 14.3757 18.5456 13.6531 18.5456 12.7618C18.5456 11.8705 17.7917 11.148 16.8618 11.148ZM16.8618 15.8404C15.0878 15.8404 13.6497 14.4621 13.6497 12.7618C13.6497 11.0615 15.0878 9.6832 16.8618 9.6832C18.6357 9.6832 20.0738 11.0615 20.0738 12.7618C20.0738 14.4621 18.6357 15.8404 16.8618 15.8404ZM12.1165 12.673C12.1165 10.6472 10.5782 8.90887 8.55158 8.16488C10.833 7.25401 13.3994 7.25401 15.6808 8.16488C13.6536 8.90915 12.1165 10.6472 12.1165 12.673ZM7.36919 15.8404C5.59524 15.8404 4.15717 14.4621 4.15717 12.7618C4.15717 11.0615 5.59524 9.6832 7.36919 9.6832C9.14313 9.6832 10.5812 11.0615 10.5812 12.7618C10.5812 14.4621 9.14313 15.8404 7.36919 15.8404ZM20.0619 9.39966L21.615 7.78013H18.1719C14.5206 5.39849 9.72128 5.39849 6.06994 7.78013H2.61802L4.17108 9.39966C2.2302 11.0885 2.08519 13.9656 3.84718 15.8258C5.60917 17.6862 8.61095 17.8251 10.5518 16.1363C10.5663 16.1237 10.5805 16.1111 10.5948 16.0984L12.1165 17.6862L13.6373 16.1004C14.5135 16.8807 15.6657 17.3138 16.8618 17.3122C19.483 17.3122 21.61 15.2753 21.61 12.7629C21.6119 11.4828 21.0497 10.2613 20.0619 9.39966Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Tshirt.tsx b/apps/scandic-web/components/Icons/Tshirt.tsx
deleted file mode 100644
index 4d92d2418..000000000
--- a/apps/scandic-web/components/Icons/Tshirt.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function TshirtIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M6.20005 10.8L5.15005 11.4C4.92505 11.5333 4.6813 11.5646 4.4188 11.4937C4.1563 11.4229 3.95838 11.275 3.82505 11.05L1.92505 7.72498C1.79171 7.49998 1.76046 7.26039 1.8313 7.00623C1.90213 6.75206 2.05005 6.55831 2.27505 6.42498L7.85005 3.22498H9.52505C9.67505 3.22498 9.79588 3.27081 9.88755 3.36248C9.97921 3.45414 10.025 3.57498 10.025 3.72498V4.19998C10.025 4.74998 10.2167 5.21664 10.6 5.59998C10.9834 5.98331 11.45 6.17498 12 6.17498C12.55 6.17498 13.0167 5.98331 13.4 5.59998C13.7834 5.21664 13.975 4.74998 13.975 4.19998V3.72498C13.975 3.57498 14.0209 3.45414 14.1125 3.36248C14.2042 3.27081 14.325 3.22498 14.475 3.22498H16.15L21.725 6.42498C21.95 6.55831 22.098 6.75206 22.1688 7.00623C22.2396 7.26039 22.2084 7.49998 22.075 7.72498L20.175 11.05C20.0417 11.275 19.8459 11.4208 19.5875 11.4875C19.3292 11.5541 19.0834 11.5208 18.85 11.3875L17.8 10.8125V19.8C17.8 20.0666 17.7042 20.2958 17.5125 20.4875C17.3209 20.6791 17.0917 20.775 16.825 20.775H7.17505C6.90838 20.775 6.67921 20.6791 6.48755 20.4875C6.29588 20.2958 6.20005 20.0666 6.20005 19.8V10.8ZM8.07505 7.67498V18.9H15.925V7.67498L18.975 9.34998L20.025 7.62498L15.775 5.14998H15.725C15.5 5.99998 15.05 6.69581 14.375 7.23748C13.7 7.77914 12.9084 8.04998 12 8.04998C11.0917 8.04998 10.3 7.77914 9.62505 7.23748C8.95005 6.69581 8.50005 5.99998 8.27505 5.14998H8.22505L3.97505 7.62498L5.02505 9.34998L8.07505 7.67498Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/TshirtWash.tsx b/apps/scandic-web/components/Icons/TshirtWash.tsx
deleted file mode 100644
index 58dea52a8..000000000
--- a/apps/scandic-web/components/Icons/TshirtWash.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function TshirtWashIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M4.85 9.3875L7.9375 7.675V13.425C7.6125 13.4583 7.29375 13.5104 6.98125 13.5813C6.66875 13.6521 6.3625 13.75 6.0625 13.875V10.875L4.95 11.475C4.725 11.6 4.48958 11.6271 4.24375 11.5563C3.99791 11.4854 3.8125 11.3417 3.6875 11.125L1.6875 7.625C1.55416 7.4 1.52291 7.16458 1.59375 6.91875C1.66458 6.67292 1.8125 6.48333 2.0375 6.35L7.0875 3.4375C7.2625 3.3375 7.44583 3.25 7.6375 3.175C7.82916 3.1 8.02916 3.0625 8.2375 3.0625C8.4625 3.0625 8.65833 3.125 8.825 3.25C8.99166 3.375 9.11666 3.5375 9.2 3.7375C9.45833 4.37917 9.79583 4.92708 10.2125 5.38125C10.6292 5.83542 11.225 6.0625 12 6.0625C12.775 6.0625 13.3708 5.83542 13.7875 5.38125C14.2042 4.92708 14.5417 4.37917 14.8 3.7375C14.8833 3.5375 15.0125 3.375 15.1875 3.25C15.3625 3.125 15.5625 3.0625 15.7875 3.0625C15.9958 3.0625 16.1917 3.1 16.375 3.175C16.5583 3.25 16.7375 3.3375 16.9125 3.4375L21.975 6.35C22.2 6.48333 22.3458 6.67292 22.4125 6.91875C22.4792 7.16458 22.4458 7.4 22.3125 7.625L20.3125 11.125C20.1875 11.3417 20.0021 11.4854 19.7562 11.5563C19.5104 11.6271 19.275 11.6 19.05 11.475L17.9375 10.875V15.8L16.3875 17.1375C16.3375 17.1792 16.2875 17.2167 16.2375 17.25C16.1875 17.2833 16.1292 17.3125 16.0625 17.3375V7.675L19.15 9.3875L20.2125 7.525L16.275 5.2375C15.8667 6.0625 15.2792 6.71875 14.5125 7.20625C13.7458 7.69375 12.9083 7.9375 12 7.9375C11.1 7.9375 10.2667 7.69375 9.5 7.20625C8.73333 6.71875 8.14166 6.0625 7.725 5.2375L3.7625 7.525L4.85 9.3875ZM4.05 18.3875C3.875 18.1875 3.8 17.9583 3.825 17.7C3.85 17.4417 3.9625 17.225 4.1625 17.05L5.5625 15.85C5.94583 15.5167 6.38333 15.2646 6.875 15.0938C7.36666 14.9229 7.86666 14.8375 8.375 14.8375C8.88333 14.8375 9.37916 14.9229 9.8625 15.0938C10.3458 15.2646 10.7792 15.5167 11.1625 15.85L14.0625 18.325C14.2792 18.5 14.525 18.6333 14.8 18.725C15.075 18.8167 15.3583 18.8625 15.65 18.8625C15.9417 18.8625 16.2229 18.8188 16.4937 18.7313C16.7646 18.6438 17.0042 18.5083 17.2125 18.325L18.6125 17.1125C18.8125 16.9375 19.0417 16.8604 19.3 16.8813C19.5583 16.9021 19.775 17.0125 19.95 17.2125C20.125 17.4125 20.2 17.6417 20.175 17.9C20.15 18.1583 20.0375 18.375 19.8375 18.55L18.4375 19.75C18.0542 20.0833 17.6208 20.3313 17.1375 20.4938C16.6542 20.6563 16.1583 20.7375 15.65 20.7375C15.1417 20.7375 14.6417 20.6563 14.15 20.4938C13.6583 20.3313 13.2208 20.0833 12.8375 19.75L9.9375 17.275C9.72916 17.1 9.48958 16.9667 9.21875 16.875C8.94791 16.7833 8.66666 16.7375 8.375 16.7375C8.08333 16.7375 7.8 16.7833 7.525 16.875C7.25 16.9667 7.00416 17.1 6.7875 17.275L5.3625 18.475C5.1625 18.6417 4.9375 18.7188 4.6875 18.7063C4.4375 18.6938 4.225 18.5875 4.05 18.3875Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/TvCasting.tsx b/apps/scandic-web/components/Icons/TvCasting.tsx
deleted file mode 100644
index 5169f41bf..000000000
--- a/apps/scandic-web/components/Icons/TvCasting.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function TvCastingIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M5.1375 15.9125H7.05C7.04167 15.3875 6.85208 14.9396 6.48125 14.5687C6.11042 14.1979 5.6625 14.0083 5.1375 14V15.9125ZM8.525 15.9125H9.9C9.9 14.5949 9.43566 13.4717 8.50697 12.543C7.57827 11.6143 6.45512 11.15 5.1375 11.15V12.525C6.07917 12.5333 6.87917 12.8646 7.5375 13.5187C8.19583 14.1729 8.525 14.9708 8.525 15.9125ZM11.375 15.9125H12.75C12.75 14.8658 12.5518 13.8785 12.1553 12.9507C11.7588 12.023 11.2156 11.2141 10.5257 10.5243C9.83584 9.83437 9.02702 9.29118 8.09925 8.8947C7.17147 8.49822 6.18422 8.29998 5.1375 8.29998V9.67783C6.8675 9.67783 8.33958 10.2836 9.55375 11.4952C10.7679 12.7067 11.375 14.1791 11.375 15.9125ZM4.125 18.8C3.60937 18.8 3.16796 18.6164 2.80077 18.2492C2.43359 17.882 2.25 17.4406 2.25 16.925V5.09998C2.25 4.58434 2.43359 4.14293 2.80077 3.77575C3.16796 3.40857 3.60937 3.22498 4.125 3.22498H19.875C20.3906 3.22498 20.832 3.40857 21.1992 3.77575C21.5664 4.14293 21.75 4.58434 21.75 5.09998V16.925C21.75 17.4406 21.5664 17.882 21.1992 18.2492C20.832 18.6164 20.3906 18.8 19.875 18.8H15.85V19.8375C15.85 20.0958 15.7583 20.3166 15.575 20.5C15.3917 20.6833 15.1708 20.775 14.9125 20.775H9.0875C8.82917 20.775 8.60833 20.6833 8.425 20.5C8.24167 20.3166 8.15 20.0958 8.15 19.8375V18.8H4.125ZM4.125 16.925H19.875V5.09998H4.125V16.925Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/WarningTriangle.tsx b/apps/scandic-web/components/Icons/WarningTriangle.tsx
deleted file mode 100644
index cc4ebb766..000000000
--- a/apps/scandic-web/components/Icons/WarningTriangle.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function WarningTriangleIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M2.95563 20.775C2.7768 20.775 2.61564 20.7315 2.47216 20.6444C2.32869 20.5573 2.2171 20.4425 2.13738 20.3C2.05405 20.1583 2.0103 20.0063 2.00613 19.8438C2.00196 19.6813 2.04571 19.5208 2.13738 19.3625L11.1874 3.75001C11.279 3.59167 11.3986 3.47501 11.546 3.40001C11.6934 3.32501 11.8447 3.28751 11.9999 3.28751C12.155 3.28751 12.3063 3.32501 12.4538 3.40001C12.6012 3.47501 12.7207 3.59167 12.8124 3.75001L21.8624 19.3625C21.954 19.5208 21.9978 19.6813 21.9936 19.8438C21.9895 20.0063 21.9457 20.1583 21.8624 20.3C21.779 20.4417 21.6663 20.5563 21.524 20.6438C21.3818 20.7313 21.2237 20.775 21.0499 20.775H2.95563ZM11.9973 17.875C12.2657 17.875 12.4915 17.7842 12.6749 17.6026C12.8582 17.4211 12.9499 17.1961 12.9499 16.9276C12.9499 16.6592 12.8591 16.4333 12.6775 16.25C12.4959 16.0667 12.2709 15.975 12.0025 15.975C11.7341 15.975 11.5082 16.0658 11.3249 16.2474C11.1415 16.4289 11.0499 16.6539 11.0499 16.9224C11.0499 17.1908 11.1407 17.4167 11.3223 17.6C11.5038 17.7833 11.7288 17.875 11.9973 17.875ZM12.0124 15C12.2707 15 12.4915 14.9083 12.6749 14.725C12.8582 14.5417 12.9499 14.3208 12.9499 14.0625V11.0125C12.9499 10.7542 12.8582 10.5333 12.6749 10.35C12.4915 10.1667 12.2707 10.075 12.0124 10.075C11.754 10.075 11.5332 10.1667 11.3499 10.35C11.1665 10.5333 11.0749 10.7542 11.0749 11.0125V14.0625C11.0749 14.3208 11.1665 14.5417 11.3499 14.725C11.5332 14.9083 11.754 15 12.0124 15Z"
-        fill="white"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Wheelchair.tsx b/apps/scandic-web/components/Icons/Wheelchair.tsx
deleted file mode 100644
index dac6ed119..000000000
--- a/apps/scandic-web/components/Icons/Wheelchair.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function WheelchairIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      width="16"
-      height="16"
-      viewBox="0 0 16 16"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M5.41602 14.5C4.51046 14.5 3.7424 14.1847 3.11185 13.5541C2.48129 12.9236 2.16602 12.1555 2.16602 11.25C2.16602 10.3444 2.48129 9.57636 3.11185 8.94581C3.7424 8.31525 4.51324 7.99998 5.42435 7.99998V9.24998C4.86324 9.24998 4.38824 9.44442 3.99935 9.83331C3.61046 10.2222 3.41602 10.6944 3.41602 11.25C3.41602 11.8055 3.61046 12.2778 3.99935 12.6666C4.38824 13.0555 4.86046 13.25 5.41602 13.25C5.97157 13.25 6.44379 13.0541 6.83268 12.6625C7.22157 12.2708 7.41602 11.7916 7.41602 11.225H8.66602C8.66602 12.1416 8.35074 12.9166 7.72018 13.55C7.08963 14.1833 6.32157 14.5 5.41602 14.5ZM7.38268 10.6C6.89379 10.6 6.52018 10.3944 6.26185 9.98331C6.00352 9.5722 5.97157 9.14442 6.16602 8.69998L7.36602 6.03331H5.84935L5.64935 6.54998C5.59379 6.70553 5.49102 6.82081 5.34102 6.89581C5.19102 6.97081 5.03546 6.98053 4.87435 6.92498C4.70213 6.86942 4.57574 6.76109 4.49518 6.59998C4.41463 6.43886 4.40768 6.2722 4.47435 6.09998L4.68268 5.54998C4.77713 5.30553 4.92852 5.11664 5.13685 4.98331C5.34518 4.84998 5.5799 4.78331 5.84102 4.78331H9.21601C9.69379 4.78331 10.0618 4.97914 10.3202 5.37081C10.5785 5.76248 10.6105 6.17775 10.416 6.61664L9.31602 9.03331H11.2827C11.6438 9.03331 11.9507 9.1597 12.2035 9.41248C12.4563 9.66525 12.5827 9.9722 12.5827 10.3333V13.2083C12.5827 13.3805 12.5216 13.5278 12.3993 13.65C12.2771 13.7722 12.1299 13.8333 11.9577 13.8333C11.7855 13.8333 11.6382 13.7722 11.516 13.65C11.3938 13.5278 11.3327 13.3805 11.3327 13.2083V10.6H7.38268ZM10.5493 4.44998C10.1882 4.44998 9.88129 4.32359 9.62852 4.07081C9.37574 3.81803 9.24935 3.51109 9.24935 3.14998C9.24935 2.78886 9.37574 2.48192 9.62852 2.22914C9.88129 1.97636 10.1882 1.84998 10.5493 1.84998C10.9105 1.84998 11.2174 1.97636 11.4702 2.22914C11.723 2.48192 11.8493 2.78886 11.8493 3.14998C11.8493 3.51109 11.723 3.81803 11.4702 4.07081C11.2174 4.32359 10.9105 4.44998 10.5493 4.44998Z"
-        fill="#787472"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Wifi.tsx b/apps/scandic-web/components/Icons/Wifi.tsx
deleted file mode 100644
index 594bbe660..000000000
--- a/apps/scandic-web/components/Icons/Wifi.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function BarIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      className={classNames}
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      {...props}
-    >
-      <path
-        d="M11.9999 20.6875C11.3332 20.6875 10.7707 20.4584 10.3124 20C9.85406 19.5417 9.62489 18.9792 9.62489 18.3125C9.62489 17.6459 9.85406 17.0834 10.3124 16.625C10.7707 16.1667 11.3332 15.9375 11.9999 15.9375C12.6666 15.9375 13.2291 16.1667 13.6874 16.625C14.1457 17.0834 14.3749 17.6459 14.3749 18.3125C14.3749 18.9792 14.1457 19.5417 13.6874 20C13.2291 20.4584 12.6666 20.6875 11.9999 20.6875ZM11.9999 10.05C13.2249 10.05 14.3853 10.2459 15.4811 10.6375C16.577 11.0292 17.5707 11.5709 18.4624 12.2625C18.7707 12.5042 18.9332 12.8125 18.9499 13.1875C18.9666 13.5625 18.8332 13.8917 18.5499 14.175C18.2832 14.4417 17.9561 14.5813 17.5686 14.5938C17.1811 14.6063 16.8332 14.5 16.5249 14.275C15.8916 13.825 15.1916 13.4771 14.4249 13.2313C13.6582 12.9855 12.8499 12.8625 11.9999 12.8625C11.1499 12.8625 10.3416 12.9855 9.57489 13.2313C8.80822 13.4771 8.10822 13.825 7.47489 14.275C7.16655 14.5 6.81864 14.6042 6.43114 14.5875C6.04364 14.5709 5.71655 14.4292 5.44989 14.1625C5.17489 13.8792 5.04364 13.55 5.05614 13.175C5.06864 12.8 5.22905 12.4917 5.53739 12.25C6.42905 11.5584 7.42281 11.0188 8.51864 10.6313C9.61447 10.2438 10.7749 10.05 11.9999 10.05ZM11.9999 4.42505C13.9999 4.42505 15.8874 4.75838 17.6624 5.42505C19.4374 6.09172 21.0291 7.02922 22.4374 8.23755C22.7457 8.49588 22.9061 8.8188 22.9186 9.2063C22.9311 9.5938 22.7999 9.92505 22.5249 10.2C22.2582 10.4667 21.9291 10.6042 21.5374 10.6125C21.1457 10.6209 20.7957 10.5 20.4874 10.25C19.3124 9.29172 18.0082 8.55005 16.5749 8.02505C15.1416 7.50005 13.6166 7.23755 11.9999 7.23755C10.3832 7.23755 8.85822 7.50005 7.42489 8.02505C5.99155 8.55005 4.68739 9.29172 3.51239 10.25C3.20405 10.5 2.85405 10.6209 2.46239 10.6125C2.07072 10.6042 1.74155 10.4667 1.47489 10.2C1.19989 9.92505 1.06864 9.5938 1.08114 9.2063C1.09364 8.8188 1.25405 8.49588 1.56239 8.23755C2.97072 7.02922 4.56239 6.09172 6.33739 5.42505C8.11239 4.75838 9.99989 4.42505 11.9999 4.42505Z"
-        fill="#4D001B"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/WindowCurtainsAlt.tsx b/apps/scandic-web/components/Icons/WindowCurtainsAlt.tsx
deleted file mode 100644
index 6fe6dce4c..000000000
--- a/apps/scandic-web/components/Icons/WindowCurtainsAlt.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function WindowCurtainsAltIcon({
-  className,
-  color,
-  ...props
-}: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M4.0625 19.0625V4.9375C4.0625 4.42187 4.24609 3.98046 4.61328 3.61328C4.98046 3.24609 5.42187 3.0625 5.9375 3.0625H18.0625C18.5781 3.0625 19.0195 3.24609 19.3867 3.61328C19.7539 3.98046 19.9375 4.42187 19.9375 4.9375V19.0625H21C21.2583 19.0625 21.4792 19.1542 21.6625 19.3375C21.8458 19.5208 21.9375 19.7417 21.9375 20C21.9375 20.2583 21.8458 20.4792 21.6625 20.6625C21.4792 20.8458 21.2583 20.9375 21 20.9375H3C2.74167 20.9375 2.52083 20.8458 2.3375 20.6625C2.15417 20.4792 2.0625 20.2583 2.0625 20C2.0625 19.7417 2.15417 19.5208 2.3375 19.3375C2.52083 19.1542 2.74167 19.0625 3 19.0625H4.0625ZM5.9375 19.0625H9.0625V4.9375H5.9375V19.0625ZM10.9375 19.0625H13.0625V4.9375H10.9375V19.0625ZM14.9375 19.0625H18.0625V4.9375H14.9375V19.0625Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/WineBar.tsx b/apps/scandic-web/components/Icons/WineBar.tsx
deleted file mode 100644
index 1140d4ee6..000000000
--- a/apps/scandic-web/components/Icons/WineBar.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function WineBarIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M11.0625 19.0625V14.85C9.62917 14.6083 8.4375 13.9437 7.4875 12.8562C6.5375 11.7688 6.0625 10.4833 6.0625 9V4C6.0625 3.74167 6.15417 3.52083 6.3375 3.3375C6.52083 3.15417 6.74167 3.0625 7 3.0625H17C17.2583 3.0625 17.4792 3.15417 17.6625 3.3375C17.8458 3.52083 17.9375 3.74167 17.9375 4V9C17.9375 10.4833 17.4625 11.7688 16.5125 12.8562C15.5625 13.9437 14.3708 14.6083 12.9375 14.85V19.0625H15C15.2583 19.0625 15.4792 19.1542 15.6625 19.3375C15.8458 19.5208 15.9375 19.7417 15.9375 20C15.9375 20.2583 15.8458 20.4792 15.6625 20.6625C15.4792 20.8458 15.2583 20.9375 15 20.9375H9C8.74167 20.9375 8.52083 20.8458 8.3375 20.6625C8.15417 20.4792 8.0625 20.2583 8.0625 20C8.0625 19.7417 8.15417 19.5208 8.3375 19.3375C8.52083 19.1542 8.74167 19.0625 9 19.0625H11.0625ZM12 13.0625C12.9417 13.0625 13.7729 12.7688 14.4938 12.1813C15.2146 11.5938 15.6917 10.8458 15.925 9.9375H8.075C8.31667 10.8458 8.79583 11.5938 9.5125 12.1813C10.2292 12.7688 11.0583 13.0625 12 13.0625ZM7.9375 8.0625H16.0625V4.9375H7.9375V8.0625Z"
-        fill="#26201E"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Yard.tsx b/apps/scandic-web/components/Icons/Yard.tsx
deleted file mode 100644
index 19c0bd09b..000000000
--- a/apps/scandic-web/components/Icons/Yard.tsx
+++ /dev/null
@@ -1,23 +0,0 @@
-import { iconVariants } from "./variants"
-
-import type { IconProps } from "@/types/components/icon"
-
-export default function YardIcon({ className, color, ...props }: IconProps) {
-  const classNames = iconVariants({ className, color })
-  return (
-    <svg
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
-      {...props}
-    >
-      <path
-        d="M12 19C12 17.3333 11.4167 15.9167 10.25 14.75C9.08333 13.5833 7.66667 13 6 13C6 14.6667 6.58333 16.0833 7.75 17.25C8.91667 18.4167 10.3333 19 12 19ZM12 13.95C12.4333 13.95 12.8 13.8 13.1 13.5C13.4 13.2 13.55 12.8333 13.55 12.4V12.25C13.6833 12.35 13.8208 12.425 13.9625 12.475C14.1042 12.525 14.2667 12.55 14.45 12.55C14.8833 12.55 15.25 12.4 15.55 12.1C15.85 11.8 16 11.4333 16 11C16 10.6667 15.9208 10.375 15.7625 10.125C15.6042 9.875 15.3833 9.7 15.1 9.6C15.3833 9.5 15.6042 9.325 15.7625 9.075C15.9208 8.825 16 8.53333 16 8.2C16 7.76667 15.85 7.4 15.55 7.1C15.25 6.8 14.8833 6.65 14.45 6.65C14.2667 6.65 14.1042 6.675 13.9625 6.725C13.8208 6.775 13.6833 6.85 13.55 6.95V6.8C13.55 6.36667 13.4 6 13.1 5.7C12.8 5.4 12.4333 5.25 12 5.25C11.5667 5.25 11.2 5.4 10.9 5.7C10.6 6 10.45 6.36667 10.45 6.8V6.95C10.3167 6.85 10.1792 6.775 10.0375 6.725C9.89583 6.675 9.73333 6.65 9.55 6.65C9.11667 6.65 8.75 6.8 8.45 7.1C8.15 7.4 8 7.76667 8 8.2C8 8.53333 8.07917 8.825 8.2375 9.075C8.39583 9.325 8.61667 9.5 8.9 9.6C8.61667 9.7 8.39583 9.875 8.2375 10.125C8.07917 10.375 8 10.6667 8 11C8 11.4333 8.15 11.8 8.45 12.1C8.75 12.4 9.11667 12.55 9.55 12.55C9.73333 12.55 9.89583 12.525 10.0375 12.475C10.1792 12.425 10.3167 12.35 10.45 12.25V12.4C10.45 12.8333 10.6 13.2 10.9 13.5C11.2 13.8 11.5667 13.95 12 13.95ZM12 11.15C11.5667 11.15 11.2 11.0042 10.9 10.7125C10.6 10.4208 10.45 10.05 10.45 9.6C10.45 9.16667 10.6 8.8 10.9 8.5C11.2 8.2 11.5667 8.05 12 8.05C12.4333 8.05 12.8 8.2 13.1 8.5C13.4 8.8 13.55 9.16667 13.55 9.6C13.55 10.05 13.4 10.4208 13.1 10.7125C12.8 11.0042 12.4333 11.15 12 11.15ZM12 19C13.6667 19 15.0833 18.4167 16.25 17.25C17.4167 16.0833 18 14.6667 18 13C16.3333 13 14.9167 13.5833 13.75 14.75C12.5833 15.9167 12 17.3333 12 19ZM4 22C3.45 22 2.97917 21.8042 2.5875 21.4125C2.19583 21.0208 2 20.55 2 20V4C2 3.45 2.19583 2.97917 2.5875 2.5875C2.97917 2.19583 3.45 2 4 2H20C20.55 2 21.0208 2.19583 21.4125 2.5875C21.8042 2.97917 22 3.45 22 4V20C22 20.55 21.8042 21.0208 21.4125 21.4125C21.0208 21.8042 20.55 22 20 22H4ZM4 20H20V4H4V20Z"
-        fill="#1C1B1F"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/get-icon-by-icon-name.ts b/apps/scandic-web/components/Icons/get-icon-by-icon-name.ts
deleted file mode 100644
index d4c7c1c00..000000000
--- a/apps/scandic-web/components/Icons/get-icon-by-icon-name.ts
+++ /dev/null
@@ -1,372 +0,0 @@
-import {
-  AccesoriesIcon,
-  AccessibilityIcon,
-  AccountCircleIcon,
-  AirIcon,
-  AirplaneIcon,
-  ArrowFromIcon,
-  ArrowRightIcon,
-  ArrowToIcon,
-  BarIcon,
-  BedIcon,
-  BikingIcon,
-  BusinessIcon,
-  CalendarIcon,
-  CameraIcon,
-  CellphoneIcon,
-  CheckCircleIcon,
-  CheckIcon,
-  ChevronDownIcon,
-  ChevronDownSmallIcon,
-  ChevronLeftIcon,
-  ChevronLeftSmallIcon,
-  ChevronRightIcon,
-  ChevronRightSmallIcon,
-  ChevronUpIcon,
-  ChevronUpSmallIcon,
-  CloseIcon,
-  CloseLargeIcon,
-  CoffeeAltIcon,
-  CoinIcon,
-  ConciergeIcon,
-  ConvenienceStore24hIcon,
-  CoolIcon,
-  CroissantCoffeeEggIcon,
-  CrossCircle,
-  CrossCircleOutlineIcon,
-  CulturalIcon,
-  CutleryOneIcon,
-  CutleryTwoIcon,
-  DiamondIcon,
-  DirectionsIcon,
-  DoorOpenIcon,
-  DresserIcon,
-  ElectricBikeIcon,
-  ElectricCarIcon,
-  EmailIcon,
-  EyeHideIcon,
-  EyeShowIcon,
-  FacebookIcon,
-  FanIcon,
-  FitnessIcon,
-  FootstoolIcon,
-  GalleryIcon,
-  GarageIcon,
-  GiftIcon,
-  GiftOpenIcon,
-  GlobeIcon,
-  GolfIcon,
-  GroceriesIcon,
-  HandKeyIcon,
-  HangerAltIcon,
-  HangerIcon,
-  HeatIcon,
-  HotelNightIcon,
-  HouseIcon,
-  ImageIcon,
-  InfoCircleIcon,
-  InstagramIcon,
-  KayakingIcon,
-  KettleIcon,
-  KidsIcon,
-  KidsMocktailIcon,
-  LampIcon,
-  LaundryMachineIcon,
-  LinkIcon,
-  LocalBarIcon,
-  LocationIcon,
-  LockIcon,
-  MagicWandIcon,
-  MapIcon,
-  MinusIcon,
-  MoneyHandIcon,
-  MuseumIcon,
-  NatureIcon,
-  NightlifeIcon,
-  NoSmokingIcon,
-  OpenInNewIcon,
-  OpenInNewSmallIcon,
-  OutdoorFurnitureIcon,
-  ParkingIcon,
-  People2Icon,
-  PersonIcon,
-  PetsIcon,
-  PhoneIcon,
-  PlusCircleIcon,
-  PlusIcon,
-  PriceTagIcon,
-  RestaurantIcon,
-  RoomServiceIcon,
-  SaunaIcon,
-  SearchIcon,
-  ServiceIcon,
-  ShoppingIcon,
-  SkateboardingIcon,
-  SmokingIcon,
-  SnowflakeIcon,
-  SpaIcon,
-  StarFilledIcon,
-  StreetIcon,
-  SwimIcon,
-  SwipeIcon,
-  ThermostatIcon,
-  TrainIcon,
-  TripAdvisorIcon,
-  TshirtIcon,
-  TshirtWashIcon,
-  TvCastingIcon,
-  VoucherIcon,
-  WarningTriangle,
-  WifiIcon,
-} from "."
-
-import type { FC } from "react"
-
-import { IconName, type IconProps } from "@/types/components/icon"
-
-export function getIconByIconName(
-  icon: IconName | null = null
-): FC<IconProps> | null {
-  switch (icon) {
-    case IconName.Accesories:
-      return AccesoriesIcon
-    case IconName.Accessibility:
-      return AccessibilityIcon
-    case IconName.AccountCircle:
-      return AccountCircleIcon
-    case IconName.Air:
-      return AirIcon
-    case IconName.Airplane:
-      return AirplaneIcon
-    case IconName.ArrowFrom:
-      return ArrowFromIcon
-    case IconName.ArrowRight:
-      return ArrowRightIcon
-    case IconName.ArrowTo:
-      return ArrowToIcon
-    case IconName.Bar:
-      return BarIcon
-    case IconName.Bed:
-      return BedIcon
-    case IconName.Biking:
-      return BikingIcon
-    case IconName.Business:
-      return BusinessIcon
-    case IconName.Calendar:
-      return CalendarIcon
-    case IconName.Camera:
-      return CameraIcon
-    case IconName.Cellphone:
-      return CellphoneIcon
-    case IconName.Check:
-      return CheckIcon
-    case IconName.CrossCircle:
-      return CrossCircle
-    case IconName.CrossCircleOutline:
-      return CrossCircleOutlineIcon
-    case IconName.CheckCircle:
-      return CheckCircleIcon
-    case IconName.ChevronDown:
-      return ChevronDownIcon
-    case IconName.ChevronDownSmall:
-      return ChevronDownSmallIcon
-    case IconName.ChevronLeft:
-      return ChevronLeftIcon
-    case IconName.ChevronLeftSmall:
-      return ChevronLeftSmallIcon
-    case IconName.ChevronRight:
-      return ChevronRightIcon
-    case IconName.ChevronRightSmall:
-      return ChevronRightSmallIcon
-    case IconName.ChevronUp:
-      return ChevronUpIcon
-    case IconName.ChevronUpSmall:
-      return ChevronUpSmallIcon
-    case IconName.Close:
-      return CloseIcon
-    case IconName.CloseLarge:
-      return CloseLargeIcon
-    case IconName.ConvenienceStore24h:
-      return ConvenienceStore24hIcon
-    case IconName.Cool:
-      return CoolIcon
-    case IconName.Coin:
-      return CoinIcon
-    case IconName.CoffeeAlt:
-      return CoffeeAltIcon
-    case IconName.Concierge:
-      return ConciergeIcon
-    case IconName.CroissantCoffeeEgg:
-      return CroissantCoffeeEggIcon
-    case IconName.Cultural:
-      return CulturalIcon
-    case IconName.CutleryOne:
-      return CutleryOneIcon
-    case IconName.CutleryTwo:
-      return CutleryTwoIcon
-    case IconName.Diamond:
-      return DiamondIcon
-    case IconName.Directions:
-      return DirectionsIcon
-    case IconName.DoorOpen:
-      return DoorOpenIcon
-    case IconName.Dresser:
-      return DresserIcon
-    case IconName.ElectricBike:
-      return ElectricBikeIcon
-    case IconName.ElectricCar:
-      return ElectricCarIcon
-    case IconName.Email:
-      return EmailIcon
-    case IconName.EyeHide:
-      return EyeHideIcon
-    case IconName.EyeShow:
-      return EyeShowIcon
-    case IconName.Fan:
-      return FanIcon
-    case IconName.Facebook:
-      return FacebookIcon
-    case IconName.Fitness:
-      return FitnessIcon
-    case IconName.Footstool:
-      return FootstoolIcon
-    case IconName.Gallery:
-      return GalleryIcon
-    case IconName.Garage:
-      return GarageIcon
-    case IconName.Gift:
-      return GiftIcon
-    case IconName.GiftOpen:
-      return GiftOpenIcon
-    case IconName.Globe:
-      return GlobeIcon
-    case IconName.Golf:
-      return GolfIcon
-    case IconName.Groceries:
-      return GroceriesIcon
-    case IconName.HandKey:
-      return HandKeyIcon
-    case IconName.Hanger:
-      return HangerIcon
-    case IconName.HangerAlt:
-      return HangerAltIcon
-    case IconName.Heat:
-      return HeatIcon
-    case IconName.HotelNight:
-      return HotelNightIcon
-    case IconName.House:
-      return HouseIcon
-    case IconName.Image:
-      return ImageIcon
-    case IconName.InfoCircle:
-      return InfoCircleIcon
-    case IconName.Instagram:
-      return InstagramIcon
-    case IconName.Kayaking:
-      return KayakingIcon
-    case IconName.Kettle:
-      return KettleIcon
-    case IconName.Kids:
-      return KidsIcon
-    case IconName.KidsMocktail:
-      return KidsMocktailIcon
-    case IconName.Lamp:
-      return LampIcon
-    case IconName.LaundryMachine:
-      return LaundryMachineIcon
-    case IconName.Link:
-      return LinkIcon
-    case IconName.LocalBar:
-      return LocalBarIcon
-    case IconName.Location:
-      return LocationIcon
-    case IconName.Lock:
-      return LockIcon
-    case IconName.Map:
-      return MapIcon
-    case IconName.Minus:
-      return MinusIcon
-    case IconName.MagicWand:
-      return MagicWandIcon
-    case IconName.MoneyHand:
-      return MoneyHandIcon
-    case IconName.Museum:
-      return MuseumIcon
-    case IconName.Nature:
-      return NatureIcon
-    case IconName.Nightlife:
-      return NightlifeIcon
-    case IconName.NoSmoking:
-      return NoSmokingIcon
-    case IconName.OpenInNew:
-      return OpenInNewIcon
-    case IconName.OpenInNewSmall:
-      return OpenInNewSmallIcon
-    case IconName.OutdoorFurniture:
-      return OutdoorFurnitureIcon
-    case IconName.Parking:
-      return ParkingIcon
-    case IconName.Person:
-      return PersonIcon
-    case IconName.People2:
-      return People2Icon
-    case IconName.Pets:
-      return PetsIcon
-    case IconName.Phone:
-      return PhoneIcon
-    case IconName.Plus:
-      return PlusIcon
-    case IconName.PlusCircle:
-      return PlusCircleIcon
-    case IconName.PriceTag:
-      return PriceTagIcon
-    case IconName.Restaurant:
-      return RestaurantIcon
-    case IconName.RoomService:
-      return RoomServiceIcon
-    case IconName.Smoking:
-      return SmokingIcon
-    case IconName.Spa:
-      return SpaIcon
-    case IconName.Sauna:
-      return SaunaIcon
-    case IconName.Search:
-      return SearchIcon
-    case IconName.Service:
-      return ServiceIcon
-    case IconName.Shopping:
-      return ShoppingIcon
-    case IconName.Skateboarding:
-      return SkateboardingIcon
-    case IconName.Snowflake:
-      return SnowflakeIcon
-    case IconName.StarFilled:
-      return StarFilledIcon
-    case IconName.Street:
-      return StreetIcon
-    case IconName.Swim:
-      return SwimIcon
-    case IconName.Swipe:
-      return SwipeIcon
-    case IconName.Thermostat:
-      return ThermostatIcon
-    case IconName.Tshirt:
-      return TshirtIcon
-    case IconName.Train:
-      return TrainIcon
-    case IconName.Tripadvisor:
-      return TripAdvisorIcon
-    case IconName.TshirtWash:
-      return TshirtWashIcon
-    case IconName.TvCasting:
-      return TvCastingIcon
-    case IconName.WarningTriangle:
-      return WarningTriangle
-    case IconName.Voucher:
-      return VoucherIcon
-    case IconName.Wifi:
-      return WifiIcon
-    default:
-      return null
-  }
-}
diff --git a/apps/scandic-web/components/Icons/icon.module.css b/apps/scandic-web/components/Icons/icon.module.css
deleted file mode 100644
index ae5bd0875..000000000
--- a/apps/scandic-web/components/Icons/icon.module.css
+++ /dev/null
@@ -1,103 +0,0 @@
-.icon {
-  margin: 0;
-}
-
-.baseIconLowContrast,
-.baseIconLowContrast * {
-  fill: var(--Base-Icon-Low-contrast);
-}
-
-.black,
-.black * {
-  fill: #000;
-}
-
-.burgundy,
-.burgundy * {
-  fill: var(--Scandic-Brand-Burgundy);
-}
-
-.grey80,
-.grey80 * {
-  fill: var(--UI-Grey-80);
-}
-
-.green,
-.green * {
-  fill: var(--Scandic-Green-50);
-}
-
-.pale,
-.pale * {
-  fill: var(--Scandic-Brand-Pale-Peach);
-}
-
-.peach80,
-.peach80 * {
-  fill: var(--Scandic-Peach-80);
-}
-
-.plosa,
-.plosa * {
-  fill: var(--Primary-Light-On-Surface-Accent);
-}
-
-.red,
-.red * {
-  fill: var(--Scandic-Brand-Scandic-Red);
-}
-
-.white,
-.white * {
-  fill: var(--UI-Opacity-White-100);
-}
-
-.uiSemanticSuccess,
-.uiSemanticSuccess * {
-  fill: var(--UI-Semantic-Success);
-}
-
-.uiTextHighContrast,
-.uiTextHighContrast * {
-  fill: var(--UI-Text-High-contrast);
-}
-
-.uiTextMediumContrast,
-.uiTextMediumContrast * {
-  fill: var(--UI-Text-Medium-contrast);
-}
-
-.uiTextPlaceholder,
-.uiTextPlaceholder * {
-  fill: var(--UI-Text-Placeholder);
-}
-
-.blue,
-.blue * {
-  fill: var(--UI-Input-Controls-Fill-Selected);
-}
-
-.baseButtonTertiaryOnFillNormal,
-.baseButtonTertiaryOnFillNormal * {
-  fill: var(--Base-Button-Tertiary-On-Fill-Normal);
-}
-
-.baseButtonTextOnFillNormal,
-.baseButtonTextOnFillNormal * {
-  fill: var(--Base-Button-Text-On-Fill-Normal);
-}
-
-.baseTextHighcontrast,
-.baseTextHighcontrast * {
-  fill: var(--Base-Text-High-contrast);
-}
-
-.disabled,
-.disabled * {
-  fill: var(--Base-Text-Disabled);
-}
-
-.currentColor,
-.currentColor * {
-  fill: currentColor;
-}
diff --git a/apps/scandic-web/types/components/icon.ts b/apps/scandic-web/components/Icons/iconName.ts
similarity index 64%
rename from apps/scandic-web/types/components/icon.ts
rename to apps/scandic-web/components/Icons/iconName.ts
index abb426852..b3c4ef7cd 100644
--- a/apps/scandic-web/types/components/icon.ts
+++ b/apps/scandic-web/components/Icons/iconName.ts
@@ -1,26 +1,31 @@
-import type { VariantProps } from "class-variance-authority"
-
-import type { iconVariants } from "@/components/Icons/variants"
-
-export interface IconProps
-  extends Omit<React.SVGAttributes<HTMLOrSVGElement>, "color">,
-    VariantProps<typeof iconVariants> {}
-
 export enum IconName {
   Accesories = "Accesories",
   Accessibility = "Accessibility",
   AccountCircle = "AccountCircle",
   Air = "Air",
+  AirConAirCooling = "AirConAirCooling",
+  AirConditioningInRoom = "AirConditioningInRoom",
   Airplane = "Airplane",
+  ArmChair = "ArmChair",
+  ArrowLeft = "ArrowLeft",
+  ArrowLeftSmall = "ArrowLeftSmall",
   ArrowFrom = "ArrowFrom",
   ArrowRight = "ArrowRight",
+  ArrowRightSmall = "ArrowRightSmall",
   ArrowTo = "ArrowTo",
   Bar = "Bar",
+  BathroomCabinet = "BathroomCabinet",
+  Beach = "Beach",
+  BeautySalon = "BeautySalon",
   Bed = "Bed",
-  Biking = "Biking",
+  Bike = "Bike",
+  Bouquet = "Bouquet",
+  Bowling = "Bowling",
   Business = "Business",
+  BusinessCentre = "BusinessCentre",
   Calendar = "Calendar",
   Camera = "Camera",
+  CashFree = "CashFree",
   Cellphone = "Cellphone",
   Check = "Check",
   CheckCircle = "CheckCircle",
@@ -32,99 +37,139 @@ export enum IconName {
   ChevronRightSmall = "ChevronRightSmall",
   ChevronUp = "ChevronUp",
   ChevronUpSmall = "ChevronUpSmall",
+  Chips = "Chips",
+  City = "City",
   Close = "Close",
   CloseLarge = "CloseLarge",
   CoffeeAlt = "CoffeeAlt",
+  CoffeeInReceptionAtCharge = "CoffeeInReceptionAtCharge",
+  CoffeeShop = "CoffeeShop",
   Coin = "Coin",
+  ComplimentaryColdRefreshments = "ComplimentaryColdRefreshments",
   Concierge = "Concierge",
+  ConferenceRoom = "ConferenceRoom",
   ConvenienceStore24h = "ConvenienceStore24h",
-  Cool = "Cool",
+  ConventionCentre = "ConventionCentre",
   CroissantCoffeeEgg = "CroissantCoffeeEgg",
   CrossCircle = "CrossCircle",
   CrossCircleOutline = "CrossCircleOutline",
   Cultural = "Cultural",
   CutleryOne = "CutleryOne",
   CutleryTwo = "CutleryTwo",
+  Deck = "Deck",
+  Desk = "Desk",
   Diamond = "Diamond",
+  Dining = "Dining",
+  DirectDial = "DirectDial",
   Directions = "Directions",
   DoorOpen = "DoorOpen",
   Dresser = "Dresser",
   ElectricBike = "ElectricBike",
   ElectricCar = "ElectricCar",
+  Elevator = "Elevator",
   Email = "Email",
   ExternalLink = "ExternalLink",
+  ExtraFamilyFriendly = "ExtraFamilyFriendly",
   EyeHide = "EyeHide",
   EyeShow = "EyeShow",
   Facebook = "Facebook",
   Fan = "Fan",
+  Fax = "Fax",
   Fitness = "Fitness",
+  FoodDrinks247 = "FoodDrinks247",
   Footstool = "Footstool",
   Gallery = "Gallery",
+  Gaming = "Gaming",
   Garage = "Garage",
   Gift = "Gift",
   GiftOpen = "GiftOpen",
   Globe = "Globe",
   Golf = "Golf",
-  Groceries = "Groceries",
+  Guard = "Guard",
+  Hairdresser = "Hairdresser",
+  HairdryerInRoomAllScandic = "HairdryerInRoomAllScandic",
+  HandKey = "HandKey",
   Hanger = "Hanger",
   HangerAlt = "HangerAlt",
-  HandKey = "HandKey",
-  KidsMocktail = "KidsMocktail",
   Heat = "Heat",
-  House = "House",
+  Hiking = "Hiking",
   HotelNight = "HotelNight",
+  House = "House",
+  IceMachine = "IceMachine",
   Image = "Image",
   InfoCircle = "InfoCircle",
   Instagram = "Instagram",
+  Ironing = "Ironing",
+  Jacuzzi = "Jaccuzzi",
   Kayaking = "Kayaking",
   Kettle = "Kettle",
   Kids = "Kids",
+  KidsMocktail = "KidsMocktail",
   Lamp = "Lamp",
+  LaptopSafe = "LaptopSafe",
   LaundryMachine = "LaundryMachine",
   Link = "Link",
   LocalBar = "LocalBar",
   Location = "Location",
   Lock = "Lock",
+  Breakfast = "Breakfast",
+  Luggage = "Luggage",
+  LuggageLockers = "LuggageLockers",
   MagicWand = "MagicWand",
   Map = "Map",
+  Massage = "Massage",
+  Minibar = "Minibar",
   Minus = "Minus",
   MoneyHand = "MoneyHand",
   Museum = "Museum",
   Nature = "Nature",
   Nightlife = "Nightlife",
+  NonSmoking = "NonSmoking",
   NoSmoking = "NoSmoking",
   OpenInNew = "OpenInNew",
   OpenInNewSmall = "OpenInNewSmall",
   OutdoorFurniture = "OutdoorFurniture",
+  PalmTree = "Palmtree",
   Parking = "Parking",
-  People2 = "People2",
+  ParkingOutdoor = "ParkingOutdoor",
   Person = "Person",
   Pets = "Pets",
   Phone = "Phone",
   Plus = "Plus",
   PlusCircle = "PlusCircle",
+  Popcorn = "Popcorn",
   PriceTag = "PriceTag",
+  RecordPlayer = "RecordPlayer",
   Restaurant = "Restaurant",
   RoomService = "RoomService",
+  SafetyBox = "SafetyBox",
   Sauna = "Sauna",
   Search = "Search",
   Service = "Service",
   Shopping = "Shopping",
   Skateboarding = "Skateboarding",
+  Skiing = "Skiing",
   Smoking = "Smoking",
   Snowflake = "Snowflake",
   Spa = "Spa",
+  Sports = "Sports",
+  Star = "Star",
   StarFilled = "StarFilled",
   Street = "Street",
   Swim = "Swim",
+  Theatre = "Theatre",
   Swipe = "Swipe",
   Thermostat = "Thermostat",
+  Toilet = "Toilet",
   Train = "Train",
   Tripadvisor = "Tripadvisor",
   Tshirt = "Tshirt",
   TshirtWash = "TshirtWash",
   TvCasting = "TvCasting",
+  TVRemote = "TVRemote",
   Voucher = "Voucher",
   WarningTriangle = "WarningTriangle",
+  Wheelchair = "Wheelchair",
   Wifi = "Wifi",
+  Kitchen = "Kitchen",
 }
diff --git a/apps/scandic-web/components/Icons/index.tsx b/apps/scandic-web/components/Icons/index.tsx
deleted file mode 100644
index 1c919f2c6..000000000
--- a/apps/scandic-web/components/Icons/index.tsx
+++ /dev/null
@@ -1,191 +0,0 @@
-export { default as AcIcon } from "./Ac"
-export { default as AccesoriesIcon } from "./Accesories"
-export { default as AccessibilityIcon } from "./Accessibility"
-export { default as AccountCircleIcon } from "./AccountCircle"
-export { default as AirIcon } from "./Air"
-export { default as AirplaneIcon } from "./Airplane"
-export { default as AllergyIcon } from "./Allergy"
-export { default as ArrowFromIcon } from "./ArrowFrom"
-export { default as ArrowRightIcon } from "./ArrowRight"
-export { default as ArrowToIcon } from "./ArrowTo"
-export { default as ArrowUpIcon } from "./ArrowUp"
-export { default as BalconyIcon } from "./Balcony"
-export { default as BarIcon } from "./Bar"
-export { default as BathtubIcon } from "./Bathtub"
-export { default as BedHotelIcon } from "./BedHotel"
-export { default as BedroomParentIcon } from "./BedroomParent"
-export { default as BedIcon } from "./Beds/Bed"
-export { default as BedDoubleIcon } from "./Beds/BedDouble"
-export { default as BedSingleIcon } from "./Beds/BedSingle"
-export { default as ExtraBunkBedIcon } from "./Beds/ExtraBunkBed"
-export { default as ExtraPullOutBedIcon } from "./Beds/ExtraPullOutBed"
-export { default as ExtraSofaBedIcon } from "./Beds/ExtraSofaBed"
-export { default as ExtraWallBedIcon } from "./Beds/ExtraWallBed"
-export { default as KingBedIcon } from "./Beds/KingBed"
-export { default as KingBedSmallIcon } from "./Beds/KingBedSmall"
-export { default as QueenBedIcon } from "./Beds/QueenBed"
-export { default as SingleBedIcon } from "./Beds/SingleBed"
-export { default as TwinBedsIcon } from "./Beds/TwinBeds"
-export { default as BikeIcon } from "./Bike"
-export { default as BikingIcon } from "./Biking"
-export { default as BookingCodeIcon } from "./BookingCode"
-export { default as BreakfastIcon } from "./Breakfast"
-export { default as BusinessIcon } from "./Business"
-export { default as CableIcon } from "./Cable"
-export { default as CalendarIcon } from "./Calendar"
-export { default as CalendarAddIcon } from "./CalendarAdd"
-export { default as CameraIcon } from "./Camera"
-export { default as CellphoneIcon } from "./Cellphone"
-export { default as ChairIcon } from "./Chair"
-export { default as CheckIcon } from "./Check"
-export { default as CheckCircleIcon } from "./CheckCircle"
-export { default as ChevronDownIcon } from "./ChevronDown"
-export { default as ChevronDownSmallIcon } from "./ChevronDownSmall"
-export { default as ChevronLeftIcon } from "./ChevronLeft"
-export { default as ChevronLeftSmallIcon } from "./ChevronLeftSmall"
-export { default as ChevronRightIcon } from "./ChevronRight"
-export { default as ChevronRightSmallIcon } from "./ChevronRightSmall"
-export { default as ChevronUpIcon } from "./ChevronUp"
-export { default as ChevronUpSmallIcon } from "./ChevronUpSmall"
-export { default as CityIcon } from "./City"
-export { default as CloseIcon } from "./Close"
-export { default as CloseLargeIcon } from "./CloseLarge"
-export { default as CoffeeIcon } from "./Coffee"
-export { default as CoffeeAltIcon } from "./CoffeeAlt"
-export { default as CoffeeMakerIcon } from "./CoffeeMaker"
-export { default as CoinIcon } from "./Coin"
-export { default as CompareArrowsIcon } from "./CompareArrows"
-export { default as ConciergeIcon } from "./Concierge"
-export { default as ContractIcon } from "./Contract"
-export { default as ConvenienceStore24hIcon } from "./ConvenienceStore24h"
-export { default as CoolIcon } from "./Cool"
-export { default as CreditCard } from "./CreditCard"
-export { default as CreditCardAddIcon } from "./CreditCardAdd"
-export { default as CroissantCoffeeEggIcon } from "./CroissantCoffeeEgg"
-export { default as CrossCircle } from "./CrossCircle"
-export { default as CrossCircleOutlineIcon } from "./CrossCircleOutline"
-export { default as CulturalIcon } from "./Cultural"
-export { default as CutleryOneIcon } from "./CutleryOne"
-export { default as CutleryTwoIcon } from "./CutleryTwo"
-export { default as DeleteIcon } from "./Delete"
-export { default as DeskIcon } from "./Desk"
-export { default as DiamondIcon } from "./Diamond"
-export { default as DiningIcon } from "./Dining"
-export { default as DirectionsIcon } from "./Directions"
-export { default as DiscountIcon } from "./Discount"
-export { default as DoorClosedIcon } from "./DoorClosed"
-export { default as DoorOpenIcon } from "./DoorOpen"
-export { default as DownloadIcon } from "./Download"
-export { default as DresserIcon } from "./Dresser"
-export { default as EditIcon } from "./Edit"
-export { default as ElectricBikeIcon } from "./ElectricBike"
-export { default as ElectricCarIcon } from "./ElectricCar"
-export { default as EmailIcon } from "./Email"
-export { default as ErrorCircleIcon } from "./ErrorCircle"
-export { default as ExpandIcon } from "./Expand"
-export { default as EyeHideIcon } from "./EyeHide"
-export { default as EyeShowIcon } from "./EyeShow"
-export { default as FacebookIcon } from "./Facebook"
-export { default as FamilyIcon } from "./Family"
-export { default as FanIcon } from "./Fan"
-export { default as FilterIcon } from "./Filter"
-export { default as FitnessIcon } from "./Fitness"
-export { default as FootstoolIcon } from "./Footstool"
-export { default as GalleryIcon } from "./Gallery"
-export { default as GarageIcon } from "./Garage"
-export { default as GiftIcon } from "./Gift"
-export { default as GiftOpenIcon } from "./GiftOpen"
-export { default as GlobeIcon } from "./Globe"
-export { default as GolfIcon } from "./Golf"
-export { default as GroceriesIcon } from "./Groceries"
-export { default as HairdryerIcon } from "./Hairdryer"
-export { default as HandKeyIcon } from "./HandKey"
-export { default as HandSoapIcon } from "./HandSoap"
-export { default as HangerIcon } from "./Hanger"
-export { default as HangerAltIcon } from "./HangerAlt"
-export { default as HealthBeautyIcon } from "./HealthBeauty"
-export { default as HeartIcon } from "./Heart"
-export { default as HeatIcon } from "./Heat"
-export { default as HotelNightIcon } from "./HotelNight"
-export { default as HouseIcon } from "./House"
-export { default as ImageIcon } from "./Image"
-export { default as InfoCircleIcon } from "./InfoCircle"
-export { default as InstagramIcon } from "./Instagram"
-export { default as IronIcon } from "./Iron"
-export { default as KayakingIcon } from "./Kayaking"
-export { default as KettleIcon } from "./Kettle"
-export { default as KidsIcon } from "./Kids"
-export { default as KidsMocktailIcon } from "./KidsMocktail"
-export { default as LampIcon } from "./Lamp"
-export { default as LaptopIcon } from "./Laptop"
-export { default as LaundryMachineIcon } from "./LaundryMachine"
-export { default as LinkIcon } from "./Link"
-export { default as LocalBarIcon } from "./LocalBar"
-export { default as LocationIcon } from "./Location"
-export { default as LockIcon } from "./Lock"
-export { default as DowntownCamperIcon } from "./Logos/DowntownCamper"
-export { default as GrandHotelOsloLogoIcon } from "./Logos/GrandHotelOslo"
-export { default as HaymarketIcon } from "./Logos/Haymarket"
-export { default as HotelNorgeIcon } from "./Logos/HotelNorge"
-export { default as MarskiLogoIcon } from "./Logos/Marski"
-export { default as ScandicGoLogoIcon } from "./Logos/ScandicGoLogo"
-export { default as ScandicLogoIcon } from "./Logos/ScandicLogo"
-export { default as LuggageIcon } from "./Luggage"
-export { default as MagicWandIcon } from "./MagicWand"
-export { default as MapIcon } from "./Map"
-export { default as MeasureIcon } from "./Measure"
-export { default as MicrowaveIcon } from "./Microwave"
-export { default as MinusIcon } from "./Minus"
-export { default as MirrorIcon } from "./Mirror"
-export { default as MoneyHandIcon } from "./MoneyHand"
-export { default as MuseumIcon } from "./Museum"
-export { default as NatureIcon } from "./Nature"
-export { default as NightlifeIcon } from "./Nightlife"
-export { default as NoBreakfastIcon } from "./NoBreakfast"
-export { default as NoSmokingIcon } from "./NoSmoking"
-export { default as OpenInNewIcon } from "./OpenInNew"
-export { default as OpenInNewSmallIcon } from "./OpenInNewSmall"
-export { default as OutdoorFurnitureIcon } from "./OutdoorFurniture"
-export { default as ParkingIcon } from "./Parking"
-export { default as People2Icon } from "./People2"
-export { default as PersonIcon } from "./Person"
-export { default as PetsIcon } from "./Pets"
-export { default as PhoneIcon } from "./Phone"
-export { default as PlusIcon } from "./Plus"
-export { default as PlusCircleIcon } from "./PlusCircle"
-export { default as PriceTagIcon } from "./PriceTag"
-export { default as PrinterIcon } from "./Printer"
-export { default as RestaurantIcon } from "./Restaurant"
-export { default as RoomServiceIcon } from "./RoomService"
-export { default as SafetyBoxIcon } from "./SafetyBox"
-export { default as SaunaIcon } from "./Sauna"
-export { default as SearchIcon } from "./Search"
-export { default as ServiceIcon } from "./Service"
-export { default as ShoppingIcon } from "./Shopping"
-export { default as ShowerIcon } from "./Shower"
-export { default as SkateboardingIcon } from "./Skateboarding"
-export { default as SmokingIcon } from "./Smoking"
-export { default as SnowflakeIcon } from "./Snowflake"
-export { default as SpaIcon } from "./Spa"
-export { default as SpeakerIcon } from "./Speaker"
-export { default as StarFilledIcon } from "./StarFilled"
-export { default as StoreIcon } from "./Store"
-export { default as StreetIcon } from "./Street"
-export { default as SurpriseIcon } from "./Surprise"
-export { default as SwimIcon } from "./Swim"
-export { default as SwipeIcon } from "./Swipe"
-export { default as ThermostatIcon } from "./Thermostat"
-export { default as TrainIcon } from "./Train"
-export { default as TripAdvisorIcon } from "./TripAdvisor"
-export { default as TshirtIcon } from "./Tshirt"
-export { default as TshirtWashIcon } from "./TshirtWash"
-export { default as TvCastingIcon } from "./TvCasting"
-export { default as VoucherIcon } from "./Voucher"
-export { default as WarningTriangle } from "./WarningTriangle"
-export { default as WheelchairIcon } from "./Wheelchair"
-export { default as WifiIcon } from "./Wifi"
-export { default as WindowCurtainsAltIcon } from "./WindowCurtainsAlt"
-export { default as WindowNotAvailableIcon } from "./WindowNotAvailable"
-export { default as WineBarIcon } from "./WineBar"
-export { default as WoodFloorIcon } from "./WoodFloor"
-export { default as YardIcon } from "./Yard"
diff --git a/apps/scandic-web/components/Icons/variants.ts b/apps/scandic-web/components/Icons/variants.ts
deleted file mode 100644
index 97a55ea5e..000000000
--- a/apps/scandic-web/components/Icons/variants.ts
+++ /dev/null
@@ -1,35 +0,0 @@
-import { cva } from "class-variance-authority"
-
-import styles from "./icon.module.css"
-
-const config = {
-  variants: {
-    color: {
-      baseButtonTertiaryOnFillNormal: styles.baseButtonTertiaryOnFillNormal,
-      baseButtonTextOnFillNormal: styles.baseButtonTextOnFillNormal,
-      baseIconLowContrast: styles.baseIconLowContrast,
-      baseTextHighcontrast: styles.baseTextHighcontrast,
-      black: styles.black,
-      blue: styles.blue,
-      burgundy: styles.burgundy,
-      green: styles.green,
-      grey80: styles.grey80,
-      pale: styles.pale,
-      peach80: styles.peach80,
-      primaryLightOnSurfaceAccent: styles.plosa,
-      red: styles.red,
-      white: styles.white,
-      uiSemanticSuccess: styles.uiSemanticSuccess,
-      uiTextHighContrast: styles.uiTextHighContrast,
-      uiTextMediumContrast: styles.uiTextMediumContrast,
-      uiTextPlaceholder: styles.uiTextPlaceholder,
-      disabled: styles.disabled,
-      currentColor: styles.currentColor,
-    },
-  },
-  defaultVariants: {
-    color: "black",
-  },
-} as const
-
-export const iconVariants = cva(styles.icon, config)
diff --git a/apps/scandic-web/components/ImageGallery/index.tsx b/apps/scandic-web/components/ImageGallery/index.tsx
index 150edfe59..edd607c1d 100644
--- a/apps/scandic-web/components/ImageGallery/index.tsx
+++ b/apps/scandic-web/components/ImageGallery/index.tsx
@@ -3,7 +3,8 @@
 import { memo, useState } from "react"
 import { useIntl } from "react-intl"
 
-import { GalleryIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Lightbox from "@/components/Lightbox"
 
@@ -48,7 +49,7 @@ function ImageGallery({
           {...imageProps}
         />
         <div className={styles.imageCount}>
-          <GalleryIcon color="white" />
+          <MaterialIcon icon="filter" color="Icon/Inverted" />
           <Caption color="white" type="label">
             {images.length}
           </Caption>
diff --git a/apps/scandic-web/components/JsonToHtml/renderOptions.tsx b/apps/scandic-web/components/JsonToHtml/renderOptions.tsx
index 315c37e4e..3b14155bc 100644
--- a/apps/scandic-web/components/JsonToHtml/renderOptions.tsx
+++ b/apps/scandic-web/components/JsonToHtml/renderOptions.tsx
@@ -1,8 +1,9 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Link from "@/components/TempDesignSystem/Link"
 import { insertResponseToImageVaultAsset } from "@/utils/imageVault"
 
-import { OpenInNewSmallIcon } from "../Icons"
 import ImageContainer from "../ImageContainer"
 import Divider from "../TempDesignSystem/Divider"
 import Table from "../TempDesignSystem/Table"
@@ -384,7 +385,11 @@ export const renderOptions: RenderOptions = {
                 embeds,
                 fullRenderOptions
               )}
-              <OpenInNewSmallIcon color="burgundy" />
+              <MaterialIcon
+                icon="open_in_new"
+                size={20}
+                color="Icon/Interactive/Default"
+              />
             </Link>
           )
         }
diff --git a/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContainer/index.tsx b/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContainer/index.tsx
index c733e3d4c..c27de5a2d 100644
--- a/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContainer/index.tsx
+++ b/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContainer/index.tsx
@@ -1,8 +1,9 @@
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useDropdownStore from "@/stores/main-menu"
 
-import { ChevronLeftIcon } from "@/components/Icons"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 
 import styles from "./languageSwitcherContainer.module.css"
@@ -34,7 +35,11 @@ export default function LanguageSwitcherContainer({
             className={styles.backButton}
             onClick={() => toggleDropdown(position)}
           >
-            <ChevronLeftIcon color="red" height={20} width={20} />
+            <MaterialIcon
+              icon="chevron_left"
+              color="Icon/Interactive/Accent"
+              size={20}
+            />
             <Subtitle type="one" asChild>
               <span>
                 {intl.formatMessage({
diff --git a/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContent/index.tsx b/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContent/index.tsx
index d4f0ce676..b85cb0724 100644
--- a/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContent/index.tsx
+++ b/apps/scandic-web/components/LanguageSwitcher/LanguageSwitcherContent/index.tsx
@@ -3,9 +3,10 @@
 import { usePathname } from "next/navigation"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { type Lang, languages } from "@/constants/languages"
 
-import { CheckIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import useLang from "@/hooks/useLang"
@@ -46,7 +47,12 @@ export default function LanguageSwitcherContent({
                   keepSearchParams
                 >
                   {languages[key]}
-                  {isActive ? <CheckIcon color="burgundy" /> : null}
+                  {isActive ? (
+                    <MaterialIcon
+                      icon="check"
+                      color="Icon/Interactive/Default"
+                    />
+                  ) : null}
                 </Link>
               </li>
             )
diff --git a/apps/scandic-web/components/LanguageSwitcher/index.tsx b/apps/scandic-web/components/LanguageSwitcher/index.tsx
index 089a53ee1..13eac0dd4 100644
--- a/apps/scandic-web/components/LanguageSwitcher/index.tsx
+++ b/apps/scandic-web/components/LanguageSwitcher/index.tsx
@@ -5,11 +5,12 @@ import { useRef } from "react"
 import FocusLock from "react-focus-lock"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { languages } from "@/constants/languages"
 import { trpc } from "@/lib/trpc/client"
 import useDropdownStore from "@/stores/main-menu"
 
-import { ChevronDownSmallIcon, GlobeIcon } from "@/components/Icons"
 import useClickOutside from "@/hooks/useClickOutside"
 import { useHandleKeyUp } from "@/hooks/useHandleKeyUp"
 import useLang from "@/hooks/useLang"
@@ -105,14 +106,14 @@ export default function LanguageSwitcher({ type }: LanguageSwitcherProps) {
         aria-label={isLanguageSwitcherOpen ? closeMsg : openMsg}
         onClick={handleClick}
       >
-        <GlobeIcon width={globeIconSize} height={globeIconSize} />
+        <MaterialIcon icon="globe" size={globeIconSize} />
         <Caption className={styles.buttonText} type="regular" asChild>
           <span>{languages[currentLanguage]}</span>
         </Caption>
-        <ChevronDownSmallIcon
+        <MaterialIcon
+          icon="keyboard_arrow_down"
           className={`${styles.chevron} ${isLanguageSwitcherOpen ? styles.isExpanded : ""}`}
-          width={20}
-          height={20}
+          size={20}
         />
       </button>
 
diff --git a/apps/scandic-web/components/Lightbox/FullView.tsx b/apps/scandic-web/components/Lightbox/FullView.tsx
index 7d6d293f9..cf14c7356 100644
--- a/apps/scandic-web/components/Lightbox/FullView.tsx
+++ b/apps/scandic-web/components/Lightbox/FullView.tsx
@@ -3,8 +3,8 @@
 import { AnimatePresence, motion } from "framer-motion"
 import { useState } from "react"
 
-import ArrowRightIcon from "@/components/Icons/ArrowRight"
-import CloseIcon from "@/components/Icons/Close"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Button from "@/components/TempDesignSystem/Button"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -61,11 +61,11 @@ export default function FullView({
         className={styles.fullViewCloseButton}
         onClick={onClose}
       >
-        <CloseIcon
-          width={32}
-          height={32}
+        <MaterialIcon
+          icon="close"
+          size={32}
           className={styles.fullViewCloseIcon}
-          color="white"
+          color="Icon/Inverted"
         />
       </Button>
       <div className={styles.fullViewHeader}>
@@ -110,13 +110,17 @@ export default function FullView({
         className={`${styles.navigationButton} ${styles.fullViewPrevButton}`}
         onClick={handlePrev}
       >
-        <ArrowRightIcon color="burgundy" className={styles.leftTransformIcon} />
+        <MaterialIcon
+          icon="arrow_forward"
+          color="Icon/Interactive/Default"
+          className={styles.leftTransformIcon}
+        />
       </motion.button>
       <motion.button
         className={`${styles.navigationButton} ${styles.fullViewNextButton}`}
         onClick={handleNext}
       >
-        <ArrowRightIcon color="burgundy" />
+        <MaterialIcon icon="arrow_forward" color="Icon/Interactive/Default" />
       </motion.button>
     </div>
   )
diff --git a/apps/scandic-web/components/Lightbox/Gallery.tsx b/apps/scandic-web/components/Lightbox/Gallery.tsx
index e0c134596..7a95b6198 100644
--- a/apps/scandic-web/components/Lightbox/Gallery.tsx
+++ b/apps/scandic-web/components/Lightbox/Gallery.tsx
@@ -3,9 +3,8 @@ import { AnimatePresence, motion } from "framer-motion"
 import { useState } from "react"
 import { useIntl } from "react-intl"
 
-import { ChevronLeftIcon } from "@/components/Icons"
-import ArrowRightIcon from "@/components/Icons/ArrowRight"
-import CloseIcon from "@/components/Icons/Close"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Button from "@/components/TempDesignSystem/Button"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -69,13 +68,17 @@ export default function Gallery({
         onClick={onClose}
         aria-label={intl.formatMessage({ id: "Close" })}
       >
-        <ChevronLeftIcon
-          color="black"
-          width={32}
-          height={32}
+        <MaterialIcon
+          icon="chevron_left"
+          color="Icon/Intense"
+          size={32}
           className={styles.mobileCloseIcon}
         />
-        <CloseIcon width={32} height={32} className={styles.desktopCloseIcon} />
+        <MaterialIcon
+          icon="close"
+          size={32}
+          className={styles.desktopCloseIcon}
+        />
       </Button>
       {/* Desktop Gallery */}
       <div className={styles.desktopGallery}>
@@ -112,8 +115,9 @@ export default function Gallery({
             className={`${styles.navigationButton} ${styles.galleryPrevButton}`}
             onClick={handlePrev}
           >
-            <ArrowRightIcon
-              color="burgundy"
+            <MaterialIcon
+              icon="arrow_forward"
+              color="Icon/Interactive/Default"
               className={styles.leftTransformIcon}
             />
           </motion.button>
@@ -121,7 +125,10 @@ export default function Gallery({
             className={`${styles.navigationButton} ${styles.galleryNextButton}`}
             onClick={handleNext}
           >
-            <ArrowRightIcon color="burgundy" />
+            <MaterialIcon
+              icon="arrow_forward"
+              color="Icon/Interactive/Default"
+            />
           </motion.button>
         </div>
         <div className={styles.desktopThumbnailGrid}>
diff --git a/apps/scandic-web/components/Maps/InteractiveMap/index.tsx b/apps/scandic-web/components/Maps/InteractiveMap/index.tsx
index 861961e4a..8e4bd2a45 100644
--- a/apps/scandic-web/components/Maps/InteractiveMap/index.tsx
+++ b/apps/scandic-web/components/Maps/InteractiveMap/index.tsx
@@ -2,7 +2,8 @@
 import { Map, type MapProps, useMap } from "@vis.gl/react-google-maps"
 import { useIntl } from "react-intl"
 
-import { MinusIcon, PlusIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 
 import HotelListingMapContent from "./HotelListingMapContent"
@@ -71,7 +72,7 @@ export default function InteractiveMap({
             onClick={zoomOut}
             aria-label={intl.formatMessage({ id: "Zoom in" })}
           >
-            <MinusIcon color="burgundy" width={20} height={20} />
+            <MaterialIcon icon="remove" color="CurrentColor" size={20} />
           </Button>
           <Button
             theme="base"
@@ -82,7 +83,7 @@ export default function InteractiveMap({
             onClick={zoomIn}
             aria-label={intl.formatMessage({ id: "Zoom out" })}
           >
-            <PlusIcon color="burgundy" width={20} height={20} />
+            <MaterialIcon icon="add" color="CurrentColor" size={20} />
           </Button>
         </div>
       </div>
diff --git a/apps/scandic-web/components/Maps/Markers/Poi/index.tsx b/apps/scandic-web/components/Maps/Markers/Poi/index.tsx
index 9fa3d9e47..214a399e1 100644
--- a/apps/scandic-web/components/Maps/Markers/Poi/index.tsx
+++ b/apps/scandic-web/components/Maps/Markers/Poi/index.tsx
@@ -1,4 +1,4 @@
-import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
+import { IconByIconName } from "@/components/Icons/IconByIconName"
 
 import { getIconByPoiGroupAndCategory } from "../utils"
 import { poiVariants } from "./variants"
@@ -13,15 +13,14 @@ export default function PoiMarker({
   className = "",
 }: PoiMarkerProps) {
   const iconName = getIconByPoiGroupAndCategory(group, categoryName)
-  const Icon = iconName ? getIconByIconName(iconName) : null
   const classNames = poiVariants({ group, skipBackground, className })
 
-  return Icon ? (
+  return iconName ? (
     <span className={classNames}>
-      <Icon
-        color={skipBackground ? "grey80" : "white"}
-        width={size}
-        height={size}
+      <IconByIconName
+        iconName={iconName}
+        color={skipBackground ? "Icon/Feedback/Neutral" : "Icon/Inverted"}
+        size={size}
       />
     </span>
   ) : null
diff --git a/apps/scandic-web/components/Maps/Markers/utils.ts b/apps/scandic-web/components/Maps/Markers/utils.ts
index ba98430eb..2aa3c31e2 100644
--- a/apps/scandic-web/components/Maps/Markers/utils.ts
+++ b/apps/scandic-web/components/Maps/Markers/utils.ts
@@ -1,4 +1,5 @@
-import { IconName } from "@/types/components/icon"
+import { IconName } from "@/components/Icons/iconName"
+
 import { PointOfInterestGroupEnum } from "@/types/enums/pointOfInterest"
 
 export function getIconByPoiGroupAndCategory(
diff --git a/apps/scandic-web/components/Modal/ModalContentWithActions/index.tsx b/apps/scandic-web/components/Modal/ModalContentWithActions/index.tsx
index e5a03f4fe..b6d0ebfd0 100644
--- a/apps/scandic-web/components/Modal/ModalContentWithActions/index.tsx
+++ b/apps/scandic-web/components/Modal/ModalContentWithActions/index.tsx
@@ -1,4 +1,5 @@
-import { CloseLargeIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 
@@ -37,7 +38,7 @@ export function ModalContentWithActions({
         <header className={styles.header}>
           <Subtitle>{title}</Subtitle>
           <button onClick={onClose} type="button" className={styles.close}>
-            <CloseLargeIcon color="uiTextMediumContrast" />
+            <MaterialIcon icon="close" color="Icon/Interactive/Placeholder" />
           </button>
         </header>
       )}
diff --git a/apps/scandic-web/components/Modal/index.tsx b/apps/scandic-web/components/Modal/index.tsx
index 067c2bc1d..67096460f 100644
--- a/apps/scandic-web/components/Modal/index.tsx
+++ b/apps/scandic-web/components/Modal/index.tsx
@@ -10,7 +10,8 @@ import {
 } from "react-aria-components"
 import { useIntl } from "react-intl"
 
-import { CloseLargeIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Preamble from "@/components/TempDesignSystem/Text/Preamble"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 
@@ -108,7 +109,7 @@ function InnerModal({
                     type="button"
                     className={styles.close}
                   >
-                    <CloseLargeIcon color="uiTextMediumContrast" />
+                    <MaterialIcon icon="close" color="Icon/Feedback/Neutral" />
                   </button>
                 </header>
               )}
diff --git a/apps/scandic-web/components/MyPages/Pagination/index.tsx b/apps/scandic-web/components/MyPages/Pagination/index.tsx
index 31303ef64..3da5f74c5 100644
--- a/apps/scandic-web/components/MyPages/Pagination/index.tsx
+++ b/apps/scandic-web/components/MyPages/Pagination/index.tsx
@@ -1,4 +1,4 @@
-import { ChevronRightIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import styles from "./pagination.module.css"
 
@@ -41,10 +41,10 @@ export default function Pagination({
           handlePageChange(currentPage - 1)
         }}
       >
-        <ChevronRightIcon
+        <MaterialIcon
+          icon="chevron_left"
+          size={20}
           className={styles.chevronLeft}
-          height={20}
-          width={20}
         />
       </PaginationButton>
       {[...Array(pageCount)].map((_, idx) => (
@@ -65,7 +65,7 @@ export default function Pagination({
           handlePageChange(currentPage + 1)
         }}
       >
-        <ChevronRightIcon height={20} width={20} />
+        <MaterialIcon icon="chevron_right" size={20} />
       </PaginationButton>
     </div>
   )
diff --git a/apps/scandic-web/components/MyPages/Pagination/pagination.module.css b/apps/scandic-web/components/MyPages/Pagination/pagination.module.css
index 4b17d7b9c..01ae6928c 100644
--- a/apps/scandic-web/components/MyPages/Pagination/pagination.module.css
+++ b/apps/scandic-web/components/MyPages/Pagination/pagination.module.css
@@ -29,7 +29,6 @@
   cursor: not-allowed;
 }
 .chevronLeft {
-  transform: rotate(180deg);
   height: 100%;
 }
 
diff --git a/apps/scandic-web/components/MyPages/Surprises/Header.tsx b/apps/scandic-web/components/MyPages/Surprises/Header.tsx
index 3a25400a9..10869f26a 100644
--- a/apps/scandic-web/components/MyPages/Surprises/Header.tsx
+++ b/apps/scandic-web/components/MyPages/Surprises/Header.tsx
@@ -1,4 +1,4 @@
-import { CloseLargeIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import styles from "./surprises.module.css"
 
@@ -9,7 +9,7 @@ export default function Header({ onClose, children }: HeaderProps) {
     <div className={styles.top}>
       {children}
       <button onClick={onClose} type="button" className={styles.close}>
-        <CloseLargeIcon />
+        <MaterialIcon icon="close" />
       </button>
     </div>
   )
diff --git a/apps/scandic-web/components/MyPages/Surprises/Navigation.tsx b/apps/scandic-web/components/MyPages/Surprises/Navigation.tsx
index 2a1296f01..1c0afe353 100644
--- a/apps/scandic-web/components/MyPages/Surprises/Navigation.tsx
+++ b/apps/scandic-web/components/MyPages/Surprises/Navigation.tsx
@@ -1,6 +1,7 @@
 import { useIntl } from "react-intl"
 
-import { ChevronRightSmallIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 
 import styles from "./surprises.module.css"
@@ -23,10 +24,11 @@ export default function Navigation({
         onPress={() => showSurprise(-1)}
         size="small"
       >
-        <ChevronRightSmallIcon
+        <MaterialIcon
+          icon="chevron_right"
+          color="CurrentColor"
+          size={20}
           className={styles.chevron}
-          width={20}
-          height={20}
         />
         {intl.formatMessage({ id: "Previous" })}
       </Button>
@@ -38,7 +40,7 @@ export default function Navigation({
         size="small"
       >
         {intl.formatMessage({ id: "Next" })}
-        <ChevronRightSmallIcon width={20} height={20} />
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
       </Button>
     </nav>
   )
diff --git a/apps/scandic-web/components/MyPages/myprofile/membershipCards/membershipcards.tsx b/apps/scandic-web/components/MyPages/myprofile/membershipCards/membershipcards.tsx
index 269616ae2..28191f491 100644
--- a/apps/scandic-web/components/MyPages/myprofile/membershipCards/membershipcards.tsx
+++ b/apps/scandic-web/components/MyPages/myprofile/membershipCards/membershipcards.tsx
@@ -1,6 +1,7 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { getMembershipCards } from "@/lib/trpc/memoizedRequests"
 
-import { PlusCircleIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -64,7 +65,7 @@ export default async function MembershipCardSlot() {
           </div>
         ))}
       <Link href="#" variant="icon">
-        <PlusCircleIcon color="burgundy" />
+        <MaterialIcon icon="add_circle" color="CurrentColor" />
         <Body color="burgundy" textTransform="underlined">
           {intl.formatMessage({ id: "Add new card" })}
         </Body>
diff --git a/apps/scandic-web/components/MyPages/myprofile/profile/profile.tsx b/apps/scandic-web/components/MyPages/myprofile/profile/profile.tsx
index 8c2f611e3..0f2353612 100644
--- a/apps/scandic-web/components/MyPages/myprofile/profile/profile.tsx
+++ b/apps/scandic-web/components/MyPages/myprofile/profile/profile.tsx
@@ -1,16 +1,10 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { countriesMap } from "@/constants/countries"
 import { Lang, languages } from "@/constants/languages"
 import { profileEdit } from "@/constants/routes/myPages"
 import { getProfile } from "@/lib/trpc/memoizedRequests"
 
-import {
-  CalendarIcon,
-  EmailIcon,
-  GlobeIcon,
-  LocationIcon,
-  LockIcon,
-  PhoneIcon,
-} from "@/components/Icons"
 import CommunicationSlot from "@/components/MyPages/myprofile/communication/communication"
 import CreditCardSlot from "@/components/MyPages/myprofile/creditCards/creditCards"
 import Header from "@/components/Profile/Header"
@@ -96,42 +90,48 @@ export default async function Profile() {
         <div className={styles.profile}>
           <div className={styles.info}>
             <div className={styles.item}>
-              <CalendarIcon color="burgundy" />
+              <MaterialIcon
+                icon="calendar_month"
+                color="Icon/Interactive/Default"
+              />
               <Body color="burgundy" textTransform="bold">
                 {intl.formatMessage({ id: "Date of Birth" })}
               </Body>
               <Body color="burgundy">{user.dateOfBirth}</Body>
             </div>
             <div className={styles.item}>
-              <PhoneIcon color="burgundy" />
+              <MaterialIcon icon="phone" color="Icon/Interactive/Default" />
               <Body color="burgundy" textTransform="bold">
                 {intl.formatMessage({ id: "Phone number" })}
               </Body>
               <Body color="burgundy">{user.phoneNumber}</Body>
             </div>
             <div className={styles.item}>
-              <GlobeIcon color="burgundy" />
+              <MaterialIcon icon="globe" color="Icon/Interactive/Default" />
               <Body color="burgundy" textTransform="bold">
                 {intl.formatMessage({ id: "Language" })}
               </Body>
               <Body color="burgundy">{normalizedLanguage}</Body>
             </div>
             <div className={styles.item}>
-              <EmailIcon color="burgundy" />
+              <MaterialIcon icon="mail" color="Icon/Interactive/Default" />
               <Body color="burgundy" textTransform="bold">
                 {intl.formatMessage({ id: "Email" })}
               </Body>
               <Body color="burgundy">{user.email}</Body>
             </div>
             <div className={styles.item}>
-              <LocationIcon color="burgundy" />
+              <MaterialIcon
+                icon="location_on"
+                color="Icon/Interactive/Default"
+              />
               <Body color="burgundy" textTransform="bold">
                 {intl.formatMessage({ id: "Address" })}
               </Body>
               <Body color="burgundy">{addressOutput}</Body>
             </div>
             <div className={styles.item}>
-              <LockIcon color="burgundy" />
+              <MaterialIcon icon="lock" color="Icon/Interactive/Default" />
               <Body color="burgundy" textTransform="bold">
                 {intl.formatMessage({ id: "Password" })}
               </Body>
diff --git a/apps/scandic-web/components/ParkingInformation/index.tsx b/apps/scandic-web/components/ParkingInformation/index.tsx
index edb4fb71b..2c118b56f 100644
--- a/apps/scandic-web/components/ParkingInformation/index.tsx
+++ b/apps/scandic-web/components/ParkingInformation/index.tsx
@@ -1,8 +1,9 @@
 import Link from "next/link"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { getIntl } from "@/i18n"
 
-import { OpenInNewIcon } from "../Icons"
 import Button from "../TempDesignSystem/Button"
 import Divider from "../TempDesignSystem/Divider"
 import Caption from "../TempDesignSystem/Text/Caption"
@@ -73,7 +74,7 @@ export default async function ParkingInformation({
         <Button theme="base" intent="primary" variant="icon" asChild>
           <Link href={parking.externalParkingUrl} target="_blank">
             {intl.formatMessage({ id: "Book parking" })}
-            <OpenInNewIcon />
+            <MaterialIcon icon="open_in_new" color="CurrentColor" />
           </Link>
         </Button>
       )}
diff --git a/apps/scandic-web/components/Profile/AddCreditCardButton/index.tsx b/apps/scandic-web/components/Profile/AddCreditCardButton/index.tsx
index 1d1f22eed..61aaf51ea 100644
--- a/apps/scandic-web/components/Profile/AddCreditCardButton/index.tsx
+++ b/apps/scandic-web/components/Profile/AddCreditCardButton/index.tsx
@@ -4,9 +4,10 @@ import { usePathname, useRouter, useSearchParams } from "next/navigation"
 import { useEffect, useRef } from "react"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { trpc } from "@/lib/trpc/client"
 
-import { PlusCircleIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import { toast } from "@/components/TempDesignSystem/Toasts"
 import useLang from "@/hooks/useLang"
@@ -98,7 +99,7 @@ export default function AddCreditCardButton() {
       }
       wrapping
     >
-      <PlusCircleIcon color="burgundy" />
+      <MaterialIcon icon="add_circle" color="CurrentColor" />
       {intl.formatMessage({ id: "Add new card" })}
     </Button>
   )
diff --git a/apps/scandic-web/components/Profile/CreditCardRow/index.tsx b/apps/scandic-web/components/Profile/CreditCardRow/index.tsx
index 5aa54ab57..d9b7c1752 100644
--- a/apps/scandic-web/components/Profile/CreditCardRow/index.tsx
+++ b/apps/scandic-web/components/Profile/CreditCardRow/index.tsx
@@ -1,4 +1,5 @@
-import { CreditCard } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
@@ -13,7 +14,7 @@ export default function CreditCardRow({ card }: CreditCardRowProps) {
 
   return (
     <div className={styles.card}>
-      <CreditCard color="black" />
+      <MaterialIcon icon="credit_card" color="Icon/Intense" />
       <Body textTransform="bold">{card.type}</Body>
       <Caption color="textMediumContrast">{maskedCardNumber}</Caption>
       <DeleteCreditCardConfirmation card={card} />
diff --git a/apps/scandic-web/components/Profile/DeleteCreditCardButton/index.tsx b/apps/scandic-web/components/Profile/DeleteCreditCardButton/index.tsx
index 1526f10bf..800ce4c58 100644
--- a/apps/scandic-web/components/Profile/DeleteCreditCardButton/index.tsx
+++ b/apps/scandic-web/components/Profile/DeleteCreditCardButton/index.tsx
@@ -1,9 +1,10 @@
 "use client"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { trpc } from "@/lib/trpc/client"
 
-import { DeleteIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import { toast } from "@/components/TempDesignSystem/Toasts"
 
@@ -35,7 +36,7 @@ export default function DeleteCreditCardButton({
   }
   return (
     <Button variant="icon" theme="base" intent="text" onClick={handleDelete}>
-      <DeleteIcon color="burgundy" />
+      <MaterialIcon icon="remove" color="CurrentColor" />
     </Button>
   )
 }
diff --git a/apps/scandic-web/components/Profile/DeleteCreditCardConfirmation.tsx b/apps/scandic-web/components/Profile/DeleteCreditCardConfirmation.tsx
index 53237838a..427b0de72 100644
--- a/apps/scandic-web/components/Profile/DeleteCreditCardConfirmation.tsx
+++ b/apps/scandic-web/components/Profile/DeleteCreditCardConfirmation.tsx
@@ -1,10 +1,11 @@
 "use client"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { trpc } from "@/lib/trpc/client"
 
 import Dialog from "@/components/Dialog"
-import { DeleteIcon } from "@/components/Icons"
 import Button from "@/components/TempDesignSystem/Button"
 import { toast } from "@/components/TempDesignSystem/Toasts"
 
@@ -55,7 +56,7 @@ export default function DeleteCreditCardConfirmation({
       titleText={intl.formatMessage({ id: "Remove card from member profile" })}
       trigger={
         <Button intent="secondary" size="small" theme="base">
-          <DeleteIcon color="burgundy" />
+          <MaterialIcon icon="delete" color="Icon/Interactive/Default" />
         </Button>
       }
     />
diff --git a/apps/scandic-web/components/Profile/ManagePreferencesButton/index.tsx b/apps/scandic-web/components/Profile/ManagePreferencesButton/index.tsx
index 169253a2b..f6ee8b655 100644
--- a/apps/scandic-web/components/Profile/ManagePreferencesButton/index.tsx
+++ b/apps/scandic-web/components/Profile/ManagePreferencesButton/index.tsx
@@ -2,9 +2,10 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { trpc } from "@/lib/trpc/client"
 
-import ArrowRight from "@/components/Icons/ArrowRight"
 import Button from "@/components/TempDesignSystem/Button"
 import { toast } from "@/components/TempDesignSystem/Toasts"
 
@@ -44,7 +45,7 @@ export default function ManagePreferencesButton() {
       onClick={() => generatePreferencesLink.mutate()}
       wrapping
     >
-      <ArrowRight color="burgundy" />
+      <MaterialIcon icon="arrow_forward" color="CurrentColor" />
       {intl.formatMessage({ id: "Manage preferences" })}
     </Button>
   )
diff --git a/apps/scandic-web/components/SasTierComparison/index.tsx b/apps/scandic-web/components/SasTierComparison/index.tsx
index 8169b445f..b75262d45 100644
--- a/apps/scandic-web/components/SasTierComparison/index.tsx
+++ b/apps/scandic-web/components/SasTierComparison/index.tsx
@@ -1,10 +1,11 @@
 "use client"
 import Image from "next/image"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import JsonToHtml from "@/components/JsonToHtml"
 import Link from "@/components/TempDesignSystem/Link"
 
-import { ArrowRightIcon, ChevronDownIcon, CompareArrowsIcon } from "../Icons"
 import SectionContainer from "../Section/Container"
 import Button from "../TempDesignSystem/Button"
 import Body from "../TempDesignSystem/Text/Body"
@@ -102,7 +103,7 @@ function TierDetails({
             {tierMatch.scandic_friends_tier_name}
           </Body>
           <div className={styles.comparisonIcon}>
-            <CompareArrowsIcon width={16} height={16} />
+            <MaterialIcon icon="compare_arrows" size={16} />
           </div>
           <div
             style={{
@@ -119,11 +120,11 @@ function TierDetails({
               {tierMatch.sas_eb_tier_name}
             </Body>
             <div className={styles.iconWrapper}>
-              <ChevronDownIcon
+              <MaterialIcon
+                icon="keyboard_arrow_down"
                 className={styles.chevron}
-                color="burgundy"
-                width={20}
-                height={20}
+                color="Icon/Default"
+                size={20}
               />
             </div>
           </div>
@@ -156,7 +157,7 @@ function ReadMoreLink({
   return (
     <Link href={href} className={styles.link} weight="bold" color="burgundy">
       {children}
-      <ArrowRightIcon color="burgundy" />
+      <MaterialIcon icon="arrow_forward" color="CurrentColor" />
     </Link>
   )
 }
diff --git a/apps/scandic-web/components/Section/Link/index.tsx b/apps/scandic-web/components/Section/Link/index.tsx
index 4b76d8dbf..4fd2185bd 100644
--- a/apps/scandic-web/components/Section/Link/index.tsx
+++ b/apps/scandic-web/components/Section/Link/index.tsx
@@ -1,4 +1,5 @@
-import ArrowRight from "@/components/Icons/ArrowRight"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Link from "@/components/TempDesignSystem/Link"
 
 import { linkVariants } from "./variants"
@@ -22,7 +23,11 @@ export default function SectionLink({ link, variant }: SectionLinkProps) {
       variant="underscored"
     >
       {link.text}
-      <ArrowRight color="burgundy" className={styles.icon} />
+      <MaterialIcon
+        icon="arrow_forward"
+        color="CurrentColor"
+        className={styles.icon}
+      />
     </Link>
   )
 }
diff --git a/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/RoomDetails.tsx b/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/RoomDetails.tsx
index 95cec18ee..24a9a35b0 100644
--- a/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/RoomDetails.tsx
+++ b/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/RoomDetails.tsx
@@ -2,10 +2,11 @@
 
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import { getBedIcon } from "../RoomSidePeek/bedIcon"
-import { getFacilityIcon } from "../RoomSidePeek/facilityIcon"
+import { getBedIconName } from "../RoomSidePeek/bedIcon"
+import { FacilityIcon } from "../RoomSidePeek/facilityIcon"
 
 import styles from "./bookedRoomSidePeek.module.css"
 
@@ -21,13 +22,13 @@ export default function RoomDetails({
   const sortedFacilities = roomFacilities
     .sort((a, b) => a.sortOrder - b.sortOrder)
     .map((facility) => {
-      const Icon = getFacilityIcon(facility.icon)
+      const Icon = <FacilityIcon name={facility.icon} color="Icon/Default" />
       return { ...facility, Icon }
     })
 
   const bedOptions = roomTypes.map((roomType) => {
-    const BedIcon = getBedIcon(roomType.mainBed.type)
-    return { ...roomType, BedIcon }
+    const bedIconName = getBedIconName(roomType.mainBed.type)
+    return { ...roomType, bedIconName }
   })
 
   return (
@@ -44,9 +45,7 @@ export default function RoomDetails({
         <ul className={styles.facilityList}>
           {sortedFacilities.map(({ name, Icon }) => (
             <li key={name}>
-              {Icon && (
-                <Icon width={24} height={24} color="uiTextMediumContrast" />
-              )}
+              {Icon && Icon}
               <Typography variant="Body/Paragraph/mdRegular">
                 <span className={styles.listText}>{name}</span>
               </Typography>
@@ -66,11 +65,9 @@ export default function RoomDetails({
           </p>
         </Typography>
         <ul className={styles.bedOptions}>
-          {bedOptions.map(({ code, mainBed, BedIcon }) => (
+          {bedOptions.map(({ code, mainBed, bedIconName }) => (
             <li key={code}>
-              {BedIcon && (
-                <BedIcon color="uiTextMediumContrast" width={24} height={24} />
-              )}
+              <MaterialIcon icon={bedIconName} color="Icon/Default" size={24} />
               <Typography variant="Body/Paragraph/mdRegular">
                 <span className={styles.listText}>{mainBed.description}</span>
               </Typography>
diff --git a/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/index.tsx b/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/index.tsx
index b54ec01e7..50642d4e9 100644
--- a/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/index.tsx
+++ b/apps/scandic-web/components/SidePeeks/BookedRoomSidePeek/index.tsx
@@ -1,5 +1,9 @@
 import { useIntl } from "react-intl"
 
+import {
+  Discount22Icon,
+  MaterialIcon,
+} from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
 import { dt } from "@/lib/dt"
@@ -8,16 +12,6 @@ import { useMyStayRoomDetailsStore } from "@/stores/my-stay/myStayRoomDetailsSto
 import GuestDetails from "@/components/HotelReservation/MyStay/GuestDetails"
 import Price from "@/components/HotelReservation/MyStay/Price"
 import { hasBreakfastPackage } from "@/components/HotelReservation/MyStay/utils/hasBreakfastPackage"
-import {
-  BedDoubleIcon,
-  BookingCodeIcon,
-  CoffeeIcon,
-  ContractIcon,
-  DoorOpenIcon,
-  PersonIcon,
-} from "@/components/Icons"
-import CrossCircleIcon from "@/components/Icons/CrossCircle"
-import Refresh from "@/components/Icons/Refresh"
 import ImageGallery from "@/components/ImageGallery"
 import Accordion from "@/components/TempDesignSystem/Accordion"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
@@ -113,7 +107,13 @@ export default function BookedRoomSidePeek({
           {isCancelled ? (
             <IconChip
               color={"red"}
-              icon={<CrossCircleIcon width={20} height={20} color="red" />}
+              icon={
+                <MaterialIcon
+                  icon="cancel"
+                  size={20}
+                  color="Icon/Feedback/Error"
+                />
+              }
             >
               <Typography variant="Body/Supporting text (caption)/smBold">
                 <span>{intl.formatMessage({ id: "Cancelled" })}</span>
@@ -161,7 +161,7 @@ export default function BookedRoomSidePeek({
           <div className={styles.roomDetails}>
             <div className={styles.row}>
               <span className={styles.rowTitle}>
-                <PersonIcon color="grey80" width={20} height={20} />
+                <MaterialIcon icon="person" color="Icon/Default" size={20} />
                 <Typography variant="Body/Paragraph/mdBold">
                   <p>{intl.formatMessage({ id: "Guests" })}</p>
                 </Typography>
@@ -178,7 +178,7 @@ export default function BookedRoomSidePeek({
             </div>
             <div className={styles.row}>
               <span className={styles.rowTitle}>
-                <ContractIcon color="grey80" width={20} height={20} />
+                <MaterialIcon icon="contract" color="Icon/Default" size={20} />
                 <Typography variant="Body/Paragraph/mdBold">
                   <p>{intl.formatMessage({ id: "Terms" })}</p>
                 </Typography>
@@ -191,7 +191,7 @@ export default function BookedRoomSidePeek({
             </div>
             <div className={styles.row}>
               <span className={styles.rowTitle}>
-                <Refresh color="grey80" width={20} height={20} />
+                <MaterialIcon icon="refresh" color="Icon/Default" size={20} />
                 <Typography variant="Body/Paragraph/mdBold">
                   <p>{intl.formatMessage({ id: "Modify By" })}</p>
                 </Typography>
@@ -209,7 +209,7 @@ export default function BookedRoomSidePeek({
             </div>
             <div className={styles.row}>
               <span className={styles.rowTitle}>
-                <CoffeeIcon color="grey80" width={20} height={20} />
+                <MaterialIcon icon="coffee" color="Icon/Default" size={20} />
                 <Typography variant="Body/Paragraph/mdBold">
                   <p>{intl.formatMessage({ id: "Breakfast" })}</p>
                 </Typography>
@@ -236,7 +236,11 @@ export default function BookedRoomSidePeek({
             ) && (
               <div className={styles.row}>
                 <span className={styles.rowTitle}>
-                  <DoorOpenIcon color="grey80" width={20} height={20} />
+                  <MaterialIcon
+                    icon="meeting_room"
+                    color="Icon/Default"
+                    size={20}
+                  />
                   <Typography variant="Body/Paragraph/mdBold">
                     <p>{intl.formatMessage({ id: "Room classification" })}</p>
                   </Typography>
@@ -260,7 +264,7 @@ export default function BookedRoomSidePeek({
 
             <div className={styles.row}>
               <span className={styles.rowTitle}>
-                <BedDoubleIcon color="grey80" width={20} height={20} />
+                <MaterialIcon icon="bed" color="Icon/Default" size={20} />
                 <Typography variant="Body/Paragraph/mdBold">
                   <p>{intl.formatMessage({ id: "Bed preference" })}</p>
                 </Typography>
@@ -289,7 +293,10 @@ export default function BookedRoomSidePeek({
             </div>
           </div>
           {bookingCode && (
-            <IconChip color={"blue"} icon={<BookingCodeIcon color="blue" />}>
+            <IconChip
+              color="blue"
+              icon={<Discount22Icon color="Icon/Feedback/Information" />}
+            >
               <Typography variant="Body/Supporting text (caption)/smBold">
                 <p className={styles.bookingCode}>
                   <strong>{intl.formatMessage({ id: "Booking code" })}</strong>
diff --git a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Accessibility.tsx b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Accessibility.tsx
index 2372cd04a..76b3c60fe 100644
--- a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Accessibility.tsx
+++ b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Accessibility.tsx
@@ -1,10 +1,10 @@
 import { useIntl } from "react-intl"
 
+import { IconName } from "@/components/Icons/iconName"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
 import type { AccessibilityProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
-import { IconName } from "@/types/components/icon"
 
 export default function Accessibility({
   elevatorPitchText,
diff --git a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/CheckInCheckOut.tsx b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/CheckInCheckOut.tsx
index 10561aa3e..f6a27e91c 100644
--- a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/CheckInCheckOut.tsx
+++ b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/CheckInCheckOut.tsx
@@ -1,10 +1,10 @@
 import { useIntl } from "react-intl"
 
+import { IconName } from "@/components/Icons/iconName"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
 import type { CheckInCheckOutProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
-import { IconName } from "@/types/components/icon"
 
 export default function CheckinCheckOut({ checkin }: CheckInCheckOutProps) {
   const intl = useIntl()
diff --git a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/MeetingsAndConferences.tsx b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/MeetingsAndConferences.tsx
index 494999805..b6de3325a 100644
--- a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/MeetingsAndConferences.tsx
+++ b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/MeetingsAndConferences.tsx
@@ -1,10 +1,10 @@
 import { useIntl } from "react-intl"
 
+import { IconName } from "@/components/Icons/iconName"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
 import type { MeetingsAndConferencesProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
-import { IconName } from "@/types/components/icon"
 
 export default function MeetingsAndConferences({
   meetingDescription,
diff --git a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Parking.tsx b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Parking.tsx
index 6c7b73be9..ca364821a 100644
--- a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Parking.tsx
+++ b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Parking.tsx
@@ -1,13 +1,14 @@
 import { useIntl } from "react-intl"
 
-import FilledHeartIcon from "@/components/Icons/FilledHeart"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
+import { IconName } from "@/components/Icons/iconName"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 
 import styles from "./sidePeekAccordion.module.css"
 
 import type { ParkingProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
-import { IconName } from "@/types/components/icon"
 
 export default function Parking({ parking }: ParkingProps) {
   const intl = useIntl()
@@ -28,7 +29,7 @@ export default function Parking({ parking }: ParkingProps) {
             <ul className={styles.list}>
               {p.address !== undefined && (
                 <li>
-                  <FilledHeartIcon color="baseIconLowContrast" />
+                  <MaterialIcon icon="favorite" isFilled color="Icon/Accent" />
                   {intl.formatMessage(
                     { id: "Address: {address}" },
                     {
@@ -39,7 +40,7 @@ export default function Parking({ parking }: ParkingProps) {
               )}
               {p.numberOfParkingSpots !== undefined && (
                 <li>
-                  <FilledHeartIcon color="baseIconLowContrast" />
+                  <MaterialIcon icon="favorite" isFilled color="Icon/Accent" />
                   {intl.formatMessage(
                     { id: "Number of parking spots: {number}" },
                     { number: p.numberOfParkingSpots }
@@ -48,7 +49,7 @@ export default function Parking({ parking }: ParkingProps) {
               )}
               {p.numberOfChargingSpaces !== undefined && (
                 <li>
-                  <FilledHeartIcon color="baseIconLowContrast" />
+                  <MaterialIcon icon="favorite" isFilled color="Icon/Accent" />
                   {intl.formatMessage(
                     {
                       id: "Number of charging points for electric cars: {number}",
diff --git a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Restaurant.tsx b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Restaurant.tsx
index 4a31914b4..0f16b61d1 100644
--- a/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Restaurant.tsx
+++ b/apps/scandic-web/components/SidePeeks/HotelSidePeek/Accordions/Restaurant.tsx
@@ -1,10 +1,10 @@
 import { useIntl } from "react-intl"
 
+import { IconName } from "@/components/Icons/iconName"
 import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
 import type { RestaurantProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
-import { IconName } from "@/types/components/icon"
 
 export default function Restaurant({
   restaurantsContentDescriptionMedium,
diff --git a/apps/scandic-web/components/SidePeeks/HotelSidePeek/index.tsx b/apps/scandic-web/components/SidePeeks/HotelSidePeek/index.tsx
index 97dbc1579..b50c29623 100644
--- a/apps/scandic-web/components/SidePeeks/HotelSidePeek/index.tsx
+++ b/apps/scandic-web/components/SidePeeks/HotelSidePeek/index.tsx
@@ -1,6 +1,6 @@
 import { useIntl } from "react-intl"
 
-import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
+import { FacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import Contact from "@/components/HotelReservation/Contact"
 import Accordion from "@/components/TempDesignSystem/Accordion"
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
@@ -73,12 +73,12 @@ export default function HotelSidePeek({
         </Accordion>
         <div className={styles.amenity}>
           {amenitiesList.map((amenity) => {
-            const Icon = mapFacilityToIcon(amenity.id)
+            const Icon = (
+              <FacilityToIcon id={amenity.id} size={24} color="Icon/Intense" />
+            )
             return (
               <Subtitle type="two" key={amenity.id} color="uiTextHighContrast">
-                {Icon && (
-                  <Icon width={24} height={24} color="uiTextHighContrast" />
-                )}
+                {Icon && Icon}
                 {amenity.name}
               </Subtitle>
             )
diff --git a/apps/scandic-web/components/SidePeeks/RoomSidePeek/bedIcon.ts b/apps/scandic-web/components/SidePeeks/RoomSidePeek/bedIcon.ts
index f58aaabba..c0aa4b2f3 100644
--- a/apps/scandic-web/components/SidePeeks/RoomSidePeek/bedIcon.ts
+++ b/apps/scandic-web/components/SidePeeks/RoomSidePeek/bedIcon.ts
@@ -1,37 +1,29 @@
-import {
-  BedDoubleIcon,
-  BedSingleIcon,
-  KingBedSmallIcon,
-} from "@/components/Icons"
+import type { SymbolCodepoints } from "react-material-symbols"
 
-import type { FC } from "react"
-
-import type { IconProps } from "@/types/components/icon"
-
-export function getBedIcon(name: string): FC<IconProps> | null {
+export function getBedIconName(name: string): SymbolCodepoints {
   const iconMappings = [
     {
-      icon: BedDoubleIcon,
+      icon: "bed",
       texts: ["Queen"],
     },
     {
-      icon: KingBedSmallIcon,
+      icon: "king_bed",
       texts: ["King"],
     },
     {
-      icon: KingBedSmallIcon,
+      icon: "single_bed",
       texts: ["CustomOccupancy"],
     },
     {
-      icon: BedSingleIcon,
+      icon: "bed",
       texts: ["Twin"],
     },
     {
-      icon: BedSingleIcon,
+      icon: "single_bed",
       texts: ["Single"],
     },
   ]
 
   const icon = iconMappings.find((icon) => icon.texts.includes(name))
-  return icon ? icon.icon : BedSingleIcon
+  return icon ? (icon.icon as SymbolCodepoints) : "single_bed"
 }
diff --git a/apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.ts b/apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.ts
deleted file mode 100644
index ada8b97c7..000000000
--- a/apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.ts
+++ /dev/null
@@ -1,240 +0,0 @@
-import {
-  AcIcon,
-  AirplaneIcon,
-  BalconyIcon,
-  BathtubIcon,
-  BedDoubleIcon,
-  BedHotelIcon,
-  BedroomParentIcon,
-  BedSingleIcon,
-  BikeIcon,
-  BreakfastIcon,
-  BusinessIcon,
-  CableIcon,
-  ChairIcon,
-  CityIcon,
-  CoffeeAltIcon,
-  CoffeeIcon,
-  CoffeeMakerIcon,
-  ConciergeIcon,
-  CoolIcon,
-  DeskIcon,
-  DiningIcon,
-  ElectricBikeIcon,
-  FamilyIcon,
-  FitnessIcon,
-  FootstoolIcon,
-  HairdryerIcon,
-  HandSoapIcon,
-  HealthBeautyIcon,
-  HeartIcon,
-  IronIcon,
-  KayakingIcon,
-  KettleIcon,
-  LaptopIcon,
-  LaundryMachineIcon,
-  LocalBarIcon,
-  LuggageIcon,
-  MicrowaveIcon,
-  MirrorIcon,
-  NatureIcon,
-  NightlifeIcon,
-  NoSmokingIcon,
-  OutdoorFurnitureIcon,
-  ParkingIcon,
-  PetsIcon,
-  PhoneIcon,
-  RestaurantIcon,
-  RoomServiceIcon,
-  SafetyBoxIcon,
-  SaunaIcon,
-  ShowerIcon,
-  SpeakerIcon,
-  StoreIcon,
-  StreetIcon,
-  SwimIcon,
-  TshirtWashIcon,
-  TvCastingIcon,
-  WifiIcon,
-  WindowCurtainsAltIcon,
-  WindowNotAvailableIcon,
-  WineBarIcon,
-  WoodFloorIcon,
-  YardIcon,
-} from "@/components/Icons"
-
-import type { FC } from "react"
-
-import type { IconProps } from "@/types/components/icon"
-
-export function getFacilityIcon(
-  name: string | undefined
-): FC<IconProps> | null {
-  if (!name) {
-    return HeartIcon
-  }
-
-  const normalizedName = name.toLowerCase()
-
-  const iconMappings = [
-    { icon: AcIcon, name: "aircondition" },
-    { icon: AirplaneIcon, name: "airport" },
-    { icon: BalconyIcon, name: "balcony" },
-    { icon: BalconyIcon, name: "balconyorterrace" },
-    { icon: BalconyIcon, name: "frenchbalcony" },
-    { icon: BathtubIcon, name: "bathroomwithbathtub" },
-    { icon: BathtubIcon, name: "bathroomwithshowerandbathtub" },
-    { icon: BathtubIcon, name: "bathroomwithshowerorbathtub" },
-    { icon: BedDoubleIcon, name: "adjustablebeds" },
-    { icon: BedDoubleIcon, name: "setoftwopillows" },
-    { icon: BedHotelIcon, name: "armchairbed" },
-    { icon: BedHotelIcon, name: "pulloutbed" },
-    { icon: BedroomParentIcon, name: "separatebedroom" },
-    { icon: BedSingleIcon, name: "extrabed" },
-    { icon: BikeIcon, name: "bikeforloan" },
-    { icon: BreakfastIcon, name: "breakfast" },
-    { icon: BreakfastIcon, name: "servesbreakfastalwaysincluded" },
-    { icon: BusinessIcon, name: "meetingconferencefacilities" },
-    { icon: BusinessIcon, name: "meetingrooms" },
-    { icon: CableIcon, name: "internetwithcableintheroom" },
-    { icon: ChairIcon, name: "armchair" },
-    { icon: ChairIcon, name: "connectingrooms" },
-    { icon: CityIcon, name: "viewcityview" },
-    { icon: CoffeeAltIcon, name: "nespressomachine" },
-    { icon: CoffeeIcon, name: "café" },
-    { icon: CoffeeIcon, name: "coffee" },
-    { icon: CoffeeMakerIcon, name: "coffeemachine" },
-    { icon: ConciergeIcon, name: "lifestyleconcierge" },
-    { icon: CoolIcon, name: "aircooling" },
-    { icon: CoolIcon, name: "cooler" },
-    { icon: CoolIcon, name: "coolingcabinet" },
-    { icon: DeskIcon, name: "deskandchair" },
-    { icon: DiningIcon, name: "diningarea" },
-    { icon: DiningIcon, name: "tablefordining" },
-    { icon: ElectricBikeIcon, name: "ebikeschargingstation" },
-    { icon: FamilyIcon, name: "extrafamilyfriendly" },
-    { icon: FitnessIcon, name: "gym" },
-    { icon: FootstoolIcon, name: "footstool" },
-    { icon: HairdryerIcon, name: "hairdryer" },
-    { icon: HandSoapIcon, name: "toiletries" },
-    { icon: HealthBeautyIcon, name: "beautysalon" },
-    { icon: HeartIcon, name: "bathrobes" },
-    { icon: HeartIcon, name: "bathroom2separatebathrooms" },
-    { icon: HeartIcon, name: "bodycareproducts" },
-    { icon: HeartIcon, name: "bodylotion" },
-    { icon: HeartIcon, name: "bowling" },
-    { icon: HeartIcon, name: "bunkbed" },
-    { icon: HeartIcon, name: "bunkbed80x188cm" },
-    { icon: HeartIcon, name: "carpetingwalltowallcarpet" },
-    { icon: HeartIcon, name: "cashfree800pmtill0600am" },
-    { icon: HeartIcon, name: "cashfreehotel" },
-    { icon: HeartIcon, name: "coffeevoucher" },
-    { icon: HeartIcon, name: "complimentarycoldrefreshments" },
-    { icon: HeartIcon, name: "conditioner" },
-    { icon: HeartIcon, name: "conventioncentre" },
-    { icon: HeartIcon, name: "disabledparking" },
-    { icon: HeartIcon, name: "dockingstationforipodipad" },
-    { icon: HeartIcon, name: "dryingcabinet" },
-    { icon: HeartIcon, name: "easyaccess" },
-    { icon: HeartIcon, name: "garmentsteamer" },
-    { icon: HeartIcon, name: "highfloor" },
-    { icon: HeartIcon, name: "icemachine" },
-    { icon: HeartIcon, name: "icemachinereception" },
-    { icon: HeartIcon, name: "jaccuzzi" },
-    { icon: HeartIcon, name: "jacuzzi" },
-    { icon: HeartIcon, name: "kitchen" },
-    { icon: HeartIcon, name: "kitchenette" },
-    { icon: HeartIcon, name: "latecheckoutuntil1400guaranteed" },
-    { icon: HeartIcon, name: "livemusicexhibitions" },
-    { icon: HeartIcon, name: "massage" },
-    { icon: HeartIcon, name: "meetingarea" },
-    { icon: HeartIcon, name: "minibarincludedinroomrate" },
-    { icon: HeartIcon, name: "overnightsecurity" },
-    { icon: HeartIcon, name: "parkingadditionalcost" },
-    { icon: HeartIcon, name: "privatesauna" },
-    { icon: HeartIcon, name: "refrigerator" },
-    { icon: HeartIcon, name: "seatingarea" },
-    { icon: HeartIcon, name: "security24hoours" },
-    { icon: HeartIcon, name: "separatelivingroom" },
-    { icon: HeartIcon, name: "separatetoilet" },
-    { icon: HeartIcon, name: "servicesecurity24h" },
-    { icon: HeartIcon, name: "shampoo" },
-    { icon: HeartIcon, name: "slippers" },
-    { icon: HeartIcon, name: "sofabed" },
-    { icon: HeartIcon, name: "sofas" },
-    { icon: HeartIcon, name: "sofawithtable" },
-    { icon: HeartIcon, name: "spaciousroom" },
-    { icon: HeartIcon, name: "stillandsparklingwater" },
-    { icon: HeartIcon, name: "table" },
-    { icon: HeartIcon, name: "tassimocoffeemaker" },
-    { icon: HeartIcon, name: "terrace" },
-    { icon: HeartIcon, name: "trouserpress" },
-    { icon: HeartIcon, name: "tv" },
-    { icon: HeartIcon, name: "tvwithcomplimentarymoviechannels" },
-    { icon: HeartIcon, name: "tvwithmoviechannels" },
-    { icon: HeartIcon, name: "tvwithstreamingoption" },
-    { icon: HeartIcon, name: "ventilationinroom" },
-    { icon: HeartIcon, name: "view" },
-    { icon: HeartIcon, name: "viewfjordview" },
-    { icon: HeartIcon, name: "viewlakeview" },
-    { icon: HeartIcon, name: "viewpanoramicview" },
-    { icon: HeartIcon, name: "viewseaview" },
-    { icon: HeartIcon, name: "wallbed" },
-    { icon: HeartIcon, name: "wallmountedcyclerack" },
-    { icon: HeartIcon, name: "wardrobe" },
-    { icon: HeartIcon, name: "wellnessandsaunaentrancefeeadmission16years" },
-    { icon: HeartIcon, name: "wellnesspoolsaunaentrancefeeadmission16years" },
-    { icon: HeartIcon, name: "windownook" },
-    { icon: IronIcon, name: "ironandironingboard" },
-    { icon: IronIcon, name: "ironingroom" },
-    { icon: KayakingIcon, name: "kayaksforloan" },
-    { icon: KettleIcon, name: "kettle" },
-    { icon: KettleIcon, name: "kettlewithcoffeetea" },
-    { icon: LaptopIcon, name: "laptopsafe" },
-    { icon: LaptopIcon, name: "laptoptray" },
-    { icon: LaundryMachineIcon, name: "laundryservice" },
-    { icon: LocalBarIcon, name: "bar" },
-    { icon: LocalBarIcon, name: "rooftopbar" },
-    { icon: LocalBarIcon, name: "skybar" },
-    { icon: LuggageIcon, name: "luggagelockers" },
-    { icon: MicrowaveIcon, name: "microwave" },
-    { icon: MirrorIcon, name: "cosmeticmirror" },
-    { icon: NatureIcon, name: "viewparkview" },
-    { icon: NightlifeIcon, name: "disconightclub" },
-    { icon: NoSmokingIcon, name: "nonsmoking" },
-    { icon: OutdoorFurnitureIcon, name: "outdoorterrace" },
-    { icon: ParkingIcon, name: "parking" },
-    { icon: ParkingIcon, name: "parkingfreeparking" },
-    { icon: PetsIcon, name: "petfriendlyrooms" },
-    { icon: PhoneIcon, name: "directdialphoneandvoicemail" },
-    { icon: RestaurantIcon, name: "restaurant" },
-    { icon: RoomServiceIcon, name: "roomservice" },
-    { icon: SafetyBoxIcon, name: "safetybox" },
-    { icon: SaunaIcon, name: "sauna" },
-    { icon: ShowerIcon, name: "bathroomwithshower" },
-    { icon: ShowerIcon, name: "rainshower" },
-    { icon: ShowerIcon, name: "sharedbathroomwithshower" },
-    { icon: ShowerIcon, name: "showergel" },
-    { icon: ShowerIcon, name: "showerproductsscentbygrandcentral" },
-    { icon: SpeakerIcon, name: "modernvinylplayer" },
-    { icon: SpeakerIcon, name: "musicplayer" },
-    { icon: StoreIcon, name: "hairdresser" },
-    { icon: StoreIcon, name: "shop" },
-    { icon: StreetIcon, name: "viewstreetview" },
-    { icon: SwimIcon, name: "pool" },
-    { icon: TshirtWashIcon, name: "handwash" },
-    { icon: TvCastingIcon, name: "tvwithchromecast" },
-    { icon: WifiIcon, name: "freewifi" },
-    { icon: WindowCurtainsAltIcon, name: "blackoutcurtains" },
-    { icon: WindowNotAvailableIcon, name: "nowindow" },
-    { icon: WineBarIcon, name: "minibar" },
-    { icon: WoodFloorIcon, name: "woodenfloor" },
-    { icon: YardIcon, name: "viewatriumview" },
-  ]
-
-  const icon = iconMappings.find(
-    (icon) => icon.name.toLowerCase() === normalizedName
-  )
-
-  return icon ? icon.icon : HeartIcon
-}
diff --git a/apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.tsx b/apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.tsx
new file mode 100644
index 000000000..1dd84fbd6
--- /dev/null
+++ b/apps/scandic-web/components/SidePeeks/RoomSidePeek/facilityIcon.tsx
@@ -0,0 +1,236 @@
+import {
+  BathroomCabinet2Icon,
+  BedHotelIcon,
+  BowlingPinsIcon,
+  ConferenceRoomIcon,
+  CoolingIcon,
+  CouchTableIcon,
+  Door2Icon,
+  FootStoolIcon,
+  Hairdresser1Icon,
+  HairDryerIcon,
+  HandSoapIcon,
+  IceMachineIcon,
+  type IconProps,
+  MassageIcon,
+  MaterialIcon,
+  type MaterialIconSetIconProps,
+  MdiBunkBedIcon,
+  MirrorIcon,
+  MovingBedsIcon,
+  type NucleoIconProps,
+  RecordPlayer3Icon,
+  RoadIcon,
+  RugIcon,
+  SafetyBoxIcon,
+  SlippersIcon,
+  Toilet2Icon,
+  TowelIcon,
+  UserPolice2Icon,
+  ViewIcon,
+  WardIcon,
+  WindowNotAvailableIcon,
+  WoodFloorIcon,
+} from "@scandic-hotels/design-system/Icons"
+
+import type { MaterialSymbolProps } from "react-material-symbols"
+
+interface FacilityIconProps {
+  name: string | undefined
+}
+export function FacilityIcon({
+  name,
+  ...props
+}:
+  | (FacilityIconProps & MaterialIconSetIconProps)
+  | NucleoIconProps
+  | IconProps): JSX.Element {
+  if (!name) {
+    return <MaterialIcon icon="favorite" {...props} />
+  }
+
+  const normalizedName = name.toLowerCase()
+
+  const customIcon = CustomIconMappings.find(
+    (icon) => icon.name.toLowerCase() === normalizedName
+  )
+  if (customIcon) {
+    return <customIcon.icon {...props} />
+  }
+
+  const materialSymbolIcon = MaterialIconMappings.find(
+    (icon) => icon.name.toLowerCase() === normalizedName
+  )
+
+  return materialSymbolIcon ? (
+    <MaterialIcon icon={materialSymbolIcon.icon} {...props} />
+  ) : (
+    <MaterialIcon icon="favorite" {...props} />
+  )
+}
+
+const MaterialIconMappings: {
+  icon: MaterialSymbolProps["icon"]
+  name: string
+}[] = [
+  { icon: "air_purifier_gen", name: "aircondition" },
+  { icon: "travel", name: "airport" },
+  { icon: "balcony", name: "balcony" },
+  { icon: "deck", name: "balconyorterrace" },
+  { icon: "balcony", name: "frenchbalcony" },
+  { icon: "bathtub", name: "bathroomwithbathtub" },
+  { icon: "bathtub", name: "bathroomwithshowerandbathtub" },
+  { icon: "bed", name: "setoftwopillows" },
+  { icon: "chair", name: "armchairbed" },
+  { icon: "meeting_room", name: "separatebedroom" },
+  { icon: "pedal_bike", name: "bikeforloan" },
+  { icon: "bakery_dining", name: "breakfast" },
+  { icon: "bakery_dining", name: "servesbreakfastalwaysincluded" },
+  { icon: "business_center", name: "meetingconferencefacilities" },
+  { icon: "business_center", name: "meetingrooms" },
+  { icon: "router", name: "internetwithcableintheroom" },
+  { icon: "chair", name: "armchair" },
+  { icon: "chair", name: "chair" },
+  { icon: "meeting_room", name: "connectingrooms" },
+  { icon: "location_city", name: "viewcityview" },
+  { icon: "coffee_maker", name: "nespressomachine" },
+  { icon: "dining", name: "café" },
+  { icon: "coffee", name: "coffee" },
+  { icon: "coffee_maker", name: "coffeemachine" },
+  { icon: "concierge", name: "lifestyleconcierge" },
+  { icon: "mode_fan", name: "aircooling" },
+  { icon: "mode_fan", name: "cooler" },
+  { icon: "desk", name: "deskandchair" },
+  { icon: "desk", name: "desk" },
+  { icon: "dining", name: "diningarea" },
+  { icon: "table_bar", name: "tablefordining" },
+  { icon: "electric_bike", name: "ebikeschargingstation" },
+  { icon: "family_restroom", name: "extrafamilyfriendly" },
+  { icon: "exercise", name: "gym" },
+  { icon: "health_and_beauty", name: "beautysalon" },
+  { icon: "bathroom", name: "bathroom2separatebathrooms" },
+  { icon: "credit_card_heart", name: "cashfree800pmtill0600am" },
+  { icon: "credit_card_heart", name: "cashfreehotel" },
+  { icon: "confirmation_number", name: "coffeevoucher" },
+  { icon: "water_full", name: "complimentarycoldrefreshments" },
+  { icon: "groups", name: "conventioncentre" },
+  { icon: "accessible", name: "disabledparking" },
+  { icon: "charging_station", name: "dockingstationforipodipad" },
+  { icon: "cool_to_dry", name: "dryingcabinet" },
+  { icon: "assistant_navigation", name: "easyaccess" },
+  { icon: "laundry", name: "garmentsteamer" },
+  { icon: "stairs", name: "highfloor" },
+  { icon: "hot_tub", name: "jaccuzzi" },
+  { icon: "hot_tub", name: "jacuzzi" },
+  { icon: "countertops", name: "kitchen" },
+  { icon: "countertops", name: "kitchenette" },
+  { icon: "checked_bag", name: "latecheckoutuntil1400guaranteed" },
+  { icon: "music_cast", name: "livemusicexhibitions" },
+  { icon: "liquor", name: "minibarincludedinroomrate" },
+  { icon: "local_parking", name: "parkingadditionalcost" },
+  { icon: "sauna", name: "privatesauna" },
+  { icon: "kitchen", name: "refrigerator" },
+  { icon: "airline_seat_recline_normal", name: "seatingarea" },
+  { icon: "scene", name: "separatelivingroom" },
+  { icon: "chair", name: "sofabed" },
+  { icon: "chair", name: "sofas" },
+  { icon: "chair", name: "sofa" },
+  { icon: "bedroom_parent", name: "spaciousroom" },
+  { icon: "local_drink", name: "stillandsparklingwater" },
+  { icon: "table_bar", name: "table" },
+  { icon: "coffee_maker", name: "tassimocoffeemaker" },
+  { icon: "deck", name: "terrace" },
+  { icon: "iron", name: "trouserpress" },
+  { icon: "tv_guide", name: "tv" },
+  { icon: "tv_remote", name: "tvwithcomplimentarymoviechannels" },
+  { icon: "tv_remote", name: "tvwithmoviechannels" },
+  { icon: "live_tv", name: "tvwithstreamingoption" },
+  { icon: "hvac", name: "ventilationinroom" },
+  { icon: "landscape", name: "viewfjordview" },
+  { icon: "houseboat", name: "viewlakeview" },
+  { icon: "panorama", name: "viewpanoramicview" },
+  { icon: "sailing", name: "viewseaview" },
+  { icon: "ward", name: "wallbed" },
+  { icon: "pedal_bike", name: "wallmountedcyclerack" },
+  { icon: "dresser", name: "wardrobe" },
+  { icon: "spa", name: "wellnessandsaunaentrancefeeadmission16years" },
+  { icon: "spa", name: "wellnesspoolsaunaentrancefeeadmission16years" },
+  { icon: "curtains", name: "windownook" },
+  { icon: "iron", name: "ironandironingboard" },
+  { icon: "iron", name: "ironingroom" },
+  { icon: "kayaking", name: "kayaksforloan" },
+  { icon: "kettle", name: "kettle" },
+  { icon: "kettle", name: "kettlewithcoffee" },
+  { icon: "sync_saved_locally", name: "laptopsafe" },
+  { icon: "computer", name: "laptoptray" },
+  { icon: "local_laundry_service", name: "laundryservice" },
+  { icon: "local_bar", name: "bar" },
+  { icon: "deck", name: "rooftopbar" },
+  { icon: "local_bar", name: "skybar" },
+  { icon: "microwave", name: "microwave" },
+  { icon: "nature", name: "viewparkview" },
+  { icon: "nightlife", name: "disconightclub" },
+  { icon: "smoke_free", name: "nonsmoking" },
+  { icon: "deck", name: "outdoorterrace" },
+  { icon: "local_parking", name: "parking" },
+  { icon: "local_parking", name: "parkingfreeparking" },
+  { icon: "pets", name: "petfriendlyrooms" },
+  { icon: "phone", name: "directdialphoneandvoicemail" },
+  { icon: "restaurant", name: "restaurant" },
+  { icon: "room_service", name: "roomservice" },
+  { icon: "sauna", name: "sauna" },
+  { icon: "shower", name: "bathroomwithshower" },
+  { icon: "shower", name: "rainshower" },
+  { icon: "shower", name: "sharedbathroomwithshower" },
+  { icon: "radio", name: "musicplayer" },
+  { icon: "shopping_bag", name: "shop" },
+  { icon: "pool", name: "pool" },
+  { icon: "laundry", name: "handwash" },
+  { icon: "connected_tv", name: "tvwithchromecast" },
+  { icon: "wifi", name: "freewifi" },
+  { icon: "curtains_closed", name: "blackoutcurtains" },
+  { icon: "liquor", name: "minibar" },
+  { icon: "yard", name: "viewatriumview" },
+]
+
+const CustomIconMappings = [
+  { icon: BathroomCabinet2Icon, name: "bathroomwithshowerorbathtub" },
+  { icon: MovingBedsIcon, name: "adjustablebeds" },
+  { icon: MovingBedsIcon, name: "pulloutbed" },
+  { icon: BedHotelIcon, name: "extrabed" },
+  { icon: CoolingIcon, name: "coolingcabinet" },
+  { icon: FootStoolIcon, name: "footstool" },
+  { icon: HairDryerIcon, name: "hairdryer" },
+  { icon: Hairdresser1Icon, name: "hairdresser" },
+  { icon: HandSoapIcon, name: "toiletries" },
+  { icon: TowelIcon, name: "bathrobes" },
+  { icon: HandSoapIcon, name: "bodycareproducts" },
+  { icon: HandSoapIcon, name: "bodylotion" },
+  { icon: BowlingPinsIcon, name: "bowling" },
+  { icon: MdiBunkBedIcon, name: "bunkbed" },
+  { icon: MdiBunkBedIcon, name: "bunkbed80x188cm" },
+  { icon: IceMachineIcon, name: "icemachine" },
+  { icon: IceMachineIcon, name: "icemachinereception" },
+  { icon: MassageIcon, name: "massage" },
+  { icon: ConferenceRoomIcon, name: "meetingarea" },
+  { icon: UserPolice2Icon, name: "overnightsecurity" },
+  { icon: UserPolice2Icon, name: "security24hoours" },
+  { icon: UserPolice2Icon, name: "servicesecurity24h" },
+  { icon: FootStoolIcon, name: "footstool" },
+  { icon: WindowNotAvailableIcon, name: "nowindow" },
+  { icon: Door2Icon, name: "luggagelockers" },
+  { icon: MirrorIcon, name: "cosmeticmirror" },
+  { icon: WardIcon, name: "wallbed" },
+  { icon: CouchTableIcon, name: "sofawithtable" },
+  { icon: SafetyBoxIcon, name: "safetybox" },
+  { icon: RecordPlayer3Icon, name: "modernvinylplayer" },
+  { icon: RugIcon, name: "carpetingwalltowallcarpet" },
+  { icon: Toilet2Icon, name: "separatetoilet" },
+  { icon: WoodFloorIcon, name: "woodenfloor" },
+  { icon: ViewIcon, name: "view" },
+  { icon: HandSoapIcon, name: "shampoo" },
+  { icon: RoadIcon, name: "viewstreetview" },
+  { icon: SlippersIcon, name: "slippers" },
+  { icon: HandSoapIcon, name: "showergel" },
+  { icon: HandSoapIcon, name: "showerproductsscentbygrandcentral" },
+]
diff --git a/apps/scandic-web/components/SidePeeks/RoomSidePeek/index.tsx b/apps/scandic-web/components/SidePeeks/RoomSidePeek/index.tsx
index ac7d8c300..6be6ea70b 100644
--- a/apps/scandic-web/components/SidePeeks/RoomSidePeek/index.tsx
+++ b/apps/scandic-web/components/SidePeeks/RoomSidePeek/index.tsx
@@ -1,5 +1,7 @@
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import ImageGallery from "@/components/ImageGallery"
 import SidePeek from "@/components/TempDesignSystem/SidePeek"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -7,8 +9,8 @@ import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { mapApiImagesToGalleryImages } from "@/utils/imageGallery"
 
-import { getBedIcon } from "./bedIcon"
-import { getFacilityIcon } from "./facilityIcon"
+import { getBedIconName } from "./bedIcon"
+import { FacilityIcon } from "./facilityIcon"
 
 import styles from "./roomSidePeek.module.css"
 
@@ -85,16 +87,16 @@ export default function RoomSidePeek({
             {room.roomFacilities
               .sort((a, b) => a.sortOrder - b.sortOrder)
               .map((facility) => {
-                const Icon = getFacilityIcon(facility.icon)
+                const Icon = (
+                  <FacilityIcon
+                    name={facility.icon}
+                    size={24}
+                    color="Icon/Default"
+                  />
+                )
                 return (
                   <li key={facility.name}>
-                    {Icon && (
-                      <Icon
-                        width={24}
-                        height={24}
-                        color="uiTextMediumContrast"
-                      />
-                    )}
+                    {Icon && Icon}
                     <Body
                       asChild
                       className={!Icon ? styles.noIcon : undefined}
@@ -116,16 +118,10 @@ export default function RoomSidePeek({
           </Body>
           <ul className={styles.bedOptions}>
             {room.roomTypes.map((roomType) => {
-              const BedIcon = getBedIcon(roomType.mainBed.type)
+              const bedIcon = getBedIconName(roomType.mainBed.type)
               return (
                 <li key={roomType.code}>
-                  {BedIcon && (
-                    <BedIcon
-                      color="uiTextMediumContrast"
-                      width={24}
-                      height={24}
-                    />
-                  )}
+                  <MaterialIcon icon={bedIcon} color="Icon/Feedback/Neutral" />
                   <Body color="uiTextMediumContrast" asChild>
                     <span>{roomType.mainBed.description}</span>
                   </Body>
diff --git a/apps/scandic-web/components/Sidebar/JoinLoyalty/Contact/ContactRow/index.tsx b/apps/scandic-web/components/Sidebar/JoinLoyalty/Contact/ContactRow/index.tsx
index 2bca0d916..64a82b9bf 100644
--- a/apps/scandic-web/components/Sidebar/JoinLoyalty/Contact/ContactRow/index.tsx
+++ b/apps/scandic-web/components/Sidebar/JoinLoyalty/Contact/ContactRow/index.tsx
@@ -1,6 +1,10 @@
+import {
+  MaterialIcon,
+  type MaterialIconSetIconProps,
+} from "@scandic-hotels/design-system/Icons"
+
 import { serverClient } from "@/lib/trpc/server"
 
-import { EmailIcon, PhoneIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
@@ -27,9 +31,13 @@ export default async function ContactRow({ contact }: ContactRowProps) {
 
   let Icon = null
   if (contact.contact_field.includes("email")) {
-    Icon = EmailIcon
+    Icon = function (props: MaterialIconSetIconProps) {
+      return <MaterialIcon icon="mail" {...props} />
+    }
   } else if (contact.contact_field.includes("phone")) {
-    Icon = PhoneIcon
+    Icon = function (props: MaterialIconSetIconProps) {
+      return <MaterialIcon icon="phone" {...props} />
+    }
   }
 
   let openableLink = val
@@ -51,7 +59,7 @@ export default async function ContactRow({ contact }: ContactRowProps) {
         color="burgundy"
         size="small"
       >
-        {Icon ? <Icon width="20" height="20" color="burgundy" /> : null}
+        {Icon ? <Icon size={20} color="Icon/Interactive/Default" /> : null}
         {val}
       </Link>
       {footnote && <Footnote color="burgundy">{footnote}</Footnote>}
diff --git a/apps/scandic-web/components/Sidebar/JoinLoyalty/ReadMore/index.tsx b/apps/scandic-web/components/Sidebar/JoinLoyalty/ReadMore/index.tsx
index 8890c4172..3fc9ed133 100644
--- a/apps/scandic-web/components/Sidebar/JoinLoyalty/ReadMore/index.tsx
+++ b/apps/scandic-web/components/Sidebar/JoinLoyalty/ReadMore/index.tsx
@@ -1,6 +1,7 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { faq, membershipTermsAndConditions } from "@/constants/currentWebHrefs"
 
-import ArrowRight from "@/components/Icons/ArrowRight"
 import Link from "@/components/TempDesignSystem/Link"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
@@ -34,11 +35,11 @@ export default async function ReadMore() {
             color="burgundy"
             href={link.href}
           >
-            <ArrowRight
-              color="burgundy"
+            <MaterialIcon
+              icon="arrow_forward"
+              color="CurrentColor"
               className={styles.icon}
-              height="20"
-              width="20"
+              size={20}
             />
             {link.text}
           </Link>
diff --git a/apps/scandic-web/components/Sidebar/JoinLoyalty/index.tsx b/apps/scandic-web/components/Sidebar/JoinLoyalty/index.tsx
index 9c891d4af..9f981bf33 100644
--- a/apps/scandic-web/components/Sidebar/JoinLoyalty/index.tsx
+++ b/apps/scandic-web/components/Sidebar/JoinLoyalty/index.tsx
@@ -1,5 +1,6 @@
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import { auth } from "@/auth"
-import ArrowRight from "@/components/Icons/ArrowRight"
 import { ScandicFriends } from "@/components/Levels"
 import LoginButton from "@/components/LoginButton"
 import Button from "@/components/TempDesignSystem/Button"
@@ -60,11 +61,11 @@ export default async function JoinLoyaltyContact({
             position="join scandic friends sidebar"
             color="burgundy"
           >
-            <ArrowRight
-              color="burgundy"
+            <MaterialIcon
+              icon="arrow_forward"
+              color="CurrentColor"
               className={styles.icon}
-              height="20"
-              width="20"
+              size={20}
             />
             {intl.formatMessage({ id: "Log in here" })}
           </LoginButton>
diff --git a/apps/scandic-web/components/TabFilters/index.tsx b/apps/scandic-web/components/TabFilters/index.tsx
index 525c3bbe6..31e3b6ecb 100644
--- a/apps/scandic-web/components/TabFilters/index.tsx
+++ b/apps/scandic-web/components/TabFilters/index.tsx
@@ -2,7 +2,8 @@
 
 import { cx } from "class-variance-authority"
 
-import { HeartIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useScrollShadows from "@/hooks/useScrollShadows"
 
 import styles from "./tabFilters.module.css"
@@ -46,8 +47,13 @@ export default function TabFilters({
             }
             type="button"
           >
-            <HeartIcon
-              color={selectedFilter === category.identifier ? "white" : "black"}
+            <MaterialIcon
+              icon="favorite"
+              color={
+                selectedFilter === category.identifier
+                  ? "Icon/Inverted"
+                  : "Icon/Intense"
+              }
             />
             {category.label}
           </button>
diff --git a/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/accordionItem.ts b/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/accordionItem.ts
index 48b1030d7..73889c9aa 100644
--- a/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/accordionItem.ts
+++ b/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/accordionItem.ts
@@ -1,7 +1,7 @@
 import type { VariantProps } from "class-variance-authority"
 import type { ReactNode } from "react"
 
-import type { IconName } from "@/types/components/icon"
+import type { IconName } from "@/components/Icons/iconName"
 import type { accordionItemVariants } from "./variants"
 
 export interface AccordionItemProps
diff --git a/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/index.tsx b/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/index.tsx
index a752962ec..c03131a66 100644
--- a/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Accordion/AccordionItem/index.tsx
@@ -2,8 +2,9 @@
 
 import { useRef } from "react"
 
-import { ChevronDownIcon } from "@/components/Icons"
-import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
+import { IconByIconName } from "@/components/Icons/IconByIconName"
 import { trackAccordionClick } from "@/utils/tracking"
 
 import Body from "../../Text/Body"
@@ -28,10 +29,11 @@ export default function AccordionItem({
   const contentRef = useRef<HTMLDivElement>(null)
   const detailsRef = useRef<HTMLDetailsElement>(null)
 
-  const FoundIcon = getIconByIconName(iconName)
   const IconComp = icon
     ? icon
-    : FoundIcon && <FoundIcon color="baseTextHighcontrast" />
+    : iconName && (
+        <IconByIconName iconName={iconName} color="Icon/Interactive/Accent" />
+      )
 
   function toggleAccordion() {
     const details = detailsRef.current
@@ -83,11 +85,11 @@ export default function AccordionItem({
               {subtitle && <Body color="baseTextHighContrast">{subtitle}</Body>}
             </div>
           )}
-          <ChevronDownIcon
+          <MaterialIcon
+            icon="keyboard_arrow_down"
             className={styles.chevron}
-            color="burgundy"
-            width={20}
-            height={20}
+            color="Icon/Interactive/Default"
+            size={20}
           />
         </summary>
         <div ref={contentRef} className={styles.content}>
diff --git a/apps/scandic-web/components/TempDesignSystem/Alert/Sidepeek/index.tsx b/apps/scandic-web/components/TempDesignSystem/Alert/Sidepeek/index.tsx
index eadba002e..59276e451 100644
--- a/apps/scandic-web/components/TempDesignSystem/Alert/Sidepeek/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Alert/Sidepeek/index.tsx
@@ -2,7 +2,8 @@
 
 import { useState } from "react"
 
-import { ChevronRightIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import JsonToHtml from "@/components/JsonToHtml"
 import Button from "@/components/TempDesignSystem/Button"
 
@@ -30,7 +31,7 @@ export default function AlertSidepeek({
         wrapping
       >
         {ctaText}
-        <ChevronRightIcon height={20} width={20} />
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
       </Button>
 
       <SidePeek
diff --git a/apps/scandic-web/components/TempDesignSystem/Alert/index.tsx b/apps/scandic-web/components/TempDesignSystem/Alert/index.tsx
index 30f3f426f..75f96d919 100644
--- a/apps/scandic-web/components/TempDesignSystem/Alert/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Alert/index.tsx
@@ -1,8 +1,8 @@
 "use client"
 
 import { Button } from "@scandic-hotels/design-system/Button"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
-import { CloseLargeIcon } from "@/components/Icons"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
 import Link from "../Link"
@@ -42,7 +42,7 @@ export default function Alert({
     <section className={classNames} role={ariaRole} aria-live={ariaLive}>
       <div className={styles.content}>
         <span className={styles.iconWrapper}>
-          <Icon className={styles.icon} width={24} height={24} />
+          <Icon className={styles.icon} size={24} />
         </span>
         <div className={styles.innerContent}>
           <div className={styles.textWrapper}>
@@ -91,7 +91,7 @@ export default function Alert({
         </div>
         {close ? (
           <Button onPress={close} variant="Text" className={styles.closeButton}>
-            <CloseLargeIcon height={24} width={24} color="uiTextPlaceholder" />
+            <MaterialIcon icon="close" color="CurrentColor" />
           </Button>
         ) : null}
       </div>
diff --git a/apps/scandic-web/components/TempDesignSystem/Alert/utils.ts b/apps/scandic-web/components/TempDesignSystem/Alert/utils.ts
deleted file mode 100644
index 06fc9bcfd..000000000
--- a/apps/scandic-web/components/TempDesignSystem/Alert/utils.ts
+++ /dev/null
@@ -1,17 +0,0 @@
-import { InfoCircleIcon } from "@/components/Icons"
-import CrossCircleIcon from "@/components/Icons/CrossCircle"
-import WarningTriangleIcon from "@/components/Icons/WarningTriangle"
-
-import { AlertTypeEnum } from "@/types/enums/alert"
-
-export function getIconByAlertType(alertType: AlertTypeEnum) {
-  switch (alertType) {
-    case AlertTypeEnum.Alarm:
-      return CrossCircleIcon
-    case AlertTypeEnum.Warning:
-      return WarningTriangleIcon
-    case AlertTypeEnum.Info:
-    default:
-      return InfoCircleIcon
-  }
-}
diff --git a/apps/scandic-web/components/TempDesignSystem/Alert/utils.tsx b/apps/scandic-web/components/TempDesignSystem/Alert/utils.tsx
new file mode 100644
index 000000000..06df3d339
--- /dev/null
+++ b/apps/scandic-web/components/TempDesignSystem/Alert/utils.tsx
@@ -0,0 +1,41 @@
+/* eslint-disable react/display-name */
+import {
+  MaterialIcon,
+  type MaterialIconSetIconProps,
+} from "@scandic-hotels/design-system/Icons"
+
+import { AlertTypeEnum } from "@/types/enums/alert"
+
+export function getIconByAlertType(alertType: AlertTypeEnum) {
+  switch (alertType) {
+    case AlertTypeEnum.Alarm:
+      return function (props: MaterialIconSetIconProps) {
+        return (
+          <MaterialIcon
+            color="Icon/Inverted"
+            isFilled
+            icon="cancel"
+            {...props}
+          />
+        )
+      }
+    case AlertTypeEnum.Warning:
+      return function (props: MaterialIconSetIconProps) {
+        return (
+          <MaterialIcon
+            icon="warning"
+            color="Icon/Inverted"
+            isFilled
+            {...props}
+          />
+        )
+      }
+    case AlertTypeEnum.Info:
+    default:
+      return function (props: MaterialIconSetIconProps) {
+        return (
+          <MaterialIcon color="Icon/Inverted" isFilled icon="info" {...props} />
+        )
+      }
+  }
+}
diff --git a/apps/scandic-web/components/TempDesignSystem/BackToTopButton/index.tsx b/apps/scandic-web/components/TempDesignSystem/BackToTopButton/index.tsx
index 5da4159fb..36a94fd2b 100644
--- a/apps/scandic-web/components/TempDesignSystem/BackToTopButton/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/BackToTopButton/index.tsx
@@ -3,7 +3,7 @@
 import { Button as ButtonRAC } from "react-aria-components"
 import { useIntl } from "react-intl"
 
-import { ArrowUpIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 
 import { backToTopButtonVariants } from "./variants"
 
@@ -22,7 +22,7 @@ export function BackToTopButton({
       className={backToTopButtonVariants({ position })}
       onPress={onClick}
     >
-      <ArrowUpIcon color="burgundy" />
+      <MaterialIcon icon="arrow_upward" color="CurrentColor" />
       <span className={styles.backToTopButtonText}>
         {intl.formatMessage({ id: "Back to top" })}
       </span>
diff --git a/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton/index.tsx b/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton/index.tsx
index 331740ef9..aa334ff45 100644
--- a/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton/index.tsx
@@ -1,4 +1,5 @@
-import { ChevronRightIcon, HouseIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import SkeletonShimmer from "@/components/SkeletonShimmer"
 import styles from "@/components/TempDesignSystem/Breadcrumbs/breadcrumbs.module.css"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
@@ -9,13 +10,13 @@ export default function BreadcrumbsSkeleton() {
       <ul className={styles.list}>
         <li className={styles.listItem}>
           <span className={styles.homeLink} color="peach80">
-            <HouseIcon color="peach80" />
+            <MaterialIcon icon="home" color="Icon/Interactive/Secondary" />
           </span>
-          <ChevronRightIcon
+          <MaterialIcon
+            icon="chevron_right"
             aria-hidden="true"
-            color="peach80"
-            height={20}
-            width={20}
+            color="Icon/Interactive/Secondary"
+            size={20}
           />
         </li>
 
diff --git a/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/index.tsx b/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/index.tsx
index ea25ffb55..adfbc170b 100644
--- a/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Breadcrumbs/index.tsx
@@ -1,5 +1,5 @@
-import { HouseIcon } from "@/components/Icons"
-import ChevronRightSmallIcon from "@/components/Icons/ChevronRightSmall"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Link from "@/components/TempDesignSystem/Link"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
 
@@ -34,9 +34,14 @@ export default function Breadcrumbs({
               variant="breadcrumb"
               aria-label={homeBreadcrumb.title}
             >
-              <HouseIcon width={16} height={16} color="peach80" />
+              <MaterialIcon icon="home" size={16} color="CurrentColor" />
             </Link>
-            <ChevronRightSmallIcon aria-hidden="true" color="peach80" />
+            <MaterialIcon
+              icon="chevron_right"
+              size={20}
+              aria-hidden="true"
+              color="Icon/Interactive/Secondary"
+            />
           </li>
         ) : null}
 
@@ -51,7 +56,12 @@ export default function Breadcrumbs({
                 >
                   {breadcrumb.title}
                 </Link>
-                <ChevronRightSmallIcon aria-hidden="true" color="peach80" />
+                <MaterialIcon
+                  icon="chevron_right"
+                  size={20}
+                  aria-hidden="true"
+                  color="Icon/Interactive/Secondary"
+                />
               </li>
             )
           }
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/Checkbox/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/Checkbox/index.tsx
index a2b538656..82a5a18fb 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/Checkbox/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/Checkbox/index.tsx
@@ -3,8 +3,8 @@
 import { Checkbox as AriaCheckbox } from "react-aria-components"
 import { useController, useFormContext } from "react-hook-form"
 
-import { InfoCircleIcon } from "@/components/Icons"
-import CheckIcon from "@/components/Icons/Check"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./checkbox.module.css"
@@ -44,13 +44,15 @@ export default function Checkbox({
               className={styles.checkbox}
               tabIndex={registerOptions?.disabled ? undefined : 0}
             >
-              {isSelected && <CheckIcon color="white" />}
+              {isSelected && (
+                <MaterialIcon icon="check" color="Icon/Inverted" />
+              )}
             </span>
             {children}
           </span>
           {fieldState.error && !hideError ? (
             <Caption className={styles.error} fontOnly>
-              <InfoCircleIcon color="red" />
+              <MaterialIcon icon="info" color="Icon/Interactive/Accent" />
               {fieldState.error.message}
             </Caption>
           ) : null}
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/card.ts b/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/card.ts
index 7d24e46d7..cfcaf726a 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/card.ts
+++ b/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/card.ts
@@ -1,4 +1,4 @@
-import type { IconProps } from "@/types/components/icon"
+import type { IconProps } from "@scandic-hotels/design-system/Icons"
 
 interface BaseCardProps
   extends Omit<React.LabelHTMLAttributes<HTMLLabelElement>, "title"> {
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/index.tsx
index 6c604f725..6c8421cf8 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/ChoiceCard/_Card/index.tsx
@@ -2,7 +2,8 @@
 
 import { useFormContext } from "react-hook-form"
 
-import { CheckIcon, CloseIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 import Footnote from "@/components/TempDesignSystem/Text/Footnote"
 
@@ -46,7 +47,7 @@ export default function Card({
       {Icon ? (
         <Icon
           className={styles.icon}
-          color="uiTextHighContrast"
+          color="Icon/Intense"
           height={iconHeight}
           width={iconWidth}
         />
@@ -73,9 +74,9 @@ function List({ declined, list }: ListProps) {
   return list.map((listItem) => (
     <span key={listItem.title} className={styles.listItem}>
       {declined ? (
-        <CloseIcon color="uiTextMediumContrast" height={20} width={20} />
+        <MaterialIcon icon="close" color="Icon/Feedback/Neutral" size={20} />
       ) : (
-        <CheckIcon color="baseIconLowContrast" height={20} width={20} />
+        <MaterialIcon icon="check" color="Icon/Accent" size={20} />
       )}
       <Footnote color="uiTextMediumContrast">{listItem.title}</Footnote>
     </span>
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/ErrorMessage/Error.tsx b/apps/scandic-web/components/TempDesignSystem/Form/ErrorMessage/Error.tsx
index 765f7ad97..aec1727a4 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/ErrorMessage/Error.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/ErrorMessage/Error.tsx
@@ -1,4 +1,5 @@
-import { InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./error.module.css"
@@ -6,7 +7,7 @@ import styles from "./error.module.css"
 export default function Error({ children }: React.PropsWithChildren) {
   return (
     <Caption className={styles.message} fontOnly>
-      <InfoCircleIcon color="red" />
+      <MaterialIcon icon="info" color="Icon/Feedback/Error" />
       {children}
     </Caption>
   )
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx
index a17854464..7b101a308 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/FilterChip/_Chip/index.tsx
@@ -1,7 +1,8 @@
 import { useMemo } from "react"
 import { useFormContext } from "react-hook-form"
 
-import { HeartIcon, InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./chip.module.css"
@@ -9,7 +10,7 @@ import styles from "./chip.module.css"
 import type { FilterChipProps } from "@/types/components/form/filterChip"
 
 export default function FilterChip({
-  Icon = HeartIcon,
+  Icon = () => <MaterialIcon icon="favorite" />,
   iconHeight = 20,
   iconWidth = 20,
   id,
@@ -23,12 +24,18 @@ export default function FilterChip({
 }: FilterChipProps) {
   const { register } = useFormContext()
 
-  const color = useMemo(() => {
+  const captionColor = useMemo(() => {
     if (selected) return "burgundy"
     if (disabled) return "disabled"
     return "uiTextPlaceholder"
   }, [selected, disabled])
 
+  const iconColor = useMemo(() => {
+    if (selected) return "Icon/Interactive/Default"
+    if (disabled) return "Icon/Interactive/Disabled"
+    return "Icon/Interactive/Placeholder"
+  }, [selected, disabled])
+
   return (
     <label
       className={styles.label}
@@ -37,16 +44,16 @@ export default function FilterChip({
     >
       <Icon
         className={styles.icon}
-        color={color}
+        color={captionColor}
         height={iconHeight}
         width={iconWidth}
       />
-      <Caption type="bold" color={color} className={styles.caption}>
+      <Caption type="bold" color={captionColor} className={styles.caption}>
         {label}
       </Caption>
 
       {hasTooltip && (
-        <InfoCircleIcon color={color} height={iconHeight} width={iconWidth} />
+        <MaterialIcon icon="info" color={iconColor} size={iconHeight} />
       )}
 
       <input
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/Input/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/Input/index.tsx
index b692547db..2808dddaf 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/Input/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/Input/index.tsx
@@ -3,7 +3,8 @@ import { Text, TextField } from "react-aria-components"
 import { Controller, useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 
-import { CheckIcon, InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import AriaInputWithLabel from "@/components/TempDesignSystem/Form/Input/AriaInputWithLabel"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
@@ -69,14 +70,14 @@ export default function Input({
           {helpText && !fieldState.error ? (
             <Caption asChild color="black">
               <Text className={styles.helpText} slot="description">
-                <CheckIcon height={20} width={30} />
+                <MaterialIcon icon="check" size={20} />
                 {helpText}
               </Text>
             </Caption>
           ) : null}
           {fieldState.error && !hideError ? (
             <Caption className={styles.error} fontOnly>
-              <InfoCircleIcon color="red" />
+              <MaterialIcon icon="info" color="Icon/Interactive/Accent" />
               {intl.formatMessage({ id: fieldState.error.message })}
             </Caption>
           ) : null}
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/PasswordInput/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/PasswordInput/index.tsx
index ca8288268..28780fcfa 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/PasswordInput/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/PasswordInput/index.tsx
@@ -5,13 +5,8 @@ import { Text, TextField } from "react-aria-components"
 import { Controller, useFormContext } from "react-hook-form"
 import { useIntl } from "react-intl"
 
-import {
-  CheckIcon,
-  CloseIcon,
-  EyeHideIcon,
-  EyeShowIcon,
-  InfoCircleIcon,
-} from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 import AriaInputWithLabel from "@/components/TempDesignSystem/Form/Input/AriaInputWithLabel"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
@@ -95,7 +90,11 @@ export default function PasswordInput({
                   aria-controls={field.name}
                   className={styles.toggleButton}
                 >
-                  {isPasswordVisible ? <EyeHideIcon /> : <EyeShowIcon />}
+                  {isPasswordVisible ? (
+                    <MaterialIcon icon="visibility_off" />
+                  ) : (
+                    <MaterialIcon icon="visibility" />
+                  )}
                 </Button>
               ) : null}
             </div>
@@ -107,13 +106,13 @@ export default function PasswordInput({
             {isNewPassword ? (
               !field.value && fieldState.error ? (
                 <Caption className={styles.error} fontOnly>
-                  <InfoCircleIcon color="red" />
+                  <MaterialIcon icon="info" color="Icon/Feedback/Error" />
                   {fieldState.error.message}
                 </Caption>
               ) : null
             ) : fieldState.error ? (
               <Caption className={styles.error} fontOnly>
-                <InfoCircleIcon color="red" />
+                <MaterialIcon icon="info" color="Icon/Feedback/Error" />
                 {fieldState.error &&
                   intl.formatMessage({ id: fieldState.error.message })}
               </Caption>
@@ -127,9 +126,9 @@ export default function PasswordInput({
 
 function Icon({ errorMessage, errors }: IconProps) {
   return errors.includes(errorMessage) ? (
-    <CloseIcon color="red" height={20} width={20} />
+    <MaterialIcon icon="close" color="Icon/Interactive/Accent" size={20} />
   ) : (
-    <CheckIcon color="green" height={20} width={20} />
+    <MaterialIcon icon="check" color="Icon/Feedback/Success" size={20} />
   )
 }
 
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/Phone/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/Phone/index.tsx
index 7c5b72896..da6931a21 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/Phone/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/Phone/index.tsx
@@ -12,7 +12,8 @@ import {
 } from "react-international-phone"
 import { useIntl } from "react-intl"
 
-import { ChevronDownIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import ErrorMessage from "@/components/TempDesignSystem/Form/ErrorMessage"
 import AriaInputWithLabel from "@/components/TempDesignSystem/Form/Input/AriaInputWithLabel"
 import Label from "@/components/TempDesignSystem/Form/Label"
@@ -116,11 +117,11 @@ export default function Phone({
                   prefix="+"
                 />
               </Body>
-              <ChevronDownIcon
+              <MaterialIcon
+                icon="keyboard_arrow_down"
                 className={styles.chevron}
-                color="grey80"
-                height={18}
-                width={18}
+                color="Icon/Default"
+                size={18}
               />
             </span>
           </button>
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/SelectChevron/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/SelectChevron/index.tsx
index d7c53c97f..411dd15bd 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/SelectChevron/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/SelectChevron/index.tsx
@@ -1,13 +1,18 @@
-import { ChevronDownIcon } from "@/components/Icons"
+import {
+  type IconProps,
+  MaterialIcon,
+} from "@scandic-hotels/design-system/Icons"
 
 import styles from "./chevron.module.css"
 
-import type { IconProps } from "@/types/components/icon"
-
 export default function SelectChevron(props: IconProps) {
   return (
     <span aria-hidden="true" className={styles.chevron}>
-      <ChevronDownIcon color="grey80" width={20} height={20} {...props} />
+      <MaterialIcon
+        icon="keyboard_arrow_down"
+        color={props.color ?? "Icon/Default"}
+        size={20}
+      />
     </span>
   )
 }
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/Switch/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/Switch/index.tsx
index 4064a0f4e..471f897a1 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/Switch/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/Switch/index.tsx
@@ -3,7 +3,8 @@
 import { Switch as AriaSwitch } from "react-aria-components"
 import { useController, useFormContext } from "react-hook-form"
 
-import { InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./switch.module.css"
@@ -36,7 +37,7 @@ export default function Switch({
       <span className={styles.switch} tabIndex={0}></span>
       {fieldState.error ? (
         <Caption className={styles.error} fontOnly>
-          <InfoCircleIcon color="red" />
+          <MaterialIcon icon="info" color="Icon/Interactive/Accent" />
           {fieldState.error.message}
         </Caption>
       ) : null}
diff --git a/apps/scandic-web/components/TempDesignSystem/Form/TextArea/index.tsx b/apps/scandic-web/components/TempDesignSystem/Form/TextArea/index.tsx
index 24aa94478..997233b80 100644
--- a/apps/scandic-web/components/TempDesignSystem/Form/TextArea/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Form/TextArea/index.tsx
@@ -8,7 +8,8 @@ import {
 } from "react-aria-components"
 import { Controller, useFormContext } from "react-hook-form"
 
-import { CheckIcon, InfoCircleIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Label from "@/components/TempDesignSystem/Form/Label"
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
@@ -64,14 +65,14 @@ export default function TextArea({
           {helpText && !fieldState.error ? (
             <Caption asChild color="black">
               <Text className={styles.helpText} slot="description">
-                <CheckIcon height={20} width={30} />
+                <MaterialIcon icon="check" size={30} />
                 {helpText}
               </Text>
             </Caption>
           ) : null}
           {fieldState.error ? (
             <Caption className={styles.error} fontOnly>
-              <InfoCircleIcon color="red" />
+              <MaterialIcon icon="info" color="Icon/Interactive/Accent" />
               {fieldState.error.message}
             </Caption>
           ) : null}
diff --git a/apps/scandic-web/components/TempDesignSystem/LinkChips/Chip/index.tsx b/apps/scandic-web/components/TempDesignSystem/LinkChips/Chip/index.tsx
index d32dc1a53..14a9b3b7a 100644
--- a/apps/scandic-web/components/TempDesignSystem/LinkChips/Chip/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/LinkChips/Chip/index.tsx
@@ -1,6 +1,7 @@
 import Link from "next/link"
 
-import { ChevronRightSmallIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Caption from "@/components/TempDesignSystem/Text/Caption"
 
 import styles from "./chip.module.css"
@@ -12,7 +13,7 @@ export default function LinkChip({ url, title }: LinkChipProps) {
     <Caption type="bold" color="burgundy" asChild>
       <Link href={url} className={styles.linkChip}>
         {title}
-        <ChevronRightSmallIcon color="burgundy" width={20} height={20} />
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
       </Link>
     </Caption>
   )
diff --git a/apps/scandic-web/components/TempDesignSystem/LoyaltyCard/index.tsx b/apps/scandic-web/components/TempDesignSystem/LoyaltyCard/index.tsx
index fe26a51c7..b71e9e058 100644
--- a/apps/scandic-web/components/TempDesignSystem/LoyaltyCard/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/LoyaltyCard/index.tsx
@@ -1,4 +1,5 @@
-import ArrowRight from "@/components/Icons/ArrowRight"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
@@ -48,11 +49,11 @@ export default function LoyaltyCard({
             target={link.openInNewTab ? "_blank" : undefined}
             variant="underscored"
           >
-            <ArrowRight
-              color="burgundy"
+            <MaterialIcon
+              icon="arrow_right"
+              color="CurrentColor"
               className={styles.icon}
-              height="20"
-              width="20"
+              size={20}
             />
             {link.title}
           </Link>
diff --git a/apps/scandic-web/components/TempDesignSystem/MeetingRoomCard/index.tsx b/apps/scandic-web/components/TempDesignSystem/MeetingRoomCard/index.tsx
index c9baf8ff3..e6ead4041 100644
--- a/apps/scandic-web/components/TempDesignSystem/MeetingRoomCard/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/MeetingRoomCard/index.tsx
@@ -2,7 +2,8 @@
 import { useState } from "react"
 import { useIntl } from "react-intl"
 
-import { MeasureIcon, PersonIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Image from "@/components/Image"
 
 import Divider from "../Divider"
@@ -49,11 +50,18 @@ export default function MeetingRoomCard({ room }: MeetingRoomCardProps) {
         </Subtitle>
         <div className={styles.capacity}>
           <div className={styles.iconText}>
-            <MeasureIcon color="uiTextPlaceholder" />
+            <MaterialIcon
+              icon="straighten"
+              color="Icon/Interactive/Placeholder"
+            />
             <Caption color="uiTextPlaceholder">{room.size} m2</Caption>
           </div>
           <div className={styles.iconText}>
-            <PersonIcon color="uiTextPlaceholder" width={16} height={16} />
+            <MaterialIcon
+              icon="person"
+              color="Icon/Interactive/Placeholder"
+              size={16}
+            />
             <Caption color="uiTextPlaceholder">
               {intl.formatMessage(
                 { id: "max {seatings} pers" },
diff --git a/apps/scandic-web/components/TempDesignSystem/Popover/index.tsx b/apps/scandic-web/components/TempDesignSystem/Popover/index.tsx
index 2713e6a70..8ddb2fce5 100644
--- a/apps/scandic-web/components/TempDesignSystem/Popover/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Popover/index.tsx
@@ -6,7 +6,8 @@ import {
   Popover as RAPopover,
 } from "react-aria-components"
 
-import { CloseLargeIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import useSetOverFlowVisibleOnRA from "@/hooks/useSetOverflowVisibleOnRA"
 
 import { Arrow } from "./Arrow"
@@ -39,7 +40,7 @@ export default function Popover({
           {({ close }) => (
             <>
               <Button className={styles.closeButton} onPress={close}>
-                <CloseLargeIcon height={20} width={20} />
+                <MaterialIcon icon="close" size={20} />
               </Button>
               {children}
             </>
diff --git a/apps/scandic-web/components/TempDesignSystem/ShowMoreButton/index.tsx b/apps/scandic-web/components/TempDesignSystem/ShowMoreButton/index.tsx
index ac6069102..6284f3835 100644
--- a/apps/scandic-web/components/TempDesignSystem/ShowMoreButton/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/ShowMoreButton/index.tsx
@@ -2,7 +2,8 @@
 
 import { useIntl } from "react-intl"
 
-import { ChevronDownIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import Button from "@/components/TempDesignSystem/Button"
 
 import { showMoreButtonVariants } from "./variants"
@@ -52,7 +53,11 @@ export default function ShowMoreButton({
         fullWidth={intent ? true : false}
         size={intent && "small"}
       >
-        <ChevronDownIcon className={styles.icon} />
+        <MaterialIcon
+          icon="keyboard_arrow_down"
+          className={styles.icon}
+          color="CurrentColor"
+        />
         {showLess ? textShowLess : textShowMore}
       </Button>
     </div>
diff --git a/apps/scandic-web/components/TempDesignSystem/SidePeek/index.tsx b/apps/scandic-web/components/TempDesignSystem/SidePeek/index.tsx
index fc997e740..53e8ce600 100644
--- a/apps/scandic-web/components/TempDesignSystem/SidePeek/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/SidePeek/index.tsx
@@ -5,9 +5,9 @@ import { useContext, useRef } from "react"
 import { Dialog, Modal, ModalOverlay } from "react-aria-components"
 import { useIntl } from "react-intl"
 
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
 import { Typography } from "@scandic-hotels/design-system/Typography"
 
-import { CloseLargeIcon } from "@/components/Icons"
 import { SidePeekContext } from "@/components/SidePeeks/SidePeekProvider"
 
 import Button from "../Button"
@@ -69,7 +69,7 @@ function SidePeek({
                   intent="text"
                   onPress={onClose}
                 >
-                  <CloseLargeIcon color="burgundy" />
+                  <MaterialIcon icon="close" color="Icon/Interactive/Default" />
                 </Button>
               </header>
               <div className={styles.sidePeekContent}>{children}</div>
diff --git a/apps/scandic-web/components/TempDesignSystem/TeaserCard/Sidepeek/index.tsx b/apps/scandic-web/components/TempDesignSystem/TeaserCard/Sidepeek/index.tsx
index e9c3af6a4..f3abf3387 100644
--- a/apps/scandic-web/components/TempDesignSystem/TeaserCard/Sidepeek/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/TeaserCard/Sidepeek/index.tsx
@@ -2,7 +2,8 @@
 
 import { useState } from "react"
 
-import { ChevronRightSmallIcon } from "@/components/Icons"
+import { MaterialIcon } from "@scandic-hotels/design-system/Icons"
+
 import JsonToHtml from "@/components/JsonToHtml"
 import Button from "@/components/TempDesignSystem/Button"
 
@@ -31,7 +32,7 @@ export default function TeaserCardSidepeek({
         wrapping
       >
         {button.call_to_action_text}
-        <ChevronRightSmallIcon />
+        <MaterialIcon icon="chevron_right" size={20} color="CurrentColor" />
       </Button>
       <SidePeek
         title={heading}
diff --git a/apps/scandic-web/components/TempDesignSystem/Toasts/index.tsx b/apps/scandic-web/components/TempDesignSystem/Toasts/index.tsx
index a33cf64f5..115c76052 100644
--- a/apps/scandic-web/components/TempDesignSystem/Toasts/index.tsx
+++ b/apps/scandic-web/components/TempDesignSystem/Toasts/index.tsx
@@ -1,12 +1,9 @@
 import { type ExternalToast, toast as sonnerToast, Toaster } from "sonner"
 
 import {
-  CheckCircleIcon,
-  CloseLargeIcon,
-  CrossCircle,
-  InfoCircleIcon,
-  WarningTriangle,
-} from "@/components/Icons"
+  MaterialIcon,
+  type MaterialIconSetIconProps,
+} from "@scandic-hotels/design-system/Icons"
 
 import Button from "../Button"
 import Body from "../Text/Body"
@@ -20,27 +17,31 @@ export function ToastHandler() {
   return <Toaster position="bottom-right" duration={5000} />
 }
 
-function getIcon(variant: ToastsProps["variant"]) {
+interface AlertIconProps {
+  variant: ToastsProps["variant"]
+}
+function AlertIcon({
+  variant,
+  ...props
+}: AlertIconProps & MaterialIconSetIconProps) {
   switch (variant) {
     case "error":
-      return CrossCircle
+      return <MaterialIcon icon="cancel" {...props} />
     case "info":
-      return InfoCircleIcon
+      return <MaterialIcon icon="info" {...props} />
     case "success":
-      return CheckCircleIcon
+      return <MaterialIcon icon="check_circle" {...props} />
     case "warning":
-      return WarningTriangle
+      return <MaterialIcon icon="warning" {...props} />
   }
 }
 
 export function Toast({ children, message, onClose, variant }: ToastsProps) {
   const className = toastVariants({ variant })
-  const Icon = getIcon(variant)
+  const Icon = <AlertIcon variant={variant} color="Icon/Inverted" />
   return (
     <div className={className}>
-      <div className={styles.iconContainer}>
-        {Icon && <Icon color="white" height={24} width={24} />}
-      </div>
+      <div className={styles.iconContainer}>{Icon && Icon}</div>
       {message ? (
         <Body className={styles.message}>{message}</Body>
       ) : (
@@ -48,7 +49,7 @@ export function Toast({ children, message, onClose, variant }: ToastsProps) {
       )}
       {onClose ? (
         <Button onClick={onClose} variant="icon" intent="tertiary">
-          <CloseLargeIcon />
+          <MaterialIcon icon="close" />
         </Button>
       ) : null}
     </div>
diff --git a/apps/scandic-web/constants/booking.ts b/apps/scandic-web/constants/booking.tsx
similarity index 89%
rename from apps/scandic-web/constants/booking.ts
rename to apps/scandic-web/constants/booking.tsx
index 0c74ba5e4..47a278265 100644
--- a/apps/scandic-web/constants/booking.ts
+++ b/apps/scandic-web/constants/booking.tsx
@@ -1,15 +1,10 @@
 import {
-  ExtraBunkBedIcon,
-  ExtraPullOutBedIcon,
-  ExtraSofaBedIcon,
-  ExtraWallBedIcon,
-  KingBedIcon,
-  QueenBedIcon,
-  SingleBedIcon,
-  TwinBedsIcon,
-} from "@/components/Icons"
-
-import type { IconProps } from "@/types/components/icon"
+  type IconProps,
+  MaterialIcon,
+  MdiBunkBedIcon,
+  MovingBedsIcon,
+  WardIcon,
+} from "@scandic-hotels/design-system/Icons"
 
 export enum BookingStatusEnum {
   BookingCompleted = "BookingCompleted",
@@ -147,15 +142,15 @@ export const BED_TYPE_ICONS: Record<
   BedTypes,
   (props: IconProps) => JSX.Element
 > = {
-  King: KingBedIcon,
-  Queen: QueenBedIcon,
-  Single: SingleBedIcon,
-  Twin: TwinBedsIcon,
-  SofaBed: ExtraSofaBedIcon,
-  WallBed: ExtraWallBedIcon,
-  BunkBed: ExtraBunkBedIcon,
-  PullOutBed: ExtraPullOutBedIcon,
-  Other: SingleBedIcon,
+  King: () => <MaterialIcon icon="king_bed" />,
+  Queen: () => <MaterialIcon icon="bed" />,
+  Single: () => <MaterialIcon icon="single_bed" />,
+  Twin: () => <MaterialIcon icon="bed" />,
+  SofaBed: () => <MaterialIcon icon="chair" />,
+  WallBed: WardIcon,
+  BunkBed: MdiBunkBedIcon,
+  PullOutBed: MovingBedsIcon,
+  Other: () => <MaterialIcon icon="single_bed" />,
 }
 
 export enum CancellationRuleEnum {
diff --git a/apps/scandic-web/constants/routes/baseUrls.ts b/apps/scandic-web/constants/routes/baseUrls.ts
index f16619073..e2ef4027e 100644
--- a/apps/scandic-web/constants/routes/baseUrls.ts
+++ b/apps/scandic-web/constants/routes/baseUrls.ts
@@ -1,4 +1,4 @@
-import { LanguageSwitcherData } from "@/types/requests/languageSwitcher"
+import type { LanguageSwitcherData } from "@/types/requests/languageSwitcher"
 
 export const baseUrls: LanguageSwitcherData = {
   da: { url: "/da/" },
diff --git a/apps/scandic-web/middlewares/authRequired.ts b/apps/scandic-web/middlewares/authRequired.ts
index c0948cd6c..4384b1609 100644
--- a/apps/scandic-web/middlewares/authRequired.ts
+++ b/apps/scandic-web/middlewares/authRequired.ts
@@ -1,4 +1,4 @@
-import { NextResponse } from "next/server"
+import { type NextMiddleware, NextResponse } from "next/server"
 
 import { authRequired, mfaRequired } from "@/constants/routes/authRequired"
 import { login } from "@/constants/routes/handleAuth"
@@ -7,8 +7,6 @@ import { getInternalNextURL, getPublicNextURL } from "@/server/utils"
 import { auth } from "@/auth"
 import { findLang } from "@/utils/languages"
 
-import type { NextMiddleware } from "next/server"
-
 import type { MiddlewareMatcher } from "@/types/middleware"
 
 /**
diff --git a/apps/scandic-web/middlewares/currentWebLogin.ts b/apps/scandic-web/middlewares/currentWebLogin.ts
index 14fb89e67..a9fb98002 100644
--- a/apps/scandic-web/middlewares/currentWebLogin.ts
+++ b/apps/scandic-web/middlewares/currentWebLogin.ts
@@ -1,11 +1,9 @@
-import { NextResponse } from "next/server"
+import { type NextMiddleware, NextResponse } from "next/server"
 
 import { badRequest } from "@/server/errors/next"
 
 import { findLang } from "@/utils/languages"
 
-import type { NextMiddleware } from "next/server"
-
 import type { MiddlewareMatcher } from "@/types/middleware"
 
 export const middleware: NextMiddleware = (request) => {
diff --git a/apps/scandic-web/middlewares/currentWebLoginEmail.ts b/apps/scandic-web/middlewares/currentWebLoginEmail.ts
index 3f53417df..4aff277cb 100644
--- a/apps/scandic-web/middlewares/currentWebLoginEmail.ts
+++ b/apps/scandic-web/middlewares/currentWebLoginEmail.ts
@@ -1,11 +1,9 @@
-import { NextResponse } from "next/server"
+import { type NextMiddleware, NextResponse } from "next/server"
 
 import { badRequest } from "@/server/errors/next"
 
 import { findLang } from "@/utils/languages"
 
-import type { NextMiddleware } from "next/server"
-
 import type { MiddlewareMatcher } from "@/types/middleware"
 
 export const middleware: NextMiddleware = (request) => {
diff --git a/apps/scandic-web/middlewares/currentWebLogout.ts b/apps/scandic-web/middlewares/currentWebLogout.ts
index 2e52346a2..a60b04ada 100644
--- a/apps/scandic-web/middlewares/currentWebLogout.ts
+++ b/apps/scandic-web/middlewares/currentWebLogout.ts
@@ -1,13 +1,10 @@
-import { NextResponse } from "next/server"
+import { type NextMiddleware, NextResponse } from "next/server"
 
-import { env } from "@/env/server"
-import { badRequest, internalServerError } from "@/server/errors/next"
+import { badRequest } from "@/server/errors/next"
 import { getPublicURL } from "@/server/utils"
 
 import { findLang } from "@/utils/languages"
 
-import type { NextMiddleware } from "next/server"
-
 import type { MiddlewareMatcher } from "@/types/middleware"
 
 export const middleware: NextMiddleware = (request) => {
diff --git a/apps/scandic-web/middlewares/handleAuth.ts b/apps/scandic-web/middlewares/handleAuth.ts
index 44f127a89..c9264cd10 100644
--- a/apps/scandic-web/middlewares/handleAuth.ts
+++ b/apps/scandic-web/middlewares/handleAuth.ts
@@ -1,9 +1,7 @@
-import { NextResponse } from "next/server"
+import { type NextMiddleware, NextResponse } from "next/server"
 
 import { handleAuth } from "@/constants/routes/handleAuth"
 
-import type { NextMiddleware } from "next/server"
-
 import type { MiddlewareMatcher } from "@/types/middleware"
 
 export const middleware: NextMiddleware = () => {
diff --git a/apps/scandic-web/package.json b/apps/scandic-web/package.json
index e400eb5d1..e6b8222fe 100644
--- a/apps/scandic-web/package.json
+++ b/apps/scandic-web/package.json
@@ -126,8 +126,10 @@
     "jiti": "^1.21.0",
     "json-sort-cli": "^4.0.4",
     "lint-staged": "^15.2.2",
+    "material-symbols": "^0.29.0",
     "netlify-plugin-cypress": "^2.2.1",
     "prettier": "^3.2.5",
+    "react-material-symbols": "^4.4.0",
     "schema-dts": "^1.1.2",
     "start-server-and-test": "^2.0.3",
     "ts-node": "^10.9.2",
diff --git a/apps/scandic-web/server/routers/contentstack/base/output.ts b/apps/scandic-web/server/routers/contentstack/base/output.ts
index 990a0c762..5c6a5ea4c 100644
--- a/apps/scandic-web/server/routers/contentstack/base/output.ts
+++ b/apps/scandic-web/server/routers/contentstack/base/output.ts
@@ -15,11 +15,11 @@ import {
   transformPageLinkRef,
 } from "@/server/routers/contentstack/schemas/pageLinks"
 
+import { IconName } from "@/components/Icons/iconName"
 import { removeMultipleSlashes } from "@/utils/url"
 
 import { systemSchema } from "../schemas/system"
 
-import { IconName } from "@/types/components/icon"
 import { AlertTypeEnum } from "@/types/enums/alert"
 import type { Image } from "@/types/image"
 
@@ -155,6 +155,7 @@ export interface GetCurrentHeaderData
   extends z.input<typeof validateCurrentHeaderConfigSchema> {}
 export type HeaderData = z.output<typeof validateCurrentHeaderConfigSchema>
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const validateCurrentHeaderRefConfigSchema = z.object({
   all_current_header: z.object({
     items: z.array(
@@ -277,6 +278,7 @@ export type CurrentFooterData = Omit<
   logo: Image
 }
 
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 const validateCurrentFooterRefConfigSchema = z.object({
   all_current_footer: z.object({
     items: z.array(
diff --git a/apps/scandic-web/types/components/cardImage.ts b/apps/scandic-web/types/components/cardImage.ts
index 229299d9c..7e00159e5 100644
--- a/apps/scandic-web/types/components/cardImage.ts
+++ b/apps/scandic-web/types/components/cardImage.ts
@@ -1,6 +1,5 @@
-import { FacilityCard, FacilityImage } from "./hotelPage/facilities"
-
 import type { CardProps } from "@/components/TempDesignSystem/Card/card"
+import type { FacilityCard, FacilityImage } from "./hotelPage/facilities"
 
 export interface CardImageProps extends React.HTMLAttributes<HTMLDivElement> {
   card: FacilityCard | CardProps
diff --git a/apps/scandic-web/types/components/current/footer.ts b/apps/scandic-web/types/components/current/footer.ts
index af23be555..426ed796d 100644
--- a/apps/scandic-web/types/components/current/footer.ts
+++ b/apps/scandic-web/types/components/current/footer.ts
@@ -1,4 +1,4 @@
-import { NavigationItem } from "@/server/routers/contentstack/base/output"
+import type { NavigationItem } from "@/server/routers/contentstack/base/output"
 
 export type FooterNavigationProps = {
   linkGroups: NavigationItem[]
diff --git a/apps/scandic-web/types/components/current/header/mainMenu.ts b/apps/scandic-web/types/components/current/header/mainMenu.ts
index f4c0ce2db..55e4e362b 100644
--- a/apps/scandic-web/types/components/current/header/mainMenu.ts
+++ b/apps/scandic-web/types/components/current/header/mainMenu.ts
@@ -3,7 +3,7 @@ import type {
   CurrentHeaderLink,
   TopMenuHeaderLink,
 } from "@/types/requests/currentHeader"
-import { User } from "@/types/user"
+import type { User } from "@/types/user"
 
 export type MainMenuProps = {
   frontpageLinkText: string
diff --git a/apps/scandic-web/types/components/footer/footer.ts b/apps/scandic-web/types/components/footer/footer.ts
index a40443e0d..8dd4f507a 100644
--- a/apps/scandic-web/types/components/footer/footer.ts
+++ b/apps/scandic-web/types/components/footer/footer.ts
@@ -1,6 +1,6 @@
-import { z } from "zod"
+import type { z } from "zod"
 
-import {
+import type {
   validateFooterConfigSchema,
   validateFooterRefConfigSchema,
   validateLinkItem,
diff --git a/apps/scandic-web/types/components/footer/socialIcons.ts b/apps/scandic-web/types/components/footer/socialIcons.ts
index 83c7b82ba..b528d1037 100644
--- a/apps/scandic-web/types/components/footer/socialIcons.ts
+++ b/apps/scandic-web/types/components/footer/socialIcons.ts
@@ -1,3 +1,5 @@
+import type { IconName } from "@/components/Icons/iconName"
+
 export type SocialIconsProps = {
-  iconName: string
+  iconName: IconName
 }
diff --git a/apps/scandic-web/types/components/header/headerLink.ts b/apps/scandic-web/types/components/header/headerLink.ts
index 9847c4295..0da0fe649 100644
--- a/apps/scandic-web/types/components/header/headerLink.ts
+++ b/apps/scandic-web/types/components/header/headerLink.ts
@@ -1,6 +1,6 @@
 import type { LinkProps } from "next/link"
 
-import type { IconName } from "../icon"
+import type { IconName } from "@/components/Icons/iconName"
 
 export interface HeaderLinkProps extends React.PropsWithChildren {
   href: LinkProps["href"]
diff --git a/apps/scandic-web/types/components/hotelLogo.ts b/apps/scandic-web/types/components/hotelLogo.ts
deleted file mode 100644
index 616ee3703..000000000
--- a/apps/scandic-web/types/components/hotelLogo.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import type { Hotel } from "@/types/hotel"
-
-export type HotelLogoProps = {
-  hotelId: Hotel["operaId"]
-  hotelType: Hotel["hotelType"]
-}
diff --git a/apps/scandic-web/types/components/hotelReservation/selectRate/hotelSelectionHeader.ts b/apps/scandic-web/types/components/hotelReservation/selectRate/hotelSelectionHeader.ts
index 9804e0424..5384723d9 100644
--- a/apps/scandic-web/types/components/hotelReservation/selectRate/hotelSelectionHeader.ts
+++ b/apps/scandic-web/types/components/hotelReservation/selectRate/hotelSelectionHeader.ts
@@ -1,4 +1,4 @@
-import { Hotel } from "@/types/hotel"
+import type { Hotel } from "@/types/hotel"
 
 export type HotelSelectionHeaderProps = {
   hotel: Hotel
diff --git a/apps/scandic-web/types/components/myPages/friend.ts b/apps/scandic-web/types/components/myPages/friend.ts
index d7b3ec28f..acb93c2f5 100644
--- a/apps/scandic-web/types/components/myPages/friend.ts
+++ b/apps/scandic-web/types/components/myPages/friend.ts
@@ -1,4 +1,4 @@
-import { User } from "@/types/user"
+import type { User } from "@/types/user"
 
 export interface FriendProps
   extends React.PropsWithChildren<Pick<User, "membership" | "name">> {}
diff --git a/apps/scandic-web/types/components/myPages/membershipNumber.ts b/apps/scandic-web/types/components/myPages/membershipNumber.ts
index 75c904b9c..cdd8c81c8 100644
--- a/apps/scandic-web/types/components/myPages/membershipNumber.ts
+++ b/apps/scandic-web/types/components/myPages/membershipNumber.ts
@@ -1,8 +1,7 @@
-import { VariantProps } from "class-variance-authority"
-
-import { membershipNumberVariants } from "@/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/membershipNumberVariants"
+import type { VariantProps } from "class-variance-authority"
 
 import type { User } from "@/types/user"
+import type { membershipNumberVariants } from "@/components/Blocks/DynamicContent/Overview/Friend/MembershipNumber/membershipNumberVariants"
 
 export interface MembershipNumberProps
   extends Omit<React.HTMLAttributes<HTMLDivElement>, "color">,
diff --git a/apps/scandic-web/types/components/myPages/rewards.ts b/apps/scandic-web/types/components/myPages/rewards.ts
index f27128de2..e24856a3e 100644
--- a/apps/scandic-web/types/components/myPages/rewards.ts
+++ b/apps/scandic-web/types/components/myPages/rewards.ts
@@ -3,7 +3,8 @@ import {
   type REWARD_IDS,
 } from "@/constants/rewards"
 
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from "@scandic-hotels/design-system/Icons"
+
 import type {
   ApiReward,
   BenefitReward,
@@ -13,9 +14,9 @@ import type {
 
 export type { BaseReward, Campaign, Reward, Surprise, Tier }
 
-export interface RewardIconProps extends IconProps {
+export interface RewardIconProps extends LogoAndIllustrationProps {
   rewardId: string
-  size?: "small" | "medium" | "large"
+  iconSize?: "small" | "medium" | "large"
 }
 
 export type RewardId = (typeof REWARD_IDS)[keyof typeof REWARD_IDS]
diff --git a/apps/scandic-web/types/components/myPages/stays/page.ts b/apps/scandic-web/types/components/myPages/stays/page.ts
index 295ea7539..b4e997f2e 100644
--- a/apps/scandic-web/types/components/myPages/stays/page.ts
+++ b/apps/scandic-web/types/components/myPages/stays/page.ts
@@ -1,4 +1,4 @@
-import { Stay } from "@/server/routers/user/output"
+import type { Stay } from "@/server/routers/user/output"
 
 export type Page = {
   data: Stay[]
diff --git a/apps/scandic-web/types/components/myPages/user.ts b/apps/scandic-web/types/components/myPages/user.ts
index 8a4aa0e4d..825c0a42c 100644
--- a/apps/scandic-web/types/components/myPages/user.ts
+++ b/apps/scandic-web/types/components/myPages/user.ts
@@ -1,6 +1,5 @@
-import { userQueryRouter } from "@/server/routers/user/query"
-
 import type { User } from "@/types/user"
+import type { userQueryRouter } from "@/server/routers/user/query"
 
 export type UserQueryRouter = typeof userQueryRouter
 
diff --git a/apps/scandic-web/types/components/teaserCard.ts b/apps/scandic-web/types/components/teaserCard.ts
index 5cb7dd01a..14d62ca17 100644
--- a/apps/scandic-web/types/components/teaserCard.ts
+++ b/apps/scandic-web/types/components/teaserCard.ts
@@ -1,9 +1,8 @@
-import { VariantProps } from "class-variance-authority"
-
-import { teaserCardVariants } from "@/components/TempDesignSystem/TeaserCard/variants"
+import type { VariantProps } from "class-variance-authority"
 
 import type { ImageVaultAsset } from "@/types/components/imageVault"
 import type { CardProps } from "@/components/TempDesignSystem/Card/card"
+import type { teaserCardVariants } from "@/components/TempDesignSystem/TeaserCard/variants"
 import type { TeaserCard } from "../trpc/routers/contentstack/blocks"
 
 interface SidePeekButton {
diff --git a/apps/scandic-web/types/enums/uspGrid.ts b/apps/scandic-web/types/enums/uspGrid.ts
index e5f45dbdc..09eb3353c 100644
--- a/apps/scandic-web/types/enums/uspGrid.ts
+++ b/apps/scandic-web/types/enums/uspGrid.ts
@@ -1,6 +1,6 @@
 import { z } from "zod"
 
-import { IconName } from "../components/icon"
+import { IconName } from "@/components/Icons/iconName"
 
 export namespace UspGridEnum {
   export const enum icons {
diff --git a/apps/scandic-web/types/jwt.d.ts b/apps/scandic-web/types/jwt.d.ts
index f0aecc2c1..d8cf97543 100644
--- a/apps/scandic-web/types/jwt.d.ts
+++ b/apps/scandic-web/types/jwt.d.ts
@@ -1,8 +1,7 @@
-import { LoginType } from "./components/tracking"
-
 import type { DefaultJWT } from "next-auth/jwt"
 
 import type { RefreshTokenError } from "./authError"
+import type { LoginType } from "./components/tracking"
 
 // Module augmentation
 // https://authjs.dev/getting-started/typescript#popular-interfaces-to-augment
diff --git a/apps/scandic-web/types/requests/myPages/breadcrumbs.ts b/apps/scandic-web/types/requests/myPages/breadcrumbs.ts
index e2be8b8a8..b24500e40 100644
--- a/apps/scandic-web/types/requests/myPages/breadcrumbs.ts
+++ b/apps/scandic-web/types/requests/myPages/breadcrumbs.ts
@@ -1,5 +1,4 @@
-import { Lang } from "@/constants/languages"
-
+import type { Lang } from "@/constants/languages"
 import type { System } from "../system"
 import type { AllRequestResponse } from "../utils/all"
 import type { Edges } from "../utils/edges"
diff --git a/apps/scandic-web/types/routes.ts b/apps/scandic-web/types/routes.ts
index a2d25c8bc..17acc1eaa 100644
--- a/apps/scandic-web/types/routes.ts
+++ b/apps/scandic-web/types/routes.ts
@@ -1,3 +1,3 @@
-import { Lang } from "@/constants/languages"
+import type { Lang } from "@/constants/languages"
 
 export type LangRoute = Record<Lang, string>
diff --git a/apps/scandic-web/types/trpc/routers/contentstack/breadcrumbs.ts b/apps/scandic-web/types/trpc/routers/contentstack/breadcrumbs.ts
index 78aa29b05..e9ebfa773 100644
--- a/apps/scandic-web/types/trpc/routers/contentstack/breadcrumbs.ts
+++ b/apps/scandic-web/types/trpc/routers/contentstack/breadcrumbs.ts
@@ -1,6 +1,6 @@
-import { z } from "zod"
+import type { z } from "zod"
 
-import {
+import type {
   breadcrumbsRefsSchema,
   breadcrumbsSchema,
   rawBreadcrumbsDataSchema,
diff --git a/apps/scandic-web/types/trpc/routers/contentstack/collectionPage.ts b/apps/scandic-web/types/trpc/routers/contentstack/collectionPage.ts
index f1936fac9..3cffd6e05 100644
--- a/apps/scandic-web/types/trpc/routers/contentstack/collectionPage.ts
+++ b/apps/scandic-web/types/trpc/routers/contentstack/collectionPage.ts
@@ -1,6 +1,6 @@
-import { z } from "zod"
+import type { z } from "zod"
 
-import {
+import type {
   blocksSchema,
   collectionPageRefsSchema,
   collectionPageSchema,
diff --git a/apps/scandic-web/types/trpc/routers/contentstack/footer.ts b/apps/scandic-web/types/trpc/routers/contentstack/footer.ts
index 23c3b7084..4baee7f73 100644
--- a/apps/scandic-web/types/trpc/routers/contentstack/footer.ts
+++ b/apps/scandic-web/types/trpc/routers/contentstack/footer.ts
@@ -1,6 +1,6 @@
-import { z } from "zod"
+import type { z } from "zod"
 
-import {
+import type {
   validateLinkItem,
   validateLinksWithType,
   validateSecondaryLinks,
diff --git a/apps/scandic-web/types/trpc/routers/contentstack/header.ts b/apps/scandic-web/types/trpc/routers/contentstack/header.ts
index a28c3114e..ec4bf4626 100644
--- a/apps/scandic-web/types/trpc/routers/contentstack/header.ts
+++ b/apps/scandic-web/types/trpc/routers/contentstack/header.ts
@@ -1,6 +1,6 @@
-import { z } from "zod"
+import type { z } from "zod"
 
-import {
+import type {
   headerRefsSchema,
   headerSchema,
   menuItemSchema,
diff --git a/apps/scandic-web/utils/imageVault.ts b/apps/scandic-web/utils/imageVault.ts
index 5336dfbe7..e67e23864 100644
--- a/apps/scandic-web/utils/imageVault.ts
+++ b/apps/scandic-web/utils/imageVault.ts
@@ -1,4 +1,4 @@
-import {
+import type {
   ImageVaultAsset,
   ImageVaultAssetResponse,
 } from "@/types/components/imageVault"
diff --git a/apps/scandic-web/utils/webviews.ts b/apps/scandic-web/utils/webviews.ts
index 735600cbb..7aebb4ca1 100644
--- a/apps/scandic-web/utils/webviews.ts
+++ b/apps/scandic-web/utils/webviews.ts
@@ -2,9 +2,10 @@ import "server-only"
 
 import { headers } from "next/headers"
 
-import { Lang } from "@/constants/languages"
 import { webviews } from "@/constants/routes/webviews"
 
+import type { Lang } from "@/constants/languages"
+
 export function webviewSearchParams() {
   const searchParams = new URLSearchParams()
   const loginType = headers().get("loginType")
diff --git a/packages/design-system/lib/components/ChipButton/ChipButton.stories.tsx b/packages/design-system/lib/components/ChipButton/ChipButton.stories.tsx
index cbad8195a..055ddb5ff 100644
--- a/packages/design-system/lib/components/ChipButton/ChipButton.stories.tsx
+++ b/packages/design-system/lib/components/ChipButton/ChipButton.stories.tsx
@@ -3,7 +3,7 @@ import type { Meta, StoryObj } from '@storybook/react'
 import { fn } from '@storybook/test'
 
 import { ChipButton } from './ChipButton.tsx'
-import ChevronRightSmallIcon from '../Icons/ChevronRightSmall.tsx'
+import { MaterialSymbol } from 'react-material-symbols'
 
 const meta: Meta<typeof ChipButton> = {
   title: 'Components/Chip/ChipButton 🚧',
@@ -26,7 +26,8 @@ export const Default: Story = {
     onPress: fn(),
     children: (
       <>
-        Button Chip <ChevronRightSmallIcon width={20} height={20} />
+        Button Chip
+        <MaterialSymbol icon="chevron_right" size={20} />
       </>
     ),
   },
diff --git a/packages/design-system/lib/components/ChipLink/ChipLink.stories.tsx b/packages/design-system/lib/components/ChipLink/ChipLink.stories.tsx
index 3cc3313d1..a18688bfb 100644
--- a/packages/design-system/lib/components/ChipLink/ChipLink.stories.tsx
+++ b/packages/design-system/lib/components/ChipLink/ChipLink.stories.tsx
@@ -1,7 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/react'
 
 import { ChipLink } from './ChipLink.tsx'
-import ChevronRightSmallIcon from '../Icons/ChevronRightSmall.tsx'
+import { MaterialIcon } from '../Icons/MaterialIcon'
 
 const meta: Meta<typeof ChipLink> = {
   title: 'Components/Chip/ChipLInk 🚧',
@@ -18,7 +18,8 @@ export const Default: Story = {
     onClick: (e) => e.preventDefault(),
     children: (
       <>
-        Link Chip <ChevronRightSmallIcon width={20} height={20} />
+        Link Chip
+        <MaterialIcon icon="chevron_right" size={20} />
       </>
     ),
   },
diff --git a/packages/design-system/lib/components/Icons/CheckCircle.tsx b/packages/design-system/lib/components/Icons/CheckCircle.tsx
deleted file mode 100644
index 654be6283..000000000
--- a/packages/design-system/lib/components/Icons/CheckCircle.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { SVGProps } from 'react'
-
-export default function CheckCircleIcon(props: SVGProps<SVGSVGElement>) {
-  return (
-    <svg
-      fill="none"
-      viewBox="0 0 32 32"
-      xmlns="http://www.w3.org/2000/svg"
-      {...props}
-    >
-      <path
-        d="M14.6667 18.4333L11.8148 15.5814C11.5716 15.3383 11.2778 15.2167 10.9333 15.2167C10.5889 15.2167 10.2944 15.3389 10.05 15.5833C9.80556 15.8278 9.68333 16.1222 9.68333 16.4667C9.68333 16.8111 9.8036 17.1036 10.0441 17.3441L13.7833 21.0833C14.0348 21.3389 14.3283 21.4667 14.6636 21.4667C14.999 21.4667 15.2944 21.3389 15.55 21.0833L22.95 13.6833C23.1944 13.4389 23.3167 13.1444 23.3167 12.8C23.3167 12.4556 23.1944 12.1611 22.95 11.9167C22.7056 11.6722 22.4111 11.55 22.0667 11.55C21.7222 11.55 21.4292 11.6708 21.1877 11.9123L14.6667 18.4333ZM16.5 29C14.7021 29 13.0125 28.6582 11.4312 27.9746C9.84986 27.2909 8.47433 26.3632 7.3046 25.1912C6.13487 24.0193 5.20833 22.6435 4.525 21.0638C3.84167 19.484 3.5 17.7961 3.5 16C3.5 14.2021 3.84181 12.5125 4.52543 10.9312C5.20906 9.34986 6.13683 7.97433 7.30877 6.8046C8.4807 5.63487 9.85652 4.70833 11.4362 4.025C13.016 3.34167 14.7039 3 16.5 3C18.2979 3 19.9875 3.34181 21.5688 4.02543C23.1501 4.70906 24.5257 5.63683 25.6954 6.80877C26.8651 7.9807 27.7917 9.35652 28.475 10.9362C29.1583 12.516 29.5 14.2039 29.5 16C29.5 17.7979 29.1582 19.4875 28.4746 21.0688C27.7909 22.6501 26.8632 24.0257 25.6912 25.1954C24.5193 26.3651 23.1435 27.2917 21.5638 27.975C19.984 28.6583 18.2961 29 16.5 29Z"
-        fill="currentColor"
-      />
-    </svg>
-  )
-}
diff --git a/packages/design-system/lib/components/Icons/ChevronRightSmall.tsx b/packages/design-system/lib/components/Icons/ChevronRightSmall.tsx
deleted file mode 100644
index 3ac52cf75..000000000
--- a/packages/design-system/lib/components/Icons/ChevronRightSmall.tsx
+++ /dev/null
@@ -1,16 +0,0 @@
-export default function ChevronRightSmallIcon(
-  props: React.SVGAttributes<HTMLOrSVGElement>
-) {
-  return (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width="24"
-      height="24"
-      viewBox="0 0 24 24"
-      fill="currentColor"
-      {...props}
-    >
-      <path d="M12.65 12L8.77495 8.12497C8.59995 7.94997 8.51245 7.73538 8.51245 7.48122C8.51245 7.22705 8.59995 7.0083 8.77495 6.82497C8.94995 6.64163 9.16662 6.54788 9.42495 6.54372C9.68328 6.53955 9.90412 6.62913 10.0875 6.81247L14.6125 11.3375C14.7041 11.4291 14.7729 11.5312 14.8187 11.6437C14.8645 11.7562 14.8875 11.875 14.8875 12C14.8875 12.125 14.8645 12.2437 14.8187 12.3562C14.7729 12.4687 14.7041 12.5708 14.6125 12.6625L10.0875 17.1875C9.90412 17.3708 9.68328 17.4604 9.42495 17.4562C9.16662 17.4521 8.94995 17.3583 8.77495 17.175C8.59995 16.9916 8.51245 16.7729 8.51245 16.5187C8.51245 16.2646 8.59995 16.05 8.77495 15.875L12.65 12Z" />
-    </svg>
-  )
-}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/BedHotel.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/BedHotel.tsx
new file mode 100644
index 000000000..2e5edb99b
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/BedHotel.tsx
@@ -0,0 +1,37 @@
+import type { IconProps } from '../../icon'
+import { iconVariants } from '../../variants'
+
+export default function BedHotelIcon({
+  className,
+  color,
+  size = 24,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M1.9375 22.4618C1.67917 22.4618 1.45833 22.3702 1.275 22.1868C1.09167 22.0035 1 21.7826 1 21.5243V8.79932C1 8.54098 1.09167 8.32015 1.275 8.13682C1.45833 7.95348 1.67917 7.86182 1.9375 7.86182C2.19583 7.86182 2.41667 7.95348 2.6 8.13682C2.78333 8.32015 2.875 8.54098 2.875 8.79932V17.6118H10.825V11.7118C10.825 11.1962 11.0086 10.7548 11.3758 10.3876C11.743 10.0204 12.1844 9.83682 12.7 9.83682H18.65C19.7167 9.83682 20.625 10.2118 21.375 10.9618C22.125 11.7118 22.5 12.6202 22.5 13.6868V21.5243C22.5 21.7826 22.4083 22.0035 22.225 22.1868C22.0417 22.3702 21.8208 22.4618 21.5625 22.4618C21.3042 22.4618 21.0833 22.3702 20.9 22.1868C20.7167 22.0035 20.625 21.7826 20.625 21.5243V19.4868H2.875V21.5243C2.875 21.7826 2.78333 22.0035 2.6 22.1868C2.41667 22.3702 2.19583 22.4618 1.9375 22.4618ZM12.7 17.6118H20.625V13.6844C20.625 13.1443 20.431 12.6806 20.043 12.2931C19.655 11.9056 19.1886 11.7118 18.6438 11.7118H12.7V17.6118Z"
+        fill="#26201E"
+      />
+      <path
+        d="M5.24998 15.4869C5.64164 15.8785 6.11248 16.0744 6.66248 16.0744C7.21248 16.0744 7.68331 15.8785 8.07498 15.4869C8.46664 15.0952 8.66248 14.6244 8.66248 14.0744C8.66248 13.5244 8.46664 13.0535 8.07498 12.6619C7.68331 12.2702 7.21248 12.0744 6.66248 12.0744C6.11248 12.0744 5.64164 12.2702 5.24998 12.6619C4.85831 13.0535 4.66248 13.5244 4.66248 14.0744C4.66248 14.6244 4.85831 15.0952 5.24998 15.4869Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M9.46429 5.96429H10.7857V7.28571C10.7857 7.54911 10.8821 7.78088 11.0685 7.96725C11.2548 8.15363 11.4866 8.25 11.75 8.25C12.0134 8.25 12.2452 8.15363 12.4315 7.96725C12.6179 7.78088 12.7143 7.54911 12.7143 7.28571V5.96429H14.0357C14.2991 5.96429 14.5309 5.86791 14.7173 5.68154C14.9036 5.49516 15 5.2634 15 5C15 4.7366 14.9036 4.50484 14.7173 4.31846C14.5309 4.13209 14.2991 4.03571 14.0357 4.03571H12.7143V2.71429C12.7143 2.45089 12.6179 2.21912 12.4315 2.03275C12.2452 1.84637 12.0134 1.75 11.75 1.75C11.4866 1.75 11.2548 1.84637 11.0685 2.03275C10.8821 2.21912 10.7857 2.45089 10.7857 2.71429V4.03571H9.46429C9.20089 4.03571 8.96912 4.13209 8.78275 4.31846C8.59637 4.50484 8.5 4.7366 8.5 5C8.5 5.2634 8.59637 5.49516 8.78275 5.68154C8.96912 5.86791 9.20089 5.96429 9.46429 5.96429Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Cooling.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Cooling.tsx
new file mode 100644
index 000000000..8ca1e35f4
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Cooling.tsx
@@ -0,0 +1,32 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function CoolingIcon({
+  className,
+  color,
+  size,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={24}
+      height={24}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M4.125 21.75C3.60937 21.75 3.16796 21.5664 2.80077 21.1992C2.43359 20.832 2.25 20.3906 2.25 19.875V4.125C2.25 3.60937 2.43359 3.16796 2.80077 2.80078C3.16796 2.43359 3.60937 2.25 4.125 2.25H19.875C20.3906 2.25 20.832 2.43359 21.1992 2.80078C21.5664 3.16796 21.75 3.60937 21.75 4.125V19.875C21.75 20.3906 21.5664 20.832 21.1992 21.1992C20.832 21.5664 20.3906 21.75 19.875 21.75H4.125ZM4.125 19.875H19.875V4.125H4.125V19.875Z"
+        fill="#26201E"
+      />
+      <path
+        d="M11.434 15.3113L9.97658 16.7404C9.87282 16.8442 9.74311 16.8961 9.58746 16.8961C9.43182 16.8961 9.30211 16.8395 9.19834 16.7263C9.08515 16.6225 9.02855 16.4928 9.02855 16.3372C9.02855 16.1815 9.08515 16.0471 9.19834 15.9339L11.434 13.6982V12.5662H10.302L8.05221 14.8161C7.94845 14.9198 7.81874 14.9717 7.66309 14.9717C7.50744 14.9717 7.37302 14.9151 7.25982 14.8019C7.15606 14.6981 7.10418 14.5684 7.10418 14.4128C7.10418 14.2571 7.15606 14.1274 7.25982 14.0237L8.68895 12.5662H6.89193C6.73157 12.5662 6.5995 12.512 6.49574 12.4035C6.39197 12.295 6.34009 12.1606 6.34009 12.0002C6.34009 11.8399 6.39433 11.7055 6.50281 11.597C6.61129 11.4885 6.74572 11.4343 6.90608 11.4343H8.68895L7.25982 9.99098C7.15606 9.88721 7.10418 9.7575 7.10418 9.60186C7.10418 9.44621 7.16078 9.31179 7.27397 9.19859C7.37774 9.09482 7.50744 9.04294 7.66309 9.04294C7.81874 9.04294 7.95316 9.09482 8.06636 9.19859L10.302 11.4343H11.434V10.3023L9.18419 8.06661C9.08043 7.96284 9.02855 7.83313 9.02855 7.67749C9.02855 7.52184 9.08515 7.38742 9.19834 7.27422C9.30211 7.17045 9.43182 7.11857 9.58746 7.11857C9.74311 7.11857 9.87282 7.17045 9.97658 7.27422L11.434 8.6892V6.90632C11.434 6.74596 11.4883 6.61154 11.5967 6.50305C11.7052 6.39457 11.8396 6.34033 12 6.34033C12.1604 6.34033 12.2948 6.39457 12.4033 6.50305C12.5118 6.61154 12.566 6.74596 12.566 6.90632V8.6892L14.0093 7.27422C14.113 7.17045 14.2427 7.11857 14.3984 7.11857C14.554 7.11857 14.6885 7.17045 14.8017 7.27422C14.9054 7.38742 14.9573 7.52184 14.9573 7.67749C14.9573 7.83313 14.9054 7.96284 14.8017 8.06661L12.566 10.3023V11.4343H13.698L15.9336 9.19859C16.0374 9.09482 16.1671 9.04294 16.3228 9.04294C16.4784 9.04294 16.6128 9.09954 16.726 9.21274C16.8298 9.3165 16.8817 9.44621 16.8817 9.60186C16.8817 9.7575 16.8298 9.88721 16.726 9.99098L15.311 11.4343H17.0939C17.2543 11.4343 17.3887 11.4885 17.4972 11.597C17.6057 11.7055 17.6599 11.8399 17.6599 12.0002C17.6599 12.1606 17.6057 12.295 17.4972 12.4035C17.3887 12.512 17.2543 12.5662 17.0939 12.5662H15.311L16.726 14.0237C16.8298 14.1274 16.8817 14.2571 16.8817 14.4128C16.8817 14.5684 16.8298 14.6981 16.726 14.8019C16.6128 14.9151 16.4784 14.9717 16.3228 14.9717C16.1671 14.9717 16.0374 14.9151 15.9336 14.8019L13.698 12.5662H12.566V13.6982L14.8017 15.948C14.9054 16.0518 14.9573 16.1815 14.9573 16.3372C14.9573 16.4928 14.9007 16.6272 14.7875 16.7404C14.6837 16.8442 14.554 16.8961 14.3984 16.8961C14.2427 16.8961 14.113 16.8442 14.0093 16.7404L12.566 15.3113V17.1083C12.566 17.2687 12.5118 17.4007 12.4033 17.5045C12.2948 17.6083 12.1604 17.6602 12 17.6602C11.8396 17.6602 11.7052 17.6059 11.5967 17.4974C11.4883 17.389 11.434 17.2545 11.434 17.0942V15.3113Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/CouchTable.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/CouchTable.tsx
new file mode 100644
index 000000000..79f0e3190
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/CouchTable.tsx
@@ -0,0 +1,32 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function CouchTableIcon({
+  className,
+  color,
+  size = 24,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        d="M4 19C3.15 19 2.4375 18.7125 1.8625 18.1375C1.2875 17.5625 1 16.85 1 16V13.5C1 12.95 1.18333 12.4375 1.55 11.9625C1.91667 11.4875 2.4 11.2 3 11.1V9C3 8.45 3.19583 7.97917 3.5875 7.5875C3.97917 7.19583 4.45 7 5 7H13C13.55 7 14.0208 7.19583 14.4125 7.5875C14.8042 7.97917 15 8.45 15 9V11.1C15.6 11.2 16.0833 11.475 16.45 11.925C16.8167 12.375 17 12.9 17 13.5V16C17 16.85 16.7125 17.5625 16.1375 18.1375C15.5625 18.7125 14.85 19 14 19H4ZM5 9V11.5C5.3 11.75 5.54167 12.0458 5.725 12.3875C5.90833 12.7292 6 13.1 6 13.5V14H12V13.5C12 13.1 12.0917 12.7292 12.275 12.3875C12.4583 12.0458 12.7 11.75 13 11.5V9H5ZM4 17H14C14.3 17 14.5417 16.8958 14.725 16.6875C14.9083 16.4792 15 16.25 15 16V13.5C15 13.35 14.9542 13.2292 14.8625 13.1375C14.7708 13.0458 14.65 13 14.5 13C14.35 13 14.2292 13.0458 14.1375 13.1375C14.0458 13.2292 14 13.35 14 13.5V16H4V13.5C4 13.35 3.95417 13.2292 3.8625 13.1375C3.77083 13.0458 3.65 13 3.5 13C3.35 13 3.22917 13.0458 3.1375 13.1375C3.04583 13.2292 3 13.35 3 13.5V16C3 16.25 3.09167 16.4792 3.275 16.6875C3.45833 16.8958 3.7 17 4 17Z"
+        fill="#26201E"
+      />
+      <path
+        d="M21 13.8665V19H19V13.885L16.824 13.8963C16.349 13.8988 15.9627 13.5144 15.9627 13.0394C15.9627 12.567 16.3451 12.1836 16.8176 12.1826L21.9997 12.1707C22.4688 12.1696 22.8496 12.5495 22.8496 13.0186C22.8496 13.4869 22.47 13.8665 22.0017 13.8665H21Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/FootStool.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/FootStool.tsx
new file mode 100644
index 000000000..d00d1d69f
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/FootStool.tsx
@@ -0,0 +1,28 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function FootStoolIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        d="M3.22498 19.8125V9.9444C3.22498 9.40648 3.41456 8.95211 3.79373 8.58127C4.17289 8.21044 4.63183 8.02502 5.17053 8.02502C14.294 8.02502 15.676 8.02502 18.8294 8.02502C19.3681 8.02502 19.8271 8.21044 20.2062 8.58127C20.5854 8.95211 20.775 9.40648 20.775 9.9444V19.8125C20.775 20.0709 20.6833 20.2917 20.5 20.475C20.3166 20.6584 20.0958 20.75 19.8375 20.75C19.5791 20.75 19.3583 20.6584 19.175 20.475C18.9916 20.2917 18.9 20.0709 18.9 19.8125V14.8H5.09998V19.8125C5.09998 20.0709 5.00831 20.2917 4.82498 20.475C4.64164 20.6584 4.42081 20.75 4.16248 20.75C3.90414 20.75 3.68331 20.6584 3.49998 20.475C3.31664 20.2917 3.22498 20.0709 3.22498 19.8125ZM5.09998 12.925H18.9V9.90003H5.09998V12.925Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/apps/scandic-web/components/Icons/Hairdryer.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Hairdryer.tsx
similarity index 96%
rename from apps/scandic-web/components/Icons/Hairdryer.tsx
rename to packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Hairdryer.tsx
index bca9ef2e7..331dcc53e 100644
--- a/apps/scandic-web/components/Icons/Hairdryer.tsx
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Hairdryer.tsx
@@ -1,21 +1,22 @@
-import { iconVariants } from "./variants"
+import { iconVariants } from '../../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { IconProps } from '../../icon'
 
 export default function HairdryerIcon({
   className,
+  size = 24,
   color,
   ...props
 }: IconProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
-      width="24"
-      height="24"
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
       viewBox="0 0 24 24"
       fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
       {...props}
     >
       <path
@@ -23,8 +24,8 @@ export default function HairdryerIcon({
         fill="#26201E"
       />
       <path
-        fillRule="evenodd"
-        clipRule="evenodd"
+        fill-rule="evenodd"
+        clip-rule="evenodd"
         d="M17.438 11.4968C16.914 11.4968 16.465 11.3118 16.0909 10.9418C15.7167 10.5718 15.5297 10.127 15.5297 9.60736C15.5297 9.08776 15.7162 8.64246 16.0894 8.27145C16.4625 7.90044 16.911 7.71494 17.435 7.71494C17.959 7.71494 18.408 7.89995 18.7822 8.26996C19.1563 8.63998 19.3434 9.08479 19.3434 9.60439C19.3434 10.124 19.1568 10.5693 18.7837 10.9403C18.4105 11.3113 17.962 11.4968 17.438 11.4968ZM16.7667 10.2716C16.9477 10.4503 17.1714 10.5396 17.4378 10.5396C17.7041 10.5396 17.9274 10.4498 18.1076 10.2703C18.2878 10.0908 18.3779 9.86897 18.3779 9.60483C18.3779 9.3407 18.2874 9.11929 18.1063 8.9406C17.9253 8.76193 17.7016 8.67259 17.4352 8.67259C17.1689 8.67259 16.9456 8.76235 16.7654 8.94187C16.5852 9.12139 16.4952 9.34322 16.4952 9.60736C16.4952 9.87149 16.5857 10.0929 16.7667 10.2716Z"
         fill="#26201E"
       />
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/HandSoap.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/HandSoap.tsx
new file mode 100644
index 000000000..e58651292
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/HandSoap.tsx
@@ -0,0 +1,37 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function HandSoapIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <g clip-path="url(#clip0_4037_3127)">
+        <path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M8.93432 2.50091C8.93432 2.01716 9.32648 1.625 9.81023 1.625H15.6496C16.2691 1.625 16.8632 1.87109 17.3013 2.30913C17.7393 2.74717 17.9854 3.34128 17.9854 3.96077C17.9854 4.44452 17.5933 4.83668 17.1095 4.83668C16.6257 4.83668 16.2336 4.44452 16.2336 3.96077C16.2336 3.8059 16.1721 3.65737 16.0626 3.54786C15.953 3.43835 15.8045 3.37682 15.6496 3.37682H12.8759V5.6396H14.1898C15.0029 5.6396 15.7826 5.96259 16.3576 6.53752C16.9325 7.11245 17.2555 7.89222 17.2555 8.70529V9.39167C17.9345 9.55274 18.562 9.89942 19.0635 10.4009C19.7753 11.1128 20.1752 12.0782 20.1752 13.0849V20.0192C20.1752 20.4451 20.006 20.8535 19.7049 21.1547C19.4037 21.4558 18.9952 21.625 18.5694 21.625H5.43067C5.00477 21.625 4.59632 21.4558 4.29517 21.1547C3.99402 20.8535 3.82483 20.4451 3.82483 20.0192V13.0849C3.82483 12.0782 4.22472 11.1128 4.93654 10.4009C5.43807 9.89942 6.0655 9.55274 6.74454 9.39167V8.70529C6.74454 7.89222 7.06753 7.11245 7.64246 6.53752C8.21739 5.96259 8.99716 5.6396 9.81023 5.6396H11.1241V3.37682H9.81023C9.32648 3.37682 8.93432 2.98467 8.93432 2.50091ZM9.81023 7.39142C9.46177 7.39142 9.12758 7.52985 8.88119 7.77625C8.63479 8.02264 8.49636 8.35683 8.49636 8.70529V9.28923H15.5037V8.70529C15.5037 8.35683 15.3652 8.02264 15.1188 7.77625C14.8724 7.52985 14.5383 7.39142 14.1898 7.39142H9.81023ZM7.62045 11.0411C7.0784 11.0411 6.55855 11.2564 6.17527 11.6397C5.79198 12.023 5.57665 12.5428 5.57665 13.0849V19.8732H18.4234V13.0849C18.4234 12.5428 18.208 12.023 17.8248 11.6397C17.4415 11.2564 16.9216 11.0411 16.3796 11.0411H7.62045Z"
+          fill="#26201E"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_4037_3127">
+          <rect width="24" height="24" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/IceMachine.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/IceMachine.tsx
new file mode 100644
index 000000000..9b09cfc96
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/IceMachine.tsx
@@ -0,0 +1,43 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function IceMachineIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path d="M12.0519 15.0447H14.6V17.5928H12.0519V15.0447Z" fill="#26201E" />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M4.5769 20.6484C4.0269 20.6484 3.55607 20.4526 3.1644 20.0609C2.77274 19.6693 2.5769 19.1984 2.5769 18.6484V4.64844C2.5769 4.09844 2.77274 3.6276 3.1644 3.23594C3.55607 2.84427 4.0269 2.64844 4.5769 2.64844H18.5769C19.1269 2.64844 19.5977 2.84427 19.9894 3.23594C20.3811 3.6276 20.5769 4.09844 20.5769 4.64844V18.6484C20.5769 19.1984 20.3811 19.6693 19.9894 20.0609C19.5977 20.4526 19.1269 20.6484 18.5769 20.6484H4.5769ZM4.5769 18.6484V10.6484H18.5769V18.6484H4.5769ZM18.5769 8.64844H4.5769V4.64844H18.5769V8.64844Z"
+        fill="#D9D9D9"
+      />
+      <path
+        d="M16.5769 7.64844C16.8602 7.64844 17.0977 7.5526 17.2894 7.36094C17.4811 7.16927 17.5769 6.93177 17.5769 6.64844C17.5769 6.3651 17.4811 6.1276 17.2894 5.93594C17.0977 5.74427 16.8602 5.64844 16.5769 5.64844C16.2936 5.64844 16.0561 5.74427 15.8644 5.93594C15.6727 6.1276 15.5769 6.3651 15.5769 6.64844C15.5769 6.93177 15.6727 7.16927 15.8644 7.36094C16.0561 7.5526 16.2936 7.64844 16.5769 7.64844Z"
+        fill="#D9D9D9"
+      />
+      <path
+        d="M8.99573 11.5868H11.5438V14.1349H8.99573V11.5868Z"
+        fill="#26201E"
+      />
+      <path
+        d="M4.0769 18.6484V19.1484H4.5769H18.5769H19.0769V18.6484V10.6484V10.1484H18.5769H4.5769H4.0769V10.6484V18.6484ZM18.5769 9.14844H19.0769V8.64844V4.64844V4.14844H18.5769H4.5769H4.0769V4.64844V8.64844V9.14844H4.5769H18.5769ZM12.5519 15.5447H14.1V17.0928H12.5519V15.5447ZM4.5769 20.1484C4.16057 20.1484 3.8166 20.006 3.51796 19.7074C3.21931 19.4087 3.0769 19.0648 3.0769 18.6484V4.64844C3.0769 4.2321 3.21931 3.88814 3.51796 3.58949C3.8166 3.29084 4.16057 3.14844 4.5769 3.14844H18.5769C18.9932 3.14844 19.3372 3.29084 19.6359 3.58949C19.9345 3.88814 20.0769 4.2321 20.0769 4.64844V18.6484C20.0769 19.0648 19.9345 19.4087 19.6359 19.7074C19.3372 20.006 18.9932 20.1484 18.5769 20.1484H4.5769ZM16.9359 7.00738C16.8426 7.10065 16.7343 7.14844 16.5769 7.14844C16.4195 7.14844 16.3112 7.10066 16.218 7.00738C16.1247 6.91411 16.0769 6.80585 16.0769 6.64844C16.0769 6.49102 16.1247 6.38276 16.218 6.28949C16.3112 6.19622 16.4195 6.14844 16.5769 6.14844C16.7343 6.14844 16.8426 6.19622 16.9359 6.28949C17.0291 6.38276 17.0769 6.49102 17.0769 6.64844C17.0769 6.80585 17.0291 6.91411 16.9359 7.00738ZM9.49573 12.0868H11.0438V13.6349H9.49573V12.0868Z"
+        stroke="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Massage.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Massage.tsx
new file mode 100644
index 000000000..22b1521f2
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Massage.tsx
@@ -0,0 +1,57 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function MassageIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <g clip-path="url(#clip0_7025_35183)">
+        <path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M1.09521 15.5714C1.09521 15.0717 1.50029 14.6666 1.99998 14.6666H13.7619C14.0018 14.6666 14.232 14.762 14.4016 14.9316L17.6586 18.1886L20.7805 17.408C21.2652 17.2867 21.7565 17.5814 21.8777 18.0662C21.9989 18.551 21.7042 19.0422 21.2195 19.1634L18.0971 19.9442C17.7942 20.0198 17.4763 20.0158 17.1754 19.9324C16.8745 19.849 16.6003 19.6892 16.3794 19.4685L13.3871 16.4762H1.99998C1.50029 16.4762 1.09521 16.0711 1.09521 15.5714Z"
+          fill="#26201E"
+        />
+        <path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M5.93801 7.42855L5.93931 7.42855L6.52379 7.42855C6.76374 7.42855 6.99387 7.52387 7.16355 7.69355L11.6874 12.2174C12.0407 12.5707 12.0407 13.1436 11.6874 13.4969C11.334 13.8502 10.7612 13.8502 10.4078 13.4969L6.14902 9.23807H5.94006C5.75966 9.23844 5.58349 9.29273 5.43418 9.39396C5.28471 9.4953 5.16898 9.63905 5.10189 9.80671L3.74457 13.1937C3.55869 13.6575 3.032 13.8828 2.56818 13.697C2.10435 13.5111 1.87903 12.9844 2.06491 12.5206L3.42187 9.13448C3.62316 8.63168 3.97044 8.20015 4.41872 7.89622C4.86713 7.5922 5.39626 7.42933 5.93801 7.42855Z"
+          fill="#26201E"
+        />
+        <path
+          fill-rule="evenodd"
+          clip-rule="evenodd"
+          d="M1.09521 19.1905C1.09521 18.6908 1.50029 18.2857 1.99998 18.2857H12.2627C12.5026 18.2857 12.7328 18.381 12.9025 18.5507L14.712 20.3602C15.0653 20.7135 15.0653 21.2864 14.712 21.6397C14.3586 21.9931 13.7858 21.9931 13.4325 21.6397L11.8879 20.0952H1.99998C1.50029 20.0952 1.09521 19.6901 1.09521 19.1905Z"
+          fill="#26201E"
+        />
+        <path
+          d="M4 4C4 2.89543 4.89543 2 6 2C7.10457 2 8 2.89543 8 4C8 5.10457 7.10457 6 6 6C4.89543 6 4 5.10457 4 4Z"
+          fill="#26201E"
+        />
+        <path
+          d="M16 14C16 12.8954 16.8954 12 18 12C19.1046 12 20 12.8954 20 14C20 15.1046 19.1046 16 18 16C16.8954 16 16 15.1046 16 14Z"
+          fill="#26201E"
+        />
+      </g>
+      <defs>
+        <clipPath id="clip0_7025_35183">
+          <rect width="24" height="24" fill="white" />
+        </clipPath>
+      </defs>
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/MdiBunkBedOutline.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/MdiBunkBedOutline.tsx
new file mode 100644
index 000000000..051066da7
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/MdiBunkBedOutline.tsx
@@ -0,0 +1,36 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function MdiBunkBedIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M2 3.90909C2 3.40701 2.40701 3 2.90909 3C3.41117 3 3.81818 3.40701 3.81818 3.90909V9.33333H10.1818V4.90476C10.1818 4.35248 10.6295 3.90476 11.1818 3.90476H18.3636C20.3636 3.90476 22 5.53333 22 7.52381V21.0909C22 21.593 21.593 22 21.0909 22C20.5888 22 20.1818 21.593 20.1818 21.0909V20.1905H3.81818V21.0909C3.81818 21.593 3.41117 22 2.90909 22C2.40701 22 2 21.593 2 21.0909V3.90909ZM12 5.71429V9.33333H20.1818V7.52381C20.1818 6.52857 19.3636 5.71429 18.3636 5.71429H12ZM3.81818 11.1429V18.381H10.1818V13.9524C10.1818 13.4001 10.6295 12.9524 11.1818 12.9524H18.3636C19 12.9524 19.6364 13.1333 20.1818 13.4952V11.1429H3.81818ZM12 14.7619V18.381H20.1818V16.5714C20.1818 15.5762 19.3636 14.7619 18.3636 14.7619H12Z"
+        fill="#26201E"
+      />
+      <path
+        d="M5.5 16.5C5.89167 16.8917 6.3625 17.0875 6.9125 17.0875C7.4625 17.0875 7.93333 16.8917 8.325 16.5C8.71667 16.1083 8.9125 15.6375 8.9125 15.0875C8.9125 14.5375 8.71667 14.0667 8.325 13.675C7.93333 13.2833 7.4625 13.0875 6.9125 13.0875C6.3625 13.0875 5.89167 13.2833 5.5 13.675C5.10833 14.0667 4.9125 14.5375 4.9125 15.0875C4.9125 15.6375 5.10833 16.1083 5.5 16.5Z"
+        fill="#26201E"
+      />
+      <path
+        d="M5.49998 7.5C5.89164 7.89167 6.36248 8.0875 6.91248 8.0875C7.46248 8.0875 7.93331 7.89167 8.32498 7.5C8.71664 7.10833 8.91248 6.6375 8.91248 6.0875C8.91248 5.5375 8.71664 5.06667 8.32498 4.675C7.93331 4.28333 7.46248 4.0875 6.91248 4.0875C6.36248 4.0875 5.89164 4.28333 5.49998 4.675C5.10831 5.06667 4.91248 5.5375 4.91248 6.0875C4.91248 6.6375 5.10831 7.10833 5.49998 7.5Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Mirror.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Mirror.tsx
new file mode 100644
index 000000000..350cb22f9
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Mirror.tsx
@@ -0,0 +1,38 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function MirrorIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 20 20"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M10.9233 7.02326C10.6256 7.32089 10.6256 7.77918 10.9233 8.07681C11.0287 8.18223 11.1666 8.21874 11.2589 8.23413C11.3545 8.25007 11.4467 8.25005 11.4963 8.25004L11.5059 8.25004C11.5532 8.25007 11.6492 8.25015 11.7366 8.23268C11.781 8.2238 11.848 8.20596 11.9095 8.1634L11.9216 8.15513C11.9672 8.12385 12.0456 8.07018 12.1 8.00004L12.9768 7.07681C13.2744 6.77918 13.2744 6.32089 12.9768 6.02326C12.6792 5.72563 12.2209 5.72563 11.9233 6.02326L10.9233 7.02326Z"
+        fill="#26201E"
+      />
+      <path
+        d="M9.04121 7.98411C9.13355 7.96872 9.22424 7.9346 9.37689 7.82678L11.7789 5.32481C12.0745 5.02713 12.0739 4.5702 11.7769 4.27323C11.4793 3.9756 11.021 3.9756 10.7233 4.27323L8.22333 6.77323C7.9257 7.07086 7.9257 7.52915 8.22333 7.82678C8.32875 7.93221 8.46667 7.96872 8.55901 7.98411C8.65461 8.00004 8.74676 8.00002 8.79633 8.00001H8.80388C8.85345 8.00002 8.94561 8.00004 9.04121 7.98411Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M15.7871 6.75C15.8213 6.64109 15.8791 6.54233 15.9607 6.46074C16.1014 6.32005 16.2932 6.25002 16.5 6.25002C16.7068 6.25002 16.8986 6.32005 17.0393 6.46074C17.18 6.60144 17.25 6.79321 17.25 7.00002C17.25 10.7847 14.4286 13.8436 10.7499 14.2127V16.75H12.5C12.7069 16.75 12.8986 16.8201 13.0393 16.9608C13.18 17.1015 13.25 17.2932 13.25 17.5C13.25 17.7069 13.18 17.8986 13.0393 18.0393C12.8986 18.18 12.7069 18.25 12.5 18.25H7.50004C7.29323 18.25 7.10146 18.18 6.96076 18.0393C6.82007 17.8986 6.75004 17.7069 6.75004 17.5C6.75004 17.2932 6.82007 17.1015 6.96076 16.9608C7.10146 16.8201 7.29323 16.75 7.50004 16.75H9.24994V14.2126C5.57135 13.8435 2.75 10.7846 2.75 7.00002C2.75 6.79321 2.82003 6.60144 2.96072 6.46074C3.10142 6.32005 3.29319 6.25002 3.5 6.25002C3.70681 6.25002 3.89858 6.32005 4.03928 6.46074C4.12086 6.54233 4.17869 6.64109 4.21287 6.75H4.75563C4.8825 3.93184 7.14581 1.75 10 1.75C12.8542 1.75 15.1175 3.93184 15.2444 6.75H15.7871ZM4.38783 8.25H4.8946C5.44341 10.5679 7.49394 12.25 10 12.25C12.5061 12.25 14.5566 10.5679 15.1054 8.25H15.6122C15.0373 10.8164 12.733 12.75 10 12.75C7.26696 12.75 4.96267 10.8164 4.38783 8.25ZM10 3.25C7.93809 3.25 6.25002 4.93807 6.25002 7C6.25002 9.06193 7.93809 10.75 10 10.75C12.0619 10.75 13.75 9.06193 13.75 7C13.75 4.93807 12.0619 3.25 10 3.25Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/MovingBeds.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/MovingBeds.tsx
new file mode 100644
index 000000000..ef5e51cfd
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/MovingBeds.tsx
@@ -0,0 +1,72 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function MovingBedsIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M12.21 17.2193C12.21 16.7528 12.5882 16.3746 13.0547 16.3746H19.6011C19.6322 16.3746 19.6633 16.3764 19.6942 16.3798C20.2608 16.4426 20.7817 16.7201 21.1501 17.1551C21.5185 17.5901 21.7063 18.1496 21.675 18.7188C21.6436 19.2879 21.3955 19.8235 20.9817 20.2154C20.5678 20.6073 20.0195 20.8259 19.4495 20.8262H13.0547C12.5882 20.8262 12.21 20.448 12.21 19.9815C12.21 19.515 12.5882 19.1368 13.0547 19.1368H19.4486C19.4486 19.1368 19.4487 19.1368 19.4486 19.1368C19.5867 19.1367 19.7198 19.0837 19.8201 18.9887C19.9204 18.8937 19.9805 18.7639 19.9881 18.6259C19.9957 18.4879 19.9502 18.3523 19.8609 18.2468C19.7794 18.1505 19.667 18.0861 19.5435 18.064H13.0547C12.5882 18.064 12.21 17.6859 12.21 17.2193Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M4.3054 8.39727C4.33568 8.39398 4.36612 8.39233 4.39658 8.39233H10.943C11.4095 8.39233 11.7877 8.77051 11.7877 9.23703C11.7877 9.70354 11.4095 10.0817 10.943 10.0817H4.45291C4.33 10.1032 4.21791 10.1667 4.13611 10.2619C4.04665 10.366 4.00013 10.5002 4.006 10.6374C4.01187 10.7745 4.06969 10.9043 4.16773 11.0003C4.26402 11.0947 4.39202 11.1496 4.52657 11.1545H10.943C11.4095 11.1545 11.7877 11.5327 11.7877 11.9992C11.7877 12.4657 11.4095 12.8439 10.943 12.8439H4.51484L4.49577 12.8437C3.9297 12.8309 3.38968 12.6032 2.98528 12.2069C2.58088 11.8106 2.34238 11.2753 2.31816 10.7096C2.29394 10.1439 2.48582 9.59019 2.85487 9.16077C3.22391 8.73134 3.74249 8.45839 4.3054 8.39727Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M13.0547 15.3103C12.9113 15.3103 12.7738 15.3673 12.6724 15.4687C12.5711 15.57 12.5141 15.7076 12.5141 15.8509C12.5141 15.9943 12.5711 16.1318 12.6724 16.2332C12.7738 16.3346 12.9113 16.3915 13.0547 16.3915C13.5212 16.3915 13.8994 16.7697 13.8994 17.2362C13.8994 17.7027 13.5212 18.0809 13.0547 18.0809C12.4633 18.0809 11.8961 17.846 11.4779 17.4278C11.0597 17.0096 10.8247 16.4424 10.8247 15.8509C10.8247 15.2595 11.0597 14.6923 11.4779 14.2741C11.8961 13.8559 12.4633 13.6209 13.0547 13.6209H17.5569C18.0234 13.6209 18.4016 13.9991 18.4016 14.4656C18.4016 14.9321 18.0234 15.3103 17.5569 15.3103H13.0547Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M5.59611 6.48332C5.59611 6.01681 5.97429 5.63862 6.4408 5.63862H10.943C11.2359 5.63862 11.5258 5.6963 11.7964 5.80837C12.067 5.92044 12.3128 6.0847 12.5199 6.29177C12.7269 6.49885 12.8912 6.74468 13.0033 7.01523C13.1153 7.28579 13.173 7.57577 13.173 7.86862C13.173 8.16146 13.1153 8.45144 13.0033 8.722C12.8912 8.99255 12.7269 9.23838 12.5199 9.44546C12.3128 9.65253 12.067 9.81679 11.7964 9.92886C11.5258 10.0409 11.2359 10.0986 10.943 10.0986C10.4765 10.0986 10.0983 9.72042 10.0983 9.25391C10.0983 8.7874 10.4765 8.40922 10.943 8.40922C11.014 8.40922 11.0843 8.39524 11.1499 8.36807C11.2155 8.3409 11.2751 8.30108 11.3253 8.25088C11.3755 8.20068 11.4153 8.14109 11.4425 8.0755C11.4696 8.00991 11.4836 7.93961 11.4836 7.86862C11.4836 7.79762 11.4696 7.72732 11.4425 7.66174C11.4153 7.59615 11.3755 7.53655 11.3253 7.48635C11.2751 7.43615 11.2155 7.39633 11.1499 7.36916C11.0843 7.34199 11.014 7.32801 10.943 7.32801H6.4408C5.97429 7.32801 5.59611 6.94983 5.59611 6.48332Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M12.4162 11.1469C12.4292 11.1463 12.4421 11.146 12.455 11.146H18.2612C18.9951 11.1487 19.7091 11.3845 20.3003 11.8193C20.8916 12.2541 21.3294 12.8655 21.5506 13.5653C21.7718 14.265 21.7651 15.017 21.5313 15.7126C21.2975 16.4083 20.8487 17.0117 20.2497 17.4357L20.2438 17.44C19.6613 17.8449 18.9692 18.0626 18.2599 18.0641C17.7933 18.0651 17.4144 17.6877 17.4134 17.2212C17.4124 16.7547 17.7898 16.3757 18.2563 16.3747C18.6209 16.3739 18.9767 16.2624 19.2765 16.0549C19.5818 15.8378 19.8105 15.5296 19.9299 15.1744C20.0497 14.8181 20.0531 14.4329 19.9398 14.0745C19.8265 13.7161 19.6022 13.403 19.2994 13.1803C18.997 12.9578 18.6318 12.8371 18.2564 12.8354H12.4756C11.6705 12.8771 10.9114 13.2251 10.3543 13.8084C9.79296 14.3961 9.47972 15.1776 9.47972 15.9904C9.47972 16.8031 9.79296 17.5846 10.3543 18.1723C10.9114 18.7557 11.6705 19.1036 12.4756 19.1453H13.0548C13.5213 19.1453 13.8994 19.5235 13.8994 19.99C13.8994 20.4565 13.5213 20.8347 13.0548 20.8347H12.455C12.4421 20.8347 12.4292 20.8344 12.4162 20.8338C11.1702 20.7765 9.99414 20.2412 9.13261 19.3392C8.27107 18.4371 7.79034 17.2377 7.79034 15.9904C7.79034 14.743 8.27107 13.5436 9.13261 12.6416C9.99414 11.7395 11.1702 11.2042 12.4162 11.1469Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M3.6911 3.82439C4.28551 3.38909 5.00326 3.1547 5.74001 3.15527C5.73987 3.15527 5.74015 3.15527 5.74001 3.15527H11.5427C11.5556 3.15527 11.5686 3.15557 11.5815 3.15617C12.8276 3.21344 14.0036 3.74875 14.8651 4.6508C15.7267 5.55284 16.2074 6.75223 16.2074 7.99959C16.2074 9.24696 15.7267 10.4463 14.8651 11.3484C14.0036 12.2504 12.8276 12.7857 11.5815 12.843C11.5686 12.8436 11.5556 12.8439 11.5427 12.8439L10.943 12.8439C10.4764 12.8439 10.0983 12.4657 10.0983 11.9992C10.0983 11.5327 10.4764 11.1545 10.943 11.1545L11.5222 11.1545C11.5161 11.1548 11.51 11.1551 11.5039 11.1554L11.5427 11.9992V11.1545H11.5222C12.3273 11.1129 13.0863 10.7649 13.6434 10.1816C14.2048 9.59382 14.518 8.81234 14.518 7.99959C14.518 7.18685 14.2048 6.40537 13.6434 5.81763C13.0863 5.23428 12.3273 4.88633 11.5222 4.84466H11.5427V3.99997L11.5039 4.84377C11.51 4.84405 11.5161 4.84435 11.5222 4.84466H5.73967C5.36223 4.84432 4.99376 4.96438 4.68924 5.18738C4.38473 5.41038 4.15928 5.7247 4.04568 6.08464C3.93209 6.44458 3.93626 6.83137 4.0576 7.18877C4.17879 7.54576 4.41057 7.85483 4.71928 8.07118C4.71894 8.07094 4.71861 8.07071 4.71827 8.07048L4.23611 8.76404L4.72036 8.07194C4.72 8.07168 4.71964 8.07143 4.71928 8.07118C5.01947 8.27956 5.37601 8.3916 5.74146 8.39238C6.20797 8.39336 6.58535 8.77235 6.58436 9.23886C6.58337 9.70537 6.20439 10.0827 5.73788 10.0818C5.02849 10.0803 4.33642 9.86253 3.75396 9.45761L3.75186 9.45615C3.14808 9.03369 2.69478 8.42966 2.45789 7.73187C2.22099 7.03408 2.21284 6.27892 2.43463 5.57619C2.65641 4.87345 3.09657 4.25978 3.6911 3.82439Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M7.08617 11.1469C7.09909 11.1463 7.11202 11.146 7.12496 11.146H12.455C12.9215 11.146 13.2997 11.5242 13.2997 11.9907C13.2997 12.4572 12.9215 12.8354 12.455 12.8354H7.14551C6.34039 12.8771 5.58138 13.2251 5.02424 13.8084C4.46289 14.3961 4.14966 15.1776 4.14966 15.9904C4.14966 16.8031 4.46289 17.5846 5.02424 18.1723C5.58138 18.7557 6.34039 19.1036 7.14551 19.1453H12.455C12.9215 19.1453 13.2997 19.5235 13.2997 19.99C13.2997 20.4565 12.9215 20.8347 12.455 20.8347H7.12496C7.11202 20.8347 7.09909 20.8344 7.08617 20.8338C5.84012 20.7765 4.66407 20.2412 3.80254 19.3392C2.94101 18.4371 2.46027 17.2377 2.46027 15.9904C2.46027 14.743 2.94101 13.5436 3.80254 12.6416C4.66407 11.7395 5.84012 11.2042 7.08617 11.1469Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M10.698 3.99997C10.698 3.53346 11.0762 3.15527 11.5427 3.15527L16.8727 3.15527C16.8856 3.15527 16.8986 3.15557 16.9115 3.15616C18.1575 3.21344 19.3336 3.74875 20.1951 4.6508C21.0567 5.55284 21.5374 6.75222 21.5374 7.99959C21.5374 9.24696 21.0567 10.4463 20.1951 11.3484C19.3336 12.2504 18.1575 12.7857 16.9115 12.843C16.8986 12.8436 16.8856 12.8439 16.8727 12.8439L11.5427 12.8439C11.0762 12.8439 10.698 12.4657 10.698 11.9992C10.698 11.5327 11.0762 11.1545 11.5427 11.1545L16.8522 11.1545C17.6573 11.1129 18.4163 10.7649 18.9734 10.1816C19.5348 9.59382 19.848 8.81234 19.848 7.99959C19.848 7.18685 19.5348 6.40537 18.9734 5.81762C18.4163 5.23428 17.6573 4.88633 16.8522 4.84466L11.5427 4.84466C11.0762 4.84466 10.698 4.46648 10.698 3.99997Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Road.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Road.tsx
new file mode 100644
index 000000000..be3100180
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Road.tsx
@@ -0,0 +1,28 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function RoadIcon({
+  className,
+  color,
+  size = 24,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        d="M5 20C4.44772 20 4 19.5523 4 19V5C4 4.44772 4.44772 4 5 4C5.55228 4 6 4.44772 6 5V19C6 19.5523 5.55228 20 5 20ZM12 20C11.4477 20 11 19.5523 11 19V17C11 16.4477 11.4477 16 12 16C12.5523 16 13 16.4477 13 17V19C13 19.5523 12.5523 20 12 20ZM19 20C18.4477 20 18 19.5523 18 19V5C18 4.44772 18.4477 4 19 4C19.5523 4 20 4.44772 20 5V19C20 19.5523 19.5523 20 19 20ZM12 14C11.4477 14 11 13.5523 11 13V11C11 10.4477 11.4477 10 12 10C12.5523 10 13 10.4477 13 11V13C13 13.5523 12.5523 14 12 14ZM12 8C11.4477 8 11 7.55228 11 7V5C11 4.44772 11.4477 4 12 4C12.5523 4 13 4.44772 13 5V7C13 7.55228 12.5523 8 12 8Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Rug.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Rug.tsx
new file mode 100644
index 000000000..bea30b6d8
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Rug.tsx
@@ -0,0 +1,30 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function RugIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M12.6942 15.9883L12.6942 15.9883C12.6222 16.1081 12.5204 16.2073 12.3988 16.2761C12.2772 16.3448 12.1398 16.381 12.0001 16.381L12.6942 15.9883ZM12.6942 15.9883L14.837 12.4169M12.6942 15.9883L11.3059 15.9883M11.3059 15.9883L11.3059 15.9883L9.16304 12.4169C9.16303 12.4169 9.16302 12.4169 9.16301 12.4169C9.08739 12.291 9.04743 12.1469 9.04743 12C9.04743 11.8531 9.0874 11.709 9.16304 11.5831L11.3059 8.01172C11.3778 7.89184 11.4795 7.79264 11.6012 7.72376C11.7228 7.65488 11.8602 7.61868 12 7.61868C12.1398 7.61868 12.2772 7.65488 12.3989 7.72376C12.5205 7.79264 12.6223 7.89184 12.6942 8.01171L14.837 11.5831C14.9127 11.709 14.9526 11.8531 14.9526 12C14.9526 12.1469 14.9127 12.291 14.837 12.4169M11.3059 15.9883C11.3779 16.1081 11.4796 16.2073 11.6013 16.2761M11.3059 15.9883L11.6013 16.2761M14.837 12.4169L14.7554 12.3679M14.837 12.4169L14.8371 12.4169L14.7554 12.3679M14.7554 12.3679L12.6125 15.9393L14.7554 11.6321C14.8221 11.7432 14.8574 11.8704 14.8574 12C14.8574 12.1296 14.8221 12.2568 14.7554 12.3679ZM11.6013 16.2761C11.7229 16.3448 11.8603 16.381 12 16.381L11.6013 16.2761ZM4.99904 21.8581L5.06639 21.7908L4.99904 21.8581C5.15086 22.01 5.35676 22.0952 5.57146 22.0952C5.78616 22.0952 5.99207 22.01 6.14388 21.8581L6.07654 21.7908L6.14388 21.8581C6.2957 21.7063 6.38099 21.5004 6.38099 21.2857V19.9524H9.04765V21.2857C9.04765 21.5004 9.13294 21.7063 9.28476 21.8581C9.43657 22.01 9.64248 22.0952 9.85718 22.0952C10.0719 22.0952 10.2778 22.01 10.4296 21.8581C10.5814 21.7063 10.6667 21.5004 10.6667 21.2857V19.9524H13.3334V21.2857C13.3334 21.5004 13.4187 21.7063 13.5705 21.8581C13.7223 22.01 13.9282 22.0952 14.1429 22.0952C14.3576 22.0952 14.5635 22.01 14.7153 21.8581C14.8671 21.7063 14.9524 21.5004 14.9524 21.2857V19.9524H17.6191V21.2857C17.6191 21.5004 17.7044 21.7063 17.8562 21.8581C18.008 22.01 18.2139 22.0952 18.4286 22.0952C18.6433 22.0952 18.8492 22.01 19.001 21.8581C19.1528 21.7063 19.2381 21.5004 19.2381 21.2857V2.71429C19.2381 2.49959 19.1528 2.29368 19.001 2.14187C18.8492 1.99005 18.6433 1.90476 18.4286 1.90476C18.2139 1.90476 18.008 1.99005 17.8562 2.14187C17.7044 2.29368 17.6191 2.49959 17.6191 2.71429V4.04762H14.9524V2.71429C14.9524 2.49959 14.8671 2.29368 14.7153 2.14187C14.5635 1.99005 14.3576 1.90476 14.1429 1.90476C13.9282 1.90476 13.7223 1.99005 13.5705 2.14187C13.4187 2.29368 13.3334 2.49959 13.3334 2.71429V4.04762H10.6667V2.71429C10.6667 2.49959 10.5814 2.29368 10.4296 2.14187C10.2778 1.99005 10.0719 1.90476 9.85718 1.90476C9.64248 1.90476 9.43657 1.99005 9.28476 2.14187C9.13294 2.29368 9.04765 2.49959 9.04765 2.71429V4.04762H6.38099V2.71429C6.38099 2.49959 6.2957 2.29368 6.14388 2.14187C5.99207 1.99005 5.78616 1.90476 5.57146 1.90476C5.35676 1.90476 5.15086 1.99005 4.99904 2.14187C4.84723 2.29368 4.76194 2.49959 4.76194 2.71429V21.2857C4.76194 21.5004 4.84723 21.7063 4.99904 21.8581ZM6.38099 5.66667H17.6191V18.3333H6.38099V5.66667ZM10.8013 12L12 10.0021L13.1988 12L12 13.9979L10.8013 12Z"
+        fill="#26201E"
+        stroke="#26201E"
+        stroke-width="0.190476"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/SafetyBox.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/SafetyBox.tsx
new file mode 100644
index 000000000..6ff11fce0
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/SafetyBox.tsx
@@ -0,0 +1,34 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function SafetyBoxIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M4.92582 18.7339C4.39621 18.7339 3.94284 18.5454 3.5657 18.1682C3.18857 17.7911 3 17.3377 3 16.8081V4.68827C3 4.15866 3.18857 3.70529 3.5657 3.32815C3.94284 2.95102 4.39621 2.76245 4.92582 2.76245H19.0999C19.6295 2.76245 20.0828 2.95102 20.46 3.32815C20.8371 3.70529 21.0257 4.15866 21.0257 4.68827V16.8081C21.0257 17.3377 20.8371 17.7911 20.46 18.1682C20.0828 18.5454 19.6295 18.7339 19.0999 18.7339V19.7995C19.0999 20.0649 19.0057 20.2917 18.8174 20.48C18.6291 20.6683 18.4023 20.7625 18.1369 20.7625C17.8716 20.7625 17.6448 20.6683 17.4565 20.48C17.2682 20.2917 17.174 20.0649 17.174 19.7995V18.7339H6.85164V19.7995C6.85164 20.0649 6.75749 20.2917 6.56919 20.48C6.38088 20.6683 6.15407 20.7625 5.88873 20.7625C5.62339 20.7625 5.39658 20.6683 5.20827 20.48C5.01997 20.2917 4.92582 20.0649 4.92582 19.7995V18.7339ZM4.92582 4.68827V16.8081H19.0999V14.3431H18.0728C17.8074 14.3431 17.5806 14.2489 17.3923 14.0606C17.204 13.8723 17.1098 13.6455 17.1098 13.3802C17.1098 13.1148 17.204 12.888 17.3923 12.6997C17.5806 12.5114 17.8074 12.4173 18.0728 12.4173H19.0999V9.07917H18.0728C17.8074 9.07917 17.5806 8.98501 17.3923 8.79671C17.204 8.60841 17.1098 8.38159 17.1098 8.11626C17.1098 7.85092 17.204 7.6241 17.3923 7.4358C17.5806 7.2475 17.8074 7.15335 18.0728 7.15335H19.0999V4.68827H4.92582Z"
+        fill="#26201E"
+      />
+      <path
+        d="M13.5633 11.2715C13.9505 10.8843 14.1441 10.4189 14.1441 9.87515C14.1441 9.33141 13.9505 8.86596 13.5633 8.47877C13.1761 8.09157 12.7106 7.89797 12.1669 7.89797C11.6232 7.89797 11.1577 8.09157 10.7705 8.47877C10.3833 8.86596 10.1897 9.33141 10.1897 9.87515C10.1897 10.4189 10.3833 10.8843 10.7705 11.2715C10.9158 11.4168 11.0545 11.5252 11.2218 11.6159V12.6612C11.2218 12.9265 11.316 13.1533 11.5043 13.3416C11.6926 13.5299 11.9194 13.6241 12.1847 13.6241C12.4501 13.6241 12.6769 13.5299 12.8652 13.3416C13.0535 13.1533 13.1476 12.9265 13.1476 12.6612V11.5956C13.3037 11.5072 13.4267 11.4081 13.5633 11.2715Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Slippers.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Slippers.tsx
new file mode 100644
index 000000000..5da85e569
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Slippers.tsx
@@ -0,0 +1,60 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function SlippersIcon({
+  className,
+  color,
+  size = 24,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M3.52076 1.87074C4.39843 0.99307 5.58881 0.5 6.83002 0.5C8.07124 0.5 9.26161 0.99307 10.1393 1.87074C11.017 2.74841 11.51 3.93879 11.51 5.18V11.5C11.51 12.0523 11.0623 12.5 10.51 12.5C9.95774 12.5 9.51002 12.0523 9.51002 11.5C9.51002 10.9582 9.30069 10.5766 8.97932 10.3119C8.6385 10.0313 8.11422 9.84 7.46002 9.84H6.20002C5.54582 9.84 5.02154 10.0313 4.68073 10.3119C4.35936 10.5766 4.15002 10.9582 4.15002 11.5C4.15002 12.0523 3.70231 12.5 3.15002 12.5C2.59774 12.5 2.15002 12.0523 2.15002 11.5V5.18C2.15002 3.93879 2.64309 2.74841 3.52076 1.87074ZM4.15002 8.29263C4.77224 7.9872 5.47995 7.84 6.20002 7.84H7.46002C8.1801 7.84 8.88781 7.9872 9.51002 8.29263V5.18C9.51002 4.46922 9.22767 3.78755 8.72507 3.28495C8.22247 2.78236 7.5408 2.5 6.83002 2.5C6.11924 2.5 5.43758 2.78236 4.93498 3.28495C4.43238 3.78755 4.15002 4.46922 4.15002 5.18V8.29263Z"
+        fill="#57514E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M13.8608 6.51074C14.7384 5.63307 15.9288 5.14 17.17 5.14C18.4112 5.14 19.6016 5.63307 20.4793 6.51074C21.357 7.38841 21.85 8.57879 21.85 9.82V16.15C21.85 16.7023 21.4023 17.15 20.85 17.15C20.2977 17.15 19.85 16.7023 19.85 16.15C19.85 15.6013 19.6392 15.2173 19.3183 14.9523C18.9779 14.6712 18.4542 14.48 17.8 14.48H16.49C15.8673 14.48 15.3564 14.6676 15.0198 14.9488C14.7016 15.2145 14.49 15.6006 14.49 16.15C14.49 16.7023 14.0423 17.15 13.49 17.15C12.9377 17.15 12.49 16.7023 12.49 16.15V9.82C12.49 8.57879 12.9831 7.38841 13.8608 6.51074ZM14.49 12.9263C15.0999 12.6258 15.7906 12.48 16.49 12.48H17.8C18.5199 12.48 19.2276 12.6271 19.85 12.9331V9.82C19.85 9.10922 19.5677 8.42755 19.0651 7.92495C18.5625 7.42236 17.8808 7.14 17.17 7.14C16.4592 7.14 15.7776 7.42236 15.275 7.92495C14.7724 8.42755 14.49 9.10922 14.49 9.82V12.9263Z"
+        fill="#57514E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M4.68073 10.3119C4.35936 10.5766 4.15002 10.9582 4.15002 11.5V14.18C4.15002 14.8908 4.43238 15.5724 4.93498 16.075C5.43758 16.5776 6.11925 16.86 6.83002 16.86C7.5408 16.86 8.22247 16.5776 8.72507 16.075C9.22767 15.5724 9.51002 14.8908 9.51002 14.18V11.5C9.51002 10.9709 9.30264 10.5872 8.97724 10.3177C8.63417 10.0336 8.10944 9.84 7.46002 9.84H6.20002C5.54582 9.84 5.02154 10.0313 4.68073 10.3119ZM3.40932 8.76807C4.1735 8.13874 5.17422 7.84 6.20002 7.84H7.46002C8.49061 7.84 9.49088 8.14637 10.2528 8.77728C11.0324 9.42284 11.51 10.3691 11.51 11.5V14.18C11.51 15.4212 11.017 16.6116 10.1393 17.4893C9.26161 18.3669 8.07124 18.86 6.83002 18.86C5.58881 18.86 4.39843 18.3669 3.52076 17.4893C2.64309 16.6116 2.15002 15.4212 2.15002 14.18V11.5C2.15002 10.3618 2.62569 9.41341 3.40932 8.76807Z"
+        fill="#57514E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M15.0198 14.9488C14.7016 15.2145 14.49 15.6006 14.49 16.15V18.82C14.49 19.5308 14.7724 20.2124 15.275 20.715C15.7776 21.2176 16.4592 21.5 17.17 21.5C17.8808 21.5 18.5625 21.2176 19.0651 20.715C19.5677 20.2124 19.85 19.5308 19.85 18.82V16.15C19.85 15.614 19.6411 15.2279 19.3162 14.9581C18.9735 14.6736 18.4494 14.48 17.8 14.48H16.49C15.8673 14.48 15.3564 14.6676 15.0198 14.9488ZM13.7377 13.4137C14.4937 12.7824 15.4828 12.48 16.49 12.48H17.8C18.8306 12.48 19.8315 12.7864 20.5938 13.4194C21.3739 14.0671 21.85 15.016 21.85 16.15V18.82C21.85 20.0612 21.357 21.2516 20.4793 22.1293C19.6016 23.0069 18.4112 23.5 17.17 23.5C15.9288 23.5 14.7384 23.0069 13.8608 22.1293C12.9831 21.2516 12.49 20.0612 12.49 18.82V16.15C12.49 15.0094 12.9634 14.0605 13.7377 13.4137Z"
+        fill="#57514E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M17.17 12.48C17.7223 12.48 18.17 12.9277 18.17 13.48V18.18C18.17 18.7323 17.7223 19.18 17.17 19.18C16.6177 19.18 16.17 18.7323 16.17 18.18V13.48C16.17 12.9277 16.6177 12.48 17.17 12.48Z"
+        fill="#57514E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M6.83002 7.84C7.38231 7.84 7.83002 8.28772 7.83002 8.84V13.48C7.83002 14.0323 7.38231 14.48 6.83002 14.48C6.27774 14.48 5.83002 14.0323 5.83002 13.48V8.84C5.83002 8.28772 6.27774 7.84 6.83002 7.84Z"
+        fill="#57514E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Towel.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Towel.tsx
new file mode 100644
index 000000000..f819bd85d
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Towel.tsx
@@ -0,0 +1,28 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function TowelIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M4 22C3.45 22 2.97917 21.8042 2.5875 21.4125C2.19583 21.0208 2 20.55 2 20V4C2 3.45 2.19583 2.97917 2.5875 2.5875C2.97917 2.19583 3.45 2 4 2H13C13.55 2 14.0208 2.19583 14.4125 2.5875C14.8042 2.97917 15 3.45 15 4V20C15 20.55 14.8042 21.0208 14.4125 21.4125C14.0208 21.8042 13.55 22 13 22H4ZM4 10.525C4.3 10.3417 4.61667 10.2083 4.95 10.125C5.28333 10.0417 5.63333 10 6 10H11C11.3667 10 11.7167 10.0417 12.05 10.125C12.3833 10.2083 12.7 10.3417 13 10.525V4H4V10.525ZM8.5 9C7.95 9 7.47917 8.80417 7.0875 8.4125C6.69583 8.02083 6.5 7.55 6.5 7C6.5 6.45 6.69583 5.97917 7.0875 5.5875C7.47917 5.19583 7.95 5 8.5 5C9.05 5 9.52083 5.19583 9.9125 5.5875C10.3042 5.97917 10.5 6.45 10.5 7C10.5 7.55 10.3042 8.02083 9.9125 8.4125C9.52083 8.80417 9.05 9 8.5 9ZM20.204 14.796C19.8152 15.1848 19.1848 15.1848 18.796 14.796C18.4103 14.4103 18.4067 13.7861 18.7879 13.3961L19.175 13H17C16.4477 13 16 12.5523 16 12C16 11.4477 16.4477 11 17 11H19.175L18.7879 10.6039C18.4067 10.2139 18.4103 9.58969 18.796 9.20402C19.1848 8.8152 19.8152 8.8152 20.204 9.20402L22.2929 11.2929C22.6834 11.6834 22.6834 12.3166 22.2929 12.7071L20.204 14.796ZM4 20H13V14C13 13.45 12.8042 12.9792 12.4125 12.5875C12.0208 12.1958 11.55 12 11 12H6C5.45 12 4.97917 12.1958 4.5875 12.5875C4.19583 12.9792 4 13.45 4 14V20Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/View.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/View.tsx
new file mode 100644
index 000000000..64082c145
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/View.tsx
@@ -0,0 +1,34 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function ViewIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M7.13748 17.0121H16.8826C17.0775 17.0121 17.2208 16.9267 17.3125 16.7559C17.4041 16.585 17.3875 16.4204 17.2625 16.2621L14.575 12.6871C14.4807 12.5621 14.3551 12.4996 14.198 12.4996C14.041 12.4996 13.9166 12.5621 13.825 12.6871L11.25 16.1121L9.42498 13.6996C9.33074 13.5746 9.2051 13.5121 9.04805 13.5121C8.891 13.5121 8.76664 13.5746 8.67498 13.6996L6.76588 16.2603C6.63861 16.4198 6.62185 16.585 6.7156 16.7559C6.80935 16.9267 6.94998 17.0121 7.13748 17.0121Z"
+        fill="#26201E"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M5.09998 20.7746C4.58434 20.7746 4.14293 20.591 3.77575 20.2238C3.40857 19.8567 3.22498 19.4152 3.22498 18.8996V5.09961C3.22498 4.58398 3.40857 4.14257 3.77575 3.77538C4.14293 3.4082 4.58434 3.22461 5.09998 3.22461H18.9C19.4156 3.22461 19.857 3.4082 20.2242 3.77538C20.5914 4.14257 20.775 4.58398 20.775 5.09961V18.8996C20.775 19.4152 20.5914 19.8567 20.2242 20.2238C19.857 20.591 19.4156 20.7746 18.9 20.7746H5.09998ZM18.9 10.4996V18.8996H5.09998V10.4996H11.0625V12.5855C11.0625 12.7695 11.2899 12.8558 11.4121 12.7183L12.9375 10.9996V10.4996H18.9ZM18.9 5.09961V8.6246H12.9375V5.09961H18.9ZM5.09998 5.09961H11.0625V8.58085L5.09998 8.6246V5.09961Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Ward.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Ward.tsx
new file mode 100644
index 000000000..6256c29ae
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/Ward.tsx
@@ -0,0 +1,28 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function WardIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      {...props}
+    >
+      <path
+        d="M3 2H5C5.28333 2 5.52083 2.09583 5.7125 2.2875C5.90417 2.47917 6 2.71667 6 3V22C5.45 22 4.97917 21.8042 4.5875 21.4125C4.19583 21.0208 4 20.55 4 20V4H3C2.71667 4 2.47917 3.90417 2.2875 3.7125C2.09583 3.52083 2 3.28333 2 3C2 2.71667 2.09583 2.47917 2.2875 2.2875C2.47917 2.09583 2.71667 2 3 2ZM9 22C8.45 22 7.97917 21.8042 7.5875 21.4125C7.19583 21.0208 7 20.55 7 20V4C7 3.45 7.19583 2.97917 7.5875 2.5875C7.97917 2.19583 8.45 2 9 2H18C18.55 2 19.0208 2.19583 19.4125 2.5875C19.8042 2.97917 20 3.45 20 4V20C20 20.55 19.8042 21.0208 19.4125 21.4125C19.0208 21.8042 18.55 22 18 22H9ZM9 10.525C9.3 10.3417 9.61667 10.2083 9.95 10.125C10.2833 10.0417 10.6333 10 11 10H16C16.3667 10 16.7167 10.0417 17.05 10.125C17.3833 10.2083 17.7 10.3417 18 10.525V4H9V10.525ZM13.5 9C12.95 9 12.4792 8.80417 12.0875 8.4125C11.6958 8.02083 11.5 7.55 11.5 7C11.5 6.45 11.6958 5.97917 12.0875 5.5875C12.4792 5.19583 12.95 5 13.5 5C14.05 5 14.5208 5.19583 14.9125 5.5875C15.3042 5.97917 15.5 6.45 15.5 7C15.5 7.55 15.3042 8.02083 14.9125 8.4125C14.5208 8.80417 14.05 9 13.5 9ZM9 20H18V14C18 13.45 17.8042 12.9792 17.4125 12.5875C17.0208 12.1958 16.55 12 16 12H11C10.45 12 9.97917 12.1958 9.5875 12.5875C9.19583 12.9792 9 13.45 9 14V20Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/apps/scandic-web/components/Icons/WindowNotAvailable.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/WindowNotAvailable.tsx
similarity index 91%
rename from apps/scandic-web/components/Icons/WindowNotAvailable.tsx
rename to packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/WindowNotAvailable.tsx
index 9e938c1e9..ca2ef86fc 100644
--- a/apps/scandic-web/components/Icons/WindowNotAvailable.tsx
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/WindowNotAvailable.tsx
@@ -1,21 +1,22 @@
-import { iconVariants } from "./variants"
+import { iconVariants } from '../../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { IconProps } from '../../icon'
 
 export default function WindowNotAvailableIcon({
   className,
+  size = 24,
   color,
   ...props
 }: IconProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
-      width="24"
-      height="24"
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
       viewBox="0 0 24 24"
       fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
       {...props}
     >
       <path
@@ -23,14 +24,14 @@ export default function WindowNotAvailableIcon({
         fill="#26201E"
       />
       <path
-        fillRule="evenodd"
-        clipRule="evenodd"
+        fill-rule="evenodd"
+        clip-rule="evenodd"
         d="M5.95054 4.46519C5.52518 4.49131 5.15729 4.65958 4.84687 4.97C4.50793 5.30894 4.33846 5.71639 4.33846 6.19236V19.2308H3.35769C3.11923 19.2308 2.91539 19.3154 2.74616 19.4847C2.57692 19.6539 2.49231 19.8577 2.49231 20.0962C2.49231 20.3347 2.57692 20.5385 2.74616 20.7077C2.91539 20.877 3.11923 20.9616 3.35769 20.9616H19.9731C20.2115 20.9616 20.4154 20.877 20.5846 20.7077C20.7538 20.5385 20.8385 20.3347 20.8385 20.0962C20.8385 19.8577 20.7538 19.6539 20.5846 19.4847C20.4154 19.3154 20.2115 19.2308 19.9731 19.2308H18.9923V17.5049L18.4182 16.9328L17.2615 15.8083V19.2308H13.5577C13.6808 18.1385 14.0423 17.0366 14.6423 15.9251C14.9739 15.3107 15.389 14.8168 15.8874 14.4433L15.4619 14.0178L14.6843 13.2301C13.938 13.84 13.3356 14.6095 12.8769 15.5385C12.2769 16.7539 11.9231 17.9847 11.8154 19.2308H11.5154C11.4077 17.9847 11.0538 16.7539 10.4538 15.5385C9.85385 14.3231 9.00769 13.3808 7.91539 12.7116C9.00769 12.0424 9.85385 11.1001 10.4538 9.88467C10.557 9.67565 10.6529 9.46617 10.7416 9.25623L9.3933 7.90796C9.21395 8.4372 8.98001 8.96913 8.69149 9.50374C8.08947 10.6192 7.21539 11.3385 6.06923 11.6616V6.19236H7.6777L5.95054 4.46519ZM9.78462 19.2308H6.06923V13.7731C7.21539 14.0962 8.09039 14.8135 8.69423 15.9251C9.29808 17.0366 9.66154 18.1385 9.78462 19.2308Z"
         fill="#26201E"
       />
       <path
-        fillRule="evenodd"
-        clipRule="evenodd"
+        fill-rule="evenodd"
+        clip-rule="evenodd"
         d="M11.4051 7.03227L8.83444 4.46159H17.2615C17.7375 4.46159 18.145 4.63106 18.4839 4.97C18.8228 5.30894 18.9923 5.71639 18.9923 6.19236V14.6195L12.0659 7.69308C11.9423 7.19534 11.8588 6.6951 11.8154 6.19236H11.5154C11.4911 6.47311 11.4544 6.75308 11.4051 7.03227ZM13.5462 6.19236H17.2615V11.6616C16.1154 11.3385 15.2404 10.6193 14.6365 9.5039C14.0327 8.38852 13.6692 7.28467 13.5462 6.19236Z"
         fill="#26201E"
       />
diff --git a/apps/scandic-web/components/Icons/WoodFloor.tsx b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/WoodFloor.tsx
similarity index 97%
rename from apps/scandic-web/components/Icons/WoodFloor.tsx
rename to packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/WoodFloor.tsx
index 1f57c69ad..ca03959bc 100644
--- a/apps/scandic-web/components/Icons/WoodFloor.tsx
+++ b/packages/design-system/lib/components/Icons/Customised/Amenities&Facilities/WoodFloor.tsx
@@ -1,21 +1,22 @@
-import { iconVariants } from "./variants"
+import { iconVariants } from '../../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { IconProps } from '../../icon'
 
 export default function WoodFloorIcon({
   className,
+  size = 24,
   color,
   ...props
 }: IconProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
-      width="24"
-      height="24"
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
       viewBox="0 0 24 24"
       fill="none"
-      xmlns="http://www.w3.org/2000/svg"
-      className={classNames}
       {...props}
     >
       <path
diff --git a/packages/design-system/lib/components/Icons/Customised/Benefits/DiamondAdd.tsx b/packages/design-system/lib/components/Icons/Customised/Benefits/DiamondAdd.tsx
new file mode 100644
index 000000000..d80d22640
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Benefits/DiamondAdd.tsx
@@ -0,0 +1,34 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function DiamondAddIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M17.4051 14.4114L13.4383 19.1625C13.2466 19.3875 13.0255 19.5583 12.775 19.675C12.5245 19.7917 12.2662 19.85 12 19.85C11.7339 19.85 11.4758 19.7917 11.2258 19.675C10.9758 19.5583 10.7549 19.3875 10.5633 19.1625L2.85078 9.925C2.70911 9.75237 2.60286 9.56403 2.53203 9.36C2.4612 9.15597 2.42578 8.94409 2.42578 8.72437C2.42578 8.58312 2.43828 8.44167 2.46328 8.3C2.48828 8.15833 2.53828 8.02083 2.61328 7.8875L4.52578 4.1C4.69245 3.78333 4.92096 3.53125 5.21131 3.34375C5.50166 3.15625 5.82731 3.0625 6.18828 3.0625H17.8133C18.0566 3.0625 18.2839 3.1051 18.4951 3.19029C17.3598 3.48353 16.3548 4.10077 15.5845 4.9375H15.0008L15.2191 5.37413C14.7463 5.99653 14.3923 6.71406 14.1908 7.49297L12.9123 4.9375H11.0883L9.52578 8.0625H14.0728C14.0249 8.36796 14 8.68108 14 9C14 9.31892 14.0249 9.63204 14.0728 9.9375H12.9383V16.85L15.8575 13.3405C16.3114 13.7738 16.8331 14.1366 17.4051 14.4114ZM11.0633 9.9375V16.85L5.31328 9.9375H11.0633ZM7.43828 8.0625H4.65078L6.21328 4.9375H9.00078L7.43828 8.0625Z"
+        fill="#26201E"
+      />
+      <path
+        d="M16.9375 9.875H19V11.9375C19 12.1958 19.0917 12.4167 19.275 12.6C19.4583 12.7833 19.6792 12.875 19.9375 12.875C20.1958 12.875 20.4167 12.7833 20.6 12.6C20.7833 12.4167 20.875 12.1958 20.875 11.9375V9.875H22.9375C23.1958 9.875 23.4167 9.78333 23.6 9.6C23.7833 9.41667 23.875 9.19583 23.875 8.9375C23.875 8.67917 23.7833 8.45833 23.6 8.275C23.4167 8.09167 23.1958 8 22.9375 8H20.875V5.9375C20.875 5.67917 20.7833 5.45833 20.6 5.275C20.4167 5.09167 20.1958 5 19.9375 5C19.6792 5 19.4583 5.09167 19.275 5.275C19.0917 5.45833 19 5.67917 19 5.9375V8H16.9375C16.6792 8 16.4583 8.09167 16.275 8.275C16.0917 8.45833 16 8.67917 16 8.9375C16 9.19583 16.0917 9.41667 16.275 9.6C16.4583 9.78333 16.6792 9.875 16.9375 9.875Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/apps/scandic-web/components/Icons/Facebook.tsx b/packages/design-system/lib/components/Icons/Customised/Socials/Facebook.tsx
similarity index 86%
rename from apps/scandic-web/components/Icons/Facebook.tsx
rename to packages/design-system/lib/components/Icons/Customised/Socials/Facebook.tsx
index 20e7b6499..bdfb7ab17 100644
--- a/apps/scandic-web/components/Icons/Facebook.tsx
+++ b/packages/design-system/lib/components/Icons/Customised/Socials/Facebook.tsx
@@ -1,26 +1,27 @@
-import { iconVariants } from "./variants"
+import { iconVariants } from '../../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { IconProps } from '../../icon'
 
 export default function FacebookIcon({
   className,
   color,
+  size = 24,
   ...props
 }: IconProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
       className={classNames}
-      width="24"
-      height="24"
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
       viewBox="0 0 24 24"
       fill="none"
-      xmlns="http://www.w3.org/2000/svg"
       {...props}
     >
       <path
         d="M18.25 2C19.283 2 20.1662 2.36675 20.8997 3.10026C21.6332 3.83377 22 4.71701 22 5.75V18.25C22 19.283 21.6332 20.1662 20.8997 20.8997C20.1662 21.6332 19.283 22 18.25 22H15.8021V14.2526H18.3932L18.7839 11.2318H15.8021V9.30469C15.8021 8.81858 15.9041 8.45399 16.1081 8.21094C16.3121 7.96788 16.7092 7.84635 17.2995 7.84635L18.888 7.83333V5.13802C18.3411 5.0599 17.5686 5.02083 16.5703 5.02083C15.3898 5.02083 14.4457 5.36806 13.7383 6.0625C13.0308 6.75694 12.6771 7.73785 12.6771 9.00521V11.2318H10.0729V14.2526H12.6771V22H5.75C4.71701 22 3.83377 21.6332 3.10026 20.8997C2.36675 20.1662 2 19.283 2 18.25V5.75C2 4.71701 2.36675 3.83377 3.10026 3.10026C3.83377 2.36675 4.71701 2 5.75 2H18.25Z"
-        fill="black"
+        fill="#26201E"
       />
     </svg>
   )
diff --git a/packages/design-system/lib/components/Icons/Customised/Socials/Instagram.tsx b/packages/design-system/lib/components/Icons/Customised/Socials/Instagram.tsx
new file mode 100644
index 000000000..5368d4169
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Socials/Instagram.tsx
@@ -0,0 +1,28 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function InstagramIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        d="M17.34 5.46012C17.1027 5.46012 16.8707 5.5305 16.6733 5.66236C16.476 5.79422 16.3222 5.98163 16.2313 6.2009C16.1405 6.42017 16.1168 6.66145 16.1631 6.89423C16.2094 7.12701 16.3236 7.34083 16.4915 7.50865C16.6593 7.67647 16.8731 7.79076 17.1059 7.83706C17.3387 7.88337 17.5799 7.8596 17.7992 7.76878C18.0185 7.67795 18.2059 7.52415 18.3378 7.32681C18.4696 7.12947 18.54 6.89746 18.54 6.66012C18.54 6.34186 18.4136 6.03664 18.1885 5.81159C17.9635 5.58655 17.6583 5.46012 17.34 5.46012ZM21.94 7.88012C21.9206 7.05042 21.7652 6.22952 21.48 5.45012C21.2257 4.78325 20.83 4.1794 20.32 3.68012C19.8248 3.16755 19.2196 2.7743 18.55 2.53012C17.7727 2.23628 16.9508 2.07733 16.12 2.06012C15.06 2.00012 14.72 2.00012 12 2.00012C9.28 2.00012 8.94 2.00012 7.88 2.06012C7.04915 2.07733 6.22734 2.23628 5.45 2.53012C4.78168 2.77677 4.17693 3.16968 3.68 3.68012C3.16743 4.1753 2.77418 4.78056 2.53 5.45012C2.23616 6.22747 2.07721 7.04927 2.06 7.88012C2 8.94012 2 9.28012 2 12.0001C2 14.7201 2 15.0601 2.06 16.1201C2.07721 16.951 2.23616 17.7728 2.53 18.5501C2.77418 19.2197 3.16743 19.8249 3.68 20.3201C4.17693 20.8306 4.78168 21.2235 5.45 21.4701C6.22734 21.764 7.04915 21.9229 7.88 21.9401C8.94 22.0001 9.28 22.0001 12 22.0001C14.72 22.0001 15.06 22.0001 16.12 21.9401C16.9508 21.9229 17.7727 21.764 18.55 21.4701C19.2196 21.2259 19.8248 20.8327 20.32 20.3201C20.8322 19.8227 21.2283 19.2183 21.48 18.5501C21.7652 17.7707 21.9206 16.9498 21.94 16.1201C21.94 15.0601 22 14.7201 22 12.0001C22 9.28012 22 8.94012 21.94 7.88012ZM20.14 16.0001C20.1327 16.6349 20.0178 17.2638 19.8 17.8601C19.6403 18.2953 19.3839 18.6885 19.05 19.0101C18.7256 19.3406 18.3332 19.5966 17.9 19.7601C17.3037 19.9779 16.6748 20.0928 16.04 20.1001C15.04 20.1501 14.67 20.1601 12.04 20.1601C9.41 20.1601 9.04 20.1601 8.04 20.1001C7.38089 20.1125 6.72459 20.011 6.1 19.8001C5.68578 19.6282 5.31136 19.3729 5 19.0501C4.66809 18.7289 4.41484 18.3353 4.26 17.9001C4.01586 17.2953 3.88044 16.6521 3.86 16.0001C3.86 15.0001 3.8 14.6301 3.8 12.0001C3.8 9.37012 3.8 9.00012 3.86 8.00012C3.86448 7.35118 3.98295 6.70807 4.21 6.10012C4.38605 5.67803 4.65627 5.30178 5 5.00012C5.30381 4.65629 5.67929 4.38322 6.1 4.20012C6.70955 3.98017 7.352 3.8652 8 3.86012C9 3.86012 9.37 3.80012 12 3.80012C14.63 3.80012 15 3.80012 16 3.86012C16.6348 3.8674 17.2637 3.98237 17.86 4.20012C18.3144 4.36877 18.7223 4.64297 19.05 5.00012C19.3777 5.3073 19.6338 5.68285 19.8 6.10012C20.0223 6.70906 20.1373 7.3519 20.14 8.00012C20.19 9.00012 20.2 9.37012 20.2 12.0001C20.2 14.6301 20.19 15.0001 20.14 16.0001ZM12 6.87012C10.9858 6.8721 9.99496 7.17465 9.15265 7.73954C8.31035 8.30443 7.65438 9.10632 7.26763 10.0439C6.88089 10.9814 6.78072 12.0126 6.97979 13.0071C7.17886 14.0015 7.66824 14.9147 8.38608 15.6311C9.10392 16.3475 10.018 16.8351 11.0129 17.0323C12.0077 17.2294 13.0387 17.1272 13.9755 16.7387C14.9123 16.3501 15.7129 15.6926 16.2761 14.8492C16.8394 14.0057 17.14 13.0143 17.14 12.0001C17.1413 11.3252 17.0092 10.6567 16.7512 10.0331C16.4933 9.40943 16.1146 8.84293 15.6369 8.36617C15.1592 7.88941 14.5919 7.5118 13.9678 7.25505C13.3436 6.9983 12.6749 6.86748 12 6.87012ZM12 15.3301C11.3414 15.3301 10.6976 15.1348 10.15 14.7689C9.60234 14.403 9.17552 13.8829 8.92348 13.2745C8.67144 12.666 8.6055 11.9964 8.73398 11.3505C8.86247 10.7045 9.17963 10.1112 9.64533 9.64546C10.111 9.17975 10.7044 8.8626 11.3503 8.73411C11.9963 8.60562 12.6659 8.67156 13.2743 8.9236C13.8828 9.17564 14.4029 9.60246 14.7688 10.1501C15.1347 10.6977 15.33 11.3415 15.33 12.0001C15.33 12.4374 15.2439 12.8704 15.0765 13.2745C14.9092 13.6785 14.6639 14.0456 14.3547 14.3548C14.0454 14.664 13.6784 14.9093 13.2743 15.0766C12.8703 15.244 12.4373 15.3301 12 15.3301Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/Socials/Tripadvisor.tsx b/packages/design-system/lib/components/Icons/Customised/Socials/Tripadvisor.tsx
new file mode 100644
index 000000000..b63dbc017
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/Socials/Tripadvisor.tsx
@@ -0,0 +1,30 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function TripadvisorIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M8.4535 13.2211C8.4535 14.2532 7.5806 15.0898 6.50383 15.0898C5.42706 15.0898 4.55416 14.2532 4.55416 13.2211C4.55416 12.1891 5.42706 11.3525 6.50383 11.3525C7.58043 11.3517 8.45378 12.1877 8.45453 13.2195V13.2211H8.4535ZM17.4963 11.3525C16.4195 11.3525 15.5466 12.1891 15.5466 13.2211C15.5466 14.2532 16.4195 15.0898 17.4963 15.0898C18.5731 15.0898 19.4459 14.2532 19.4459 13.2211C19.4459 12.1891 18.5731 11.3525 17.4963 11.3525ZM17.4963 16.7858C15.4422 16.7858 13.7771 15.1899 13.7771 13.2211C13.7771 11.2524 15.4422 9.65646 17.4963 9.65646C19.5503 9.65646 21.2154 11.2524 21.2154 13.2211C21.2154 15.1899 19.5503 16.7858 17.4963 16.7858ZM12.0018 13.1184C12.0018 10.7727 10.2206 8.75988 7.87394 7.89842C10.5156 6.84372 13.4873 6.84372 16.1289 7.89842C13.7815 8.7602 12.0018 10.7727 12.0018 13.1184ZM6.50486 16.7858C4.45082 16.7858 2.78568 15.1899 2.78568 13.2211C2.78568 11.2524 4.45082 9.65646 6.50486 9.65646C8.5589 9.65646 10.224 11.2524 10.224 13.2211C10.224 15.1899 8.5589 16.7858 6.50486 16.7858ZM21.2017 9.32816L23 7.45291H19.0133C14.7854 4.69522 9.22834 4.69522 5.00047 7.45291H1.00351L2.80178 9.32816C0.554454 11.2836 0.386546 14.615 2.42675 16.769C4.46695 18.9231 7.94269 19.0839 10.19 17.1285C10.2067 17.1139 10.2233 17.0993 10.2398 17.0846L12.0018 18.9231L13.7627 17.0869C14.7772 17.9904 16.1113 18.4918 17.4963 18.49C20.5314 18.49 22.9942 16.1315 22.9942 13.2225C22.9965 11.7402 22.3455 10.3259 21.2017 9.32816Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/Customised/UI/Minimize.tsx b/packages/design-system/lib/components/Icons/Customised/UI/Minimize.tsx
new file mode 100644
index 000000000..28d225a89
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Customised/UI/Minimize.tsx
@@ -0,0 +1,28 @@
+import { iconVariants } from '../../variants'
+
+import type { IconProps } from '../../icon'
+
+export default function MinimizeIcon({
+  className,
+  size = 24,
+  color,
+  ...props
+}: IconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <svg
+      className={classNames}
+      xmlns="http://www.w3.org/2000/svg"
+      width={size}
+      height={size}
+      viewBox="0 0 24 24"
+      fill="none"
+      {...props}
+    >
+      <path
+        d="M9.06248 16.25L5.06248 20.2625C4.87914 20.4458 4.66456 20.5375 4.41873 20.5375C4.17289 20.5375 3.95414 20.4417 3.76248 20.25C3.57081 20.0583 3.47498 19.8375 3.47498 19.5875C3.47498 19.3375 3.57081 19.1167 3.76248 18.925L7.74998 14.9375H6.22498C5.96664 14.9375 5.74581 14.8458 5.56248 14.6625C5.37914 14.4792 5.28748 14.2583 5.28748 14C5.28748 13.7417 5.37914 13.5208 5.56248 13.3375C5.74581 13.1542 5.96664 13.0625 6.22498 13.0625H9.99998C10.2583 13.0625 10.4791 13.1542 10.6625 13.3375C10.8458 13.5208 10.9375 13.7417 10.9375 14V17.775C10.9375 18.0333 10.8458 18.2542 10.6625 18.4375C10.4791 18.6208 10.2583 18.7125 9.99998 18.7125C9.74164 18.7125 9.52081 18.6208 9.33748 18.4375C9.15414 18.2542 9.06248 18.0333 9.06248 17.775V16.25ZM16.25 9.06251H17.775C18.0333 9.06251 18.2541 9.15418 18.4375 9.33751C18.6208 9.52084 18.7125 9.74168 18.7125 10C18.7125 10.2583 18.6208 10.4792 18.4375 10.6625C18.2541 10.8458 18.0333 10.9375 17.775 10.9375H14C13.7416 10.9375 13.5208 10.8458 13.3375 10.6625C13.1541 10.4792 13.0625 10.2583 13.0625 10V6.22501C13.0625 5.96668 13.1541 5.74584 13.3375 5.56251C13.5208 5.37918 13.7416 5.28751 14 5.28751C14.2583 5.28751 14.4791 5.37918 14.6625 5.56251C14.8458 5.74584 14.9375 5.96668 14.9375 6.22501V7.75001L18.925 3.75001C19.1083 3.56668 19.325 3.47293 19.575 3.46876C19.825 3.46459 20.0458 3.55834 20.2375 3.75001C20.4291 3.94168 20.525 4.16251 20.525 4.41251C20.525 4.66251 20.4291 4.88334 20.2375 5.07501L16.25 9.06251Z"
+        fill="#26201E"
+      />
+    </svg>
+  )
+}
diff --git a/apps/scandic-web/components/Icons/Beds/Bed.tsx b/packages/design-system/lib/components/Icons/Illustrations/Bed.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/Beds/Bed.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/Bed.tsx
index e53e94b9e..5bc2463fa 100644
--- a/apps/scandic-web/components/Icons/Beds/Bed.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/Bed.tsx
@@ -1,6 +1,6 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function BedIcon({ color, ...props }: IconProps) {
+export default function BedIcon({ color, ...props }: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/Coin.tsx b/packages/design-system/lib/components/Icons/Illustrations/Coin.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/Coin.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/Coin.tsx
index 4d53ae1c9..ec29b6895 100644
--- a/apps/scandic-web/components/Icons/Coin.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/Coin.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function CoinIcon({ color, ...props }: IconProps) {
+export default function CoinIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/CroissantCoffeeEgg.tsx b/packages/design-system/lib/components/Icons/Illustrations/CroissantCoffeeEgg.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/CroissantCoffeeEgg.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/CroissantCoffeeEgg.tsx
index 29baf082f..1d411b386 100644
--- a/apps/scandic-web/components/Icons/CroissantCoffeeEgg.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/CroissantCoffeeEgg.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function CroissantCoffeeEggIcon({ color, ...props }: IconProps) {
+export default function CroissantCoffeeEggIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/CutleryOne.tsx b/packages/design-system/lib/components/Icons/Illustrations/CutleryOne.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/CutleryOne.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/CutleryOne.tsx
index 125cd094e..8fef18cf5 100644
--- a/apps/scandic-web/components/Icons/CutleryOne.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/CutleryOne.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function CutleryOneIcon({ color, ...props }: IconProps) {
+export default function CutleryOneIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/CutleryTwo.tsx b/packages/design-system/lib/components/Icons/Illustrations/CutleryTwo.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/CutleryTwo.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/CutleryTwo.tsx
index 8f1221100..cd3604e5e 100644
--- a/apps/scandic-web/components/Icons/CutleryTwo.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/CutleryTwo.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function CutleryTwoIcon({ color, ...props }: IconProps) {
+export default function CutleryTwoIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/GiftOpen.tsx b/packages/design-system/lib/components/Icons/Illustrations/GiftOpen.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/GiftOpen.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/GiftOpen.tsx
index 305e49d2c..1fd66878b 100644
--- a/apps/scandic-web/components/Icons/GiftOpen.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/GiftOpen.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function GiftOpenIcon({ color, ...props }: IconProps) {
+export default function GiftOpenIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/HandKey.tsx b/packages/design-system/lib/components/Icons/Illustrations/HandKey.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/HandKey.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/HandKey.tsx
index 138690c2e..221047b8f 100644
--- a/apps/scandic-web/components/Icons/HandKey.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/HandKey.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function HandKeyIcon({ color, ...props }: IconProps) {
+export default function HandKeyIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/HotelNight.tsx b/packages/design-system/lib/components/Icons/Illustrations/HotelNight.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/HotelNight.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/HotelNight.tsx
index 02000c04a..95284b795 100644
--- a/apps/scandic-web/components/Icons/HotelNight.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/HotelNight.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function HotelNightIcon({ color, ...props }: IconProps) {
+export default function HotelNightIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/Kids.tsx b/packages/design-system/lib/components/Icons/Illustrations/Kids.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/Kids.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/Kids.tsx
index d2dce8a36..7f14f634f 100644
--- a/apps/scandic-web/components/Icons/Kids.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/Kids.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function KidsIcon({ color, ...props }: IconProps) {
+export default function KidsIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/KidsMocktail.tsx b/packages/design-system/lib/components/Icons/Illustrations/KidsMocktail.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/KidsMocktail.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/KidsMocktail.tsx
index ef9d79c1c..db06b0a48 100644
--- a/apps/scandic-web/components/Icons/KidsMocktail.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/KidsMocktail.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function KidsMocktailIcon({ color, ...props }: IconProps) {
+export default function KidsMocktailIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/MagicWand.tsx b/packages/design-system/lib/components/Icons/Illustrations/MagicWand.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/MagicWand.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/MagicWand.tsx
index 5ec055b59..46dd23928 100644
--- a/apps/scandic-web/components/Icons/MagicWand.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/MagicWand.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function MagicWandIcon({ color, ...props }: IconProps) {
+export default function MagicWandIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/MoneyHand.tsx b/packages/design-system/lib/components/Icons/Illustrations/MoneyHand.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/MoneyHand.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/MoneyHand.tsx
index f0a8fdf64..8178524d1 100644
--- a/apps/scandic-web/components/Icons/MoneyHand.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/MoneyHand.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function MoneyHandIcon({ color, ...props }: IconProps) {
+export default function MoneyHandIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/Surprise.tsx b/packages/design-system/lib/components/Icons/Illustrations/Surprise.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/Surprise.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/Surprise.tsx
index f590d198e..adb65754c 100644
--- a/apps/scandic-web/components/Icons/Surprise.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/Surprise.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function SurpriseIcon({ color, ...props }: IconProps) {
+export default function SurpriseIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/apps/scandic-web/components/Icons/Voucher.tsx b/packages/design-system/lib/components/Icons/Illustrations/Voucher.tsx
similarity index 97%
rename from apps/scandic-web/components/Icons/Voucher.tsx
rename to packages/design-system/lib/components/Icons/Illustrations/Voucher.tsx
index 17a546a3a..8820e80a2 100644
--- a/apps/scandic-web/components/Icons/Voucher.tsx
+++ b/packages/design-system/lib/components/Icons/Illustrations/Voucher.tsx
@@ -1,6 +1,9 @@
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
-export default function VoucherIcon({ color, ...props }: IconProps) {
+export default function VoucherIcon({
+  color,
+  ...props
+}: LogoAndIllustrationProps) {
   return (
     <svg
       xmlns="http://www.w3.org/2000/svg"
diff --git a/packages/design-system/lib/components/Icons/InfoCircle.tsx b/packages/design-system/lib/components/Icons/InfoCircle.tsx
deleted file mode 100644
index 15b074df9..000000000
--- a/packages/design-system/lib/components/Icons/InfoCircle.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { SVGProps } from 'react'
-
-export default function InfoCircleIcon(props: SVGProps<SVGSVGElement>) {
-  return (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width={props.width ?? 20}
-      height={props.height ?? 20}
-      fill="none"
-      {...props}
-    >
-      <path
-        fill="currentColor"
-        d="M10.005 13.896a.68.68 0 0 0 .494-.205.667.667 0 0 0 .208-.493v-3.48a.674.674 0 0 0-.204-.492.666.666 0 0 0-.49-.205.68.68 0 0 0-.493.205.667.667 0 0 0-.209.493v3.48c0 .19.068.355.204.492.136.137.3.205.49.205Zm-.013-6.313a.701.701 0 0 0 .507-.201.668.668 0 0 0 .208-.5.701.701 0 0 0-.202-.507.668.668 0 0 0-.5-.208.701.701 0 0 0-.506.202.668.668 0 0 0-.209.5c0 .198.068.367.202.506a.668.668 0 0 0 .5.208Zm.012 10.209a7.594 7.594 0 0 1-3.027-.61 7.85 7.85 0 0 1-4.16-4.162 7.588 7.588 0 0 1-.61-3.03c0-1.075.203-2.083.61-3.022a7.884 7.884 0 0 1 4.162-4.15 7.589 7.589 0 0 1 3.03-.61c1.075 0 2.083.204 3.022.61a7.883 7.883 0 0 1 4.15 4.157c.406.942.61 1.949.61 3.02a7.594 7.594 0 0 1-.61 3.027 7.849 7.849 0 0 1-4.158 4.16 7.54 7.54 0 0 1-3.019.61ZM10 16.396c1.77 0 3.28-.623 4.526-1.87 1.246-1.246 1.87-2.755 1.87-4.526 0-1.77-.624-3.28-1.87-4.526-1.247-1.246-2.755-1.87-4.526-1.87s-3.28.624-4.526 1.87C4.226 6.721 3.603 8.23 3.603 10s.623 3.28 1.87 4.526c1.246 1.247 2.755 1.87 4.526 1.87Z"
-      />
-    </svg>
-  )
-}
diff --git a/packages/design-system/lib/components/Icons/InfoCircleFilled.tsx b/packages/design-system/lib/components/Icons/InfoCircleFilled.tsx
deleted file mode 100644
index eb7856289..000000000
--- a/packages/design-system/lib/components/Icons/InfoCircleFilled.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import { SVGProps } from 'react'
-
-export default function InfoCircleFilledIcon(props: SVGProps<SVGSVGElement>) {
-  return (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      width={props.width ?? 20}
-      height={props.height ?? 20}
-      fill="none"
-      {...props}
-    >
-      <path
-        fill="currentColor"
-        d="M10.007 13.896a.68.68 0 0 0 .494-.205.667.667 0 0 0 .208-.493v-3.48a.674.674 0 0 0-.204-.492.665.665 0 0 0-.49-.205.68.68 0 0 0-.494.205.667.667 0 0 0-.208.493v3.48c0 .19.068.355.204.492.136.137.3.205.49.205Zm-.013-6.313a.701.701 0 0 0 .507-.201.668.668 0 0 0 .208-.5.701.701 0 0 0-.202-.507.668.668 0 0 0-.5-.208.701.701 0 0 0-.506.202.668.668 0 0 0-.209.5c0 .198.068.367.202.506a.668.668 0 0 0 .5.208Zm.012 10.209a7.594 7.594 0 0 1-3.028-.61 7.85 7.85 0 0 1-4.16-4.162 7.588 7.588 0 0 1-.609-3.03c0-1.075.203-2.083.61-3.022a7.884 7.884 0 0 1 4.162-4.15 7.589 7.589 0 0 1 3.03-.61c1.075 0 2.083.204 3.022.61a7.884 7.884 0 0 1 4.15 4.157 7.54 7.54 0 0 1 .61 3.02 7.594 7.594 0 0 1-.61 3.027 7.852 7.852 0 0 1-4.158 4.16 7.541 7.541 0 0 1-3.019.61Z"
-      />
-    </svg>
-  )
-}
diff --git a/apps/scandic-web/components/Icons/Logos/DowntownCamper.tsx b/packages/design-system/lib/components/Icons/Logos/DowntownCamper.tsx
similarity index 97%
rename from apps/scandic-web/components/Icons/Logos/DowntownCamper.tsx
rename to packages/design-system/lib/components/Icons/Logos/DowntownCamper.tsx
index 97baf9820..53b34f67e 100644
--- a/apps/scandic-web/components/Icons/Logos/DowntownCamper.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/DowntownCamper.tsx
@@ -1,12 +1,11 @@
-import { iconVariants } from "../variants"
-
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
+import { iconVariants } from '../variants'
 
 export default function DowntownCamperIcon({
   className,
   color,
   ...props
-}: IconProps) {
+}: LogoAndIllustrationProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
diff --git a/apps/scandic-web/components/Icons/Logos/GrandHotelOslo.tsx b/packages/design-system/lib/components/Icons/Logos/GrandHotelOslo.tsx
similarity index 99%
rename from apps/scandic-web/components/Icons/Logos/GrandHotelOslo.tsx
rename to packages/design-system/lib/components/Icons/Logos/GrandHotelOslo.tsx
index 1cac092f7..8b5907490 100644
--- a/apps/scandic-web/components/Icons/Logos/GrandHotelOslo.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/GrandHotelOslo.tsx
@@ -1,12 +1,12 @@
-import { iconVariants } from "../variants"
+import { iconVariants } from '../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
 export default function GrandHotelOsloLogoIcon({
   className,
   color,
   ...props
-}: IconProps) {
+}: LogoAndIllustrationProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
diff --git a/apps/scandic-web/components/Icons/Logos/Haymarket.tsx b/packages/design-system/lib/components/Icons/Logos/Haymarket.tsx
similarity index 96%
rename from apps/scandic-web/components/Icons/Logos/Haymarket.tsx
rename to packages/design-system/lib/components/Icons/Logos/Haymarket.tsx
index 00d8519fb..252c627f0 100644
--- a/apps/scandic-web/components/Icons/Logos/Haymarket.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/Haymarket.tsx
@@ -1,12 +1,12 @@
-import { iconVariants } from "../variants"
+import { iconVariants } from '../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
 export default function HaymarketIcon({
   className,
   color,
   ...props
-}: IconProps) {
+}: LogoAndIllustrationProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
diff --git a/apps/scandic-web/components/Icons/Logos/HotelNorge.tsx b/packages/design-system/lib/components/Icons/Logos/HotelNorge.tsx
similarity index 97%
rename from apps/scandic-web/components/Icons/Logos/HotelNorge.tsx
rename to packages/design-system/lib/components/Icons/Logos/HotelNorge.tsx
index daa5ff940..eb246c642 100644
--- a/apps/scandic-web/components/Icons/Logos/HotelNorge.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/HotelNorge.tsx
@@ -1,12 +1,12 @@
-import { iconVariants } from "../variants"
+import { iconVariants } from '../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
 export default function HotelNorgeIcon({
   className,
   color,
   ...props
-}: IconProps) {
+}: LogoAndIllustrationProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
diff --git a/apps/scandic-web/components/Icons/Logos/Marski.tsx b/packages/design-system/lib/components/Icons/Logos/Marski.tsx
similarity index 95%
rename from apps/scandic-web/components/Icons/Logos/Marski.tsx
rename to packages/design-system/lib/components/Icons/Logos/Marski.tsx
index 57473a53a..ceac6d33f 100644
--- a/apps/scandic-web/components/Icons/Logos/Marski.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/Marski.tsx
@@ -1,12 +1,12 @@
-import { iconVariants } from "../variants"
+import { iconVariants } from '../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
 export default function MarskiLogoIcon({
   className,
   color,
   ...props
-}: IconProps) {
+}: LogoAndIllustrationProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
diff --git a/apps/scandic-web/components/Icons/Logos/ScandicGoLogo.tsx b/packages/design-system/lib/components/Icons/Logos/ScandicGoLogo.tsx
similarity index 98%
rename from apps/scandic-web/components/Icons/Logos/ScandicGoLogo.tsx
rename to packages/design-system/lib/components/Icons/Logos/ScandicGoLogo.tsx
index 8878cf16c..f06969d56 100644
--- a/apps/scandic-web/components/Icons/Logos/ScandicGoLogo.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/ScandicGoLogo.tsx
@@ -1,12 +1,12 @@
-import { iconVariants } from "../variants"
+import { iconVariants } from '../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
 export default function ScandicGoLogoIcon({
   className,
   color,
   ...props
-}: IconProps) {
+}: LogoAndIllustrationProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
diff --git a/apps/scandic-web/components/Icons/Logos/ScandicLogo.tsx b/packages/design-system/lib/components/Icons/Logos/ScandicLogo.tsx
similarity index 96%
rename from apps/scandic-web/components/Icons/Logos/ScandicLogo.tsx
rename to packages/design-system/lib/components/Icons/Logos/ScandicLogo.tsx
index f96025768..3999d7db8 100644
--- a/apps/scandic-web/components/Icons/Logos/ScandicLogo.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/ScandicLogo.tsx
@@ -1,12 +1,12 @@
-import { iconVariants } from "../variants"
+import { iconVariants } from '../variants'
 
-import type { IconProps } from "@/types/components/icon"
+import type { LogoAndIllustrationProps } from '../icon'
 
 export default function ScandicLogoIcon({
   className,
   color,
   ...props
-}: IconProps) {
+}: LogoAndIllustrationProps) {
   const classNames = iconVariants({ className, color })
   return (
     <svg
diff --git a/apps/scandic-web/components/Icons/Logos/index.tsx b/packages/design-system/lib/components/Icons/Logos/index.tsx
similarity index 65%
rename from apps/scandic-web/components/Icons/Logos/index.tsx
rename to packages/design-system/lib/components/Icons/Logos/index.tsx
index 8a6eefecb..f4c09e451 100644
--- a/apps/scandic-web/components/Icons/Logos/index.tsx
+++ b/packages/design-system/lib/components/Icons/Logos/index.tsx
@@ -6,11 +6,26 @@ import {
   MarskiLogoIcon,
   ScandicGoLogoIcon,
   ScandicLogoIcon,
-} from "@/components/Icons"
+} from '..'
 
-import type { HotelLogoProps } from "@/types/components/hotelLogo"
-import { HotelTypeEnum } from "@/types/enums/hotelType"
-import { SignatureHotelEnum } from "@/types/enums/signatureHotel"
+type HotelLogoProps = {
+  hotelId: string
+  hotelType: string
+}
+
+enum HotelTypeEnum {
+  Signature = 'signature',
+  ScandicGo = 'scandicgo',
+  Regular = 'regular',
+}
+
+enum SignatureHotelEnum {
+  DowntownCamper = '879',
+  GrandHotelOslo = '340',
+  Haymarket = '890',
+  HotelNorge = '785',
+  Marski = '605',
+}
 
 export default function HotelLogo({ hotelId, hotelType }: HotelLogoProps) {
   if (hotelType === HotelTypeEnum.ScandicGo) {
@@ -29,6 +44,6 @@ export default function HotelLogo({ hotelId, hotelType }: HotelLogoProps) {
     case SignatureHotelEnum.Marski:
       return <MarskiLogoIcon />
     default:
-      return <ScandicLogoIcon color="red" />
+      return <ScandicLogoIcon color="Icon/Interactive/Accent" />
   }
 }
diff --git a/packages/design-system/lib/components/Icons/MaterialIcon/MaterialIcon.tsx b/packages/design-system/lib/components/Icons/MaterialIcon/MaterialIcon.tsx
new file mode 100644
index 000000000..72c937272
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/MaterialIcon/MaterialIcon.tsx
@@ -0,0 +1,36 @@
+import {
+  MaterialSymbol,
+  type MaterialSymbolProps,
+} from 'react-material-symbols'
+
+import { iconVariants } from '../variants'
+
+import type { VariantProps } from 'class-variance-authority'
+
+export interface MaterialIconProps
+  extends Omit<MaterialSymbolProps, 'color' | 'fill'>,
+    VariantProps<typeof iconVariants> {
+  isFilled?: boolean
+}
+
+export type MaterialIconSetIconProps = Omit<MaterialIconProps, 'icon'>
+
+export function MaterialIcon({
+  icon,
+  color,
+  size = 24,
+  isFilled = false,
+  className,
+  ...props
+}: MaterialIconProps) {
+  const classNames = iconVariants({ className, color })
+  return (
+    <MaterialSymbol
+      icon={icon}
+      size={size}
+      className={classNames}
+      fill={isFilled}
+      {...props}
+    />
+  )
+}
diff --git a/packages/design-system/lib/components/Icons/MaterialIcon/index.tsx b/packages/design-system/lib/components/Icons/MaterialIcon/index.tsx
new file mode 100644
index 000000000..ba4c7676c
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/MaterialIcon/index.tsx
@@ -0,0 +1,5 @@
+export {
+  MaterialIcon,
+  type MaterialIconProps,
+  type MaterialIconSetIconProps,
+} from './MaterialIcon'
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/bathroom-cabinet-2.tsx b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/bathroom-cabinet-2.tsx
new file mode 100644
index 000000000..7e26d5dc7
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/bathroom-cabinet-2.tsx
@@ -0,0 +1,67 @@
+import type { NucleoIconProps } from '../../icon'
+import { colorVariants } from '../colorVariants'
+
+function BathroomCabinet2(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <rect
+          height="8"
+          width="17.999"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x="3.001"
+          y="15"
+        />
+        <path
+          d="M9,11a2,2,0,0,1,4,0h0v4"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="7.999"
+          x2="19.999"
+          y1="19"
+          y2="19"
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="8"
+          x2="7.999"
+          y1="15"
+          y2="23"
+        />
+        <polyline
+          fill="none"
+          points="5 11 1 11 1 1 23 1 23 11 17 11"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default BathroomCabinet2
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/conference-room.tsx b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/conference-room.tsx
new file mode 100644
index 000000000..0c493630c
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/conference-room.tsx
@@ -0,0 +1,92 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function ConferenceRoom(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <rect
+          height="18"
+          width="10"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x="7"
+          y="3"
+        />
+        <circle cx="2" cy="6" fill={fill} r="1" stroke="none" />
+        <circle cx="2" cy="12" fill={fill} r="1" stroke="none" />
+        <circle cx="2" cy="18" fill={fill} r="1" stroke="none" />
+        <circle cx="22" cy="6" fill={fill} r="1" stroke="none" />
+        <circle cx="22" cy="12" fill={fill} r="1" stroke="none" />
+        <circle cx="22" cy="18" fill={fill} r="1" stroke="none" />
+        <circle
+          cx="2"
+          cy="6"
+          fill="none"
+          r="1"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <circle
+          cx="2"
+          cy="12"
+          fill="none"
+          r="1"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <circle
+          cx="2"
+          cy="18"
+          fill="none"
+          r="1"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <circle
+          cx="22"
+          cy="6"
+          fill="none"
+          r="1"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <circle
+          cx="22"
+          cy="12"
+          fill="none"
+          r="1"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <circle
+          cx="22"
+          cy="18"
+          fill="none"
+          r="1"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default ConferenceRoom
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/door-2.tsx b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/door-2.tsx
new file mode 100644
index 000000000..9613b9bae
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/door-2.tsx
@@ -0,0 +1,56 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function Door2(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <rect
+          height="22"
+          width="16"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x="4"
+          y="1"
+        />
+        <rect
+          height="6"
+          width="8"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x="8"
+          y="5"
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="8"
+          x2="8"
+          y1="15"
+          y2="17"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default Door2
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/hairdresser-1.tsx b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/hairdresser-1.tsx
new file mode 100644
index 000000000..4ad328948
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/hairdresser-1.tsx
@@ -0,0 +1,92 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function Hairdresser1(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="16"
+          x2="19"
+          y1="5"
+          y2="5"
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="16"
+          x2="19"
+          y1="9"
+          y2="9"
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="12"
+          x2="6"
+          y1="1"
+          y2="18"
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="4"
+          x2="10"
+          y1="1"
+          y2="18"
+        />
+        <path
+          d="M16,13h.79a2,2,0,0,1,1.99,2.2L18,23h5V3a2,2,0,0,0-2-2H16"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <rect
+          height="7"
+          width="5"
+          fill="none"
+          rx="2.5"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x="1"
+          y="16"
+        />
+        <rect
+          height="7"
+          width="5"
+          fill="none"
+          rx="2.5"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          transform="translate(25 39) rotate(180)"
+          x="10"
+          y="16"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default Hairdresser1
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/record-player-3.tsx b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/record-player-3.tsx
new file mode 100644
index 000000000..1aef54633
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/record-player-3.tsx
@@ -0,0 +1,51 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function RecordPlayer3(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <path
+          d="M18 9V14L16.5 16"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M2 6L2 18C2 19.1046 2.89543 20 4 20L20 20C21.1046 20 22 19.1046 22 18L22 6C22 4.89543 21.1046 4 20 4L4 4C2.89543 4 2 4.89543 2 6Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M10 16C12.2091 16 14 14.2091 14 12C14 9.79086 12.2091 8 10 8C7.79086 8 6 9.79086 6 12C6 14.2091 7.79086 16 10 16Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M10 13C10.5523 13 11 12.5523 11 12C11 11.4477 10.5523 11 10 11C9.44772 11 9 11.4477 9 12C9 12.5523 9.44772 13 10 13Z"
+          fill={fill}
+          stroke="none"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default RecordPlayer3
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/toilet-2.tsx b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/toilet-2.tsx
new file mode 100644
index 000000000..9dfb1ba31
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/toilet-2.tsx
@@ -0,0 +1,49 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function Toilet2(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <path
+          d="M6,8V3A2.006,2.006,0,0,1,8,1h8a2.006,2.006,0,0,1,2,2V8"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M21,12H3v2a6.018,6.018,0,0,0,6,6H9v3h6V20h0a6.018,6.018,0,0,0,6-6Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="3.1"
+          x2="20.9"
+          y1="15"
+          y2="15"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default Toilet2
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/user-police-2.tsx b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/user-police-2.tsx
new file mode 100644
index 000000000..446d8abf3
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Amenities&Facilities/user-police-2.tsx
@@ -0,0 +1,58 @@
+import type { NucleoIconProps } from '../../icon'
+import { colorVariants } from '../colorVariants'
+
+function UserPolice2(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <path
+          d="m4,22.429l3.549-1.014c.859-.245,1.451-1.03,1.451-1.923v-1.239"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="m20,22.429l-3.549-1.014c-.859-.245-1.451-1.03-1.451-1.923v-1.239"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="m18.473,8.408c.091.509.124,1.038.09,1.578l-.189,3.025c-.21,3.366-3.002,5.988-6.374,5.988h0c-3.373,0-6.164-2.622-6.374-5.988l-.189-3.025c-.034-.541-.001-1.069.09-1.579"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="m12,12c-6.406,0-6.576-4-6.576-4h13.153s-.17,4-6.576,4Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="m18.576,8l1.495-3.109c.238-.494.039-1.098-.456-1.334-2.349-1.12-4.885-1.893-7.616-2.307-2.73.414-5.267,1.187-7.616,2.307-.495.236-.693.84-.456,1.334l1.495,3.109"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <circle cx="12" cy="4.75" fill={fill} r="1.5" strokeWidth="0" />
+      </g>
+    </svg>
+  )
+}
+
+export default UserPolice2
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Benefits/bouquet.tsx b/packages/design-system/lib/components/Icons/Nucleo/Benefits/bouquet.tsx
new file mode 100644
index 000000000..9a1a3d0c6
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Benefits/bouquet.tsx
@@ -0,0 +1,59 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function Bouquet(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <path
+          d="M20.45,11.5a1.707,1.707,0,0,0-2.415,0,1.706,1.706,0,0,1-2.414,0,1.706,1.706,0,0,0-2.414,0,1.706,1.706,0,0,1-2.414,0,1.706,1.706,0,0,0-2.414,0,1.706,1.706,0,0,1-2.414,0,1.707,1.707,0,0,0-2.415,0L10,19h4Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M11.378,2.877A6.631,6.631,0,0,1,16,1V4A4,4,0,0,1,8,4V1a4,4,0,0,1,4,4"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M6,8a2.528,2.528,0,0,1,.5-5H8"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M18,8a2.528,2.528,0,0,0-.5-5H16"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <polyline
+          fill="none"
+          points="10 19 9 23 15 23 14 19"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default Bouquet
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Benefits/discount-2-2.tsx b/packages/design-system/lib/components/Icons/Nucleo/Benefits/discount-2-2.tsx
new file mode 100644
index 000000000..494afd44f
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Benefits/discount-2-2.tsx
@@ -0,0 +1,59 @@
+import { colorVariants } from '../colorVariants'
+import type { NucleoIconProps } from '../../icon'
+
+function Discount22(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <polygon
+          fill="none"
+          points="19,15 22,12 19,9 19,5 15,5 12,2 9,5 5,5 5,9 2,12 5,15 5,19 9,19 12,22 15,19 19,19 "
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="15"
+          x2="9"
+          y1="9"
+          y2="15"
+        />
+        <circle
+          cx="9.5"
+          cy="9.5"
+          fill={fill}
+          r="1.5"
+          stroke="none"
+          strokeLinejoin="miter"
+        />
+        <circle
+          cx="14.5"
+          cy="14.5"
+          fill={fill}
+          r="1.5"
+          stroke="none"
+          strokeLinejoin="miter"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default Discount22
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Experiences/bowling-pins.tsx b/packages/design-system/lib/components/Icons/Nucleo/Experiences/bowling-pins.tsx
new file mode 100644
index 000000000..a2870f99f
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Experiences/bowling-pins.tsx
@@ -0,0 +1,41 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function BowlingPins(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <path
+          d="M18.575,23A13.8,13.8,0,0,0,20,16.5c0-4-2-6-2-9,0-2.5.5-2.5.5-4a2.5,2.5,0,0,0-5,0c0,1.5.5,1.5.5,4,0,3-2,5-2,9A13.8,13.8,0,0,0,13.425,23Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M9.952,11.247a7.883,7.883,0,0,1-.7-2.929c0-2.045.438-2.045.438-3.273A2.121,2.121,0,0,0,7.5,3,2.121,2.121,0,0,0,5.312,5.045c0,1.228.438,1.228.438,3.273C5.75,10.773,4,12.409,4,15.682A10.7,10.7,0,0,0,5.247,21H10"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default BowlingPins
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Experiences/palm-tree-2.tsx b/packages/design-system/lib/components/Icons/Nucleo/Experiences/palm-tree-2.tsx
new file mode 100644
index 000000000..f5080edd0
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Experiences/palm-tree-2.tsx
@@ -0,0 +1,68 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function PalmTree2(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <path
+          d="M11.4,23a21.14,21.14,0,0,0,1.594-8.059A21.111,21.111,0,0,0,11,6"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M4,15l7-9C6,6,2,9,4,15Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M21,12,11,6S20,2,21,12Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M11,6,3,5S7-1,11,6Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M11,6l9-3S11.971-2.161,11,6Z"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="1"
+          x2="23"
+          y1="23"
+          y2="23"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default PalmTree2
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Food/chips-3.tsx b/packages/design-system/lib/components/Icons/Nucleo/Food/chips-3.tsx
new file mode 100644
index 000000000..f5bd9ec9e
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Food/chips-3.tsx
@@ -0,0 +1,70 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function Chips3(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <polyline
+          fill="none"
+          points="4,9 4,3 8,3 "
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <polyline
+          fill="none"
+          points="16,9 16,2 20,2 20,9 "
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <polyline
+          fill="none"
+          points="8,9 8,1 12,1 12,9 "
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="12"
+          x2="16"
+          y1="5"
+          y2="5"
+        />
+        <polygon
+          fill="none"
+          points="19,23 5,23 2,9 22,9 "
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <circle
+          cx="12"
+          cy="16"
+          fill="none"
+          r="3"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default Chips3
diff --git a/packages/design-system/lib/components/Icons/Nucleo/Food/popcorn-2.tsx b/packages/design-system/lib/components/Icons/Nucleo/Food/popcorn-2.tsx
new file mode 100644
index 000000000..26deaa2bb
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/Food/popcorn-2.tsx
@@ -0,0 +1,59 @@
+import { colorVariants } from '../colorVariants'
+
+import type { NucleoIconProps } from '../../icon'
+
+function Popcorn2(props: NucleoIconProps) {
+  const fill = props.color ? colorVariants[props.color] : 'currentColor'
+  const strokewidth = props.strokewidth || 2
+  const width = props.size || '1em'
+  const height = props.size || '1em'
+
+  return (
+    <svg
+      height={height}
+      width={width}
+      viewBox="0 0 24 24"
+      xmlns="http://www.w3.org/2000/svg"
+    >
+      <g
+        fill={fill}
+        strokeLinecap="round"
+        strokeLinejoin="round"
+        transform="translate(0.25 0.25)"
+      >
+        <polygon
+          fill="none"
+          points="21 7 3 7 5 23 19 23 21 7"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <path
+          d="M19,5a3,3,0,0,0-3-3,2.97,2.97,0,0,0-1.47.4,2.986,2.986,0,0,0-5.06,0A2.97,2.97,0,0,0,8,2,3,3,0,0,0,5,5"
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="9"
+          x2="8"
+          y1="23"
+          y2="7"
+        />
+        <line
+          fill="none"
+          stroke={fill}
+          strokeWidth={strokewidth}
+          x1="15"
+          x2="16"
+          y1="23"
+          y2="7"
+        />
+      </g>
+    </svg>
+  )
+}
+
+export default Popcorn2
diff --git a/packages/design-system/lib/components/Icons/Nucleo/colorVariants.ts b/packages/design-system/lib/components/Icons/Nucleo/colorVariants.ts
new file mode 100644
index 000000000..87e06dda0
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/Nucleo/colorVariants.ts
@@ -0,0 +1,17 @@
+export const colorVariants = {
+  'Icon/Default': 'var(--Icon-Default)',
+  'Icon/Intense': 'var(--Icon-Intense)',
+  'Icon/Accent': 'var(--Icon-Accent)',
+  'Icon/Inverted': 'var(--Icon-Inverted)',
+  'Icon/Interactive/Default': 'var(--Icon-Interactive-Default)',
+  'Icon/Interactive/Secondary': 'var(--Icon-Interactive-Secondary)',
+  'Icon/Interactive/Accent': 'var(--Icon-Interactive-Accent)',
+  'Icon/Interactive/Disabled': 'var(--Icon-Interactive-Disabled)',
+  'Icon/Interactive/Placeholder': 'var(--Icon-Interactive-Placeholder)',
+  'Icon/Feedback/Information': 'var(--Icon-Feedback-Information)',
+  'Icon/Feedback/Success': 'var(--Icon-Feedback-Success)',
+  'Icon/Feedback/Warning': 'var(--Icon-Feedback-Warning)',
+  'Icon/Feedback/Error': 'var(--Icon-Feedback-Error)',
+  'Icon/Feedback/Neutral': 'var(--Icon-Feedback-Neutral)',
+  CurrentColor: 'currentColor',
+}
diff --git a/packages/design-system/lib/components/Icons/icon.module.css b/packages/design-system/lib/components/Icons/icon.module.css
new file mode 100644
index 000000000..fcccd83c6
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/icon.module.css
@@ -0,0 +1,96 @@
+.icon {
+  margin: 0;
+}
+
+/* Icon */
+.iconDefault,
+.iconDefault * {
+  color: var(--Icon-Default);
+  fill: var(--Icon-Default);
+}
+
+.iconIntense,
+.iconIntense * {
+  color: var(--Icon-Intense);
+  fill: var(--Icon-Intense);
+}
+
+.iconAccent,
+.iconAccent * {
+  color: var(--Icon-Accent);
+  fill: var(--Icon-Accent);
+}
+
+.iconInverted,
+.iconInverted * {
+  color: var(--Icon-Inverted);
+  fill: var(--Icon-Inverted);
+}
+
+/* Icon / Interactive */
+.iconInteractiveDefault,
+.iconInteractiveDefault * {
+  color: var(--Icon-Interactive-Default);
+  fill: var(--Icon-Interactive-Default);
+}
+
+.iconInteractiveSecondary,
+.iconInteractiveSecondary * {
+  color: var(--Icon-Interactive-Secondary);
+  fill: var(--Icon-Interactive-Secondary);
+}
+
+.iconInteractiveAccent,
+.iconInteractiveAccent * {
+  color: var(--Icon-Interactive-Accent);
+  fill: var(--Icon-Interactive-Accent);
+}
+
+.iconInteractiveDisabled,
+.iconInteractiveDisabled * {
+  color: var(--Icon-Interactive-Disabled);
+  fill: var(--Icon-Interactive-Disabled);
+}
+
+.iconInteractivePlaceholder,
+.iconInteractivePlaceholder * {
+  color: var(--Icon-Interactive-Placeholder);
+  fill: var(--Icon-Interactive-Placeholder);
+}
+
+/* Icon / Feedback */
+.iconFeedbackInformation,
+.iconFeedbackInformation * {
+  color: var(--Icon-Feedback-Information);
+  fill: var(--Icon-Feedback-Information);
+}
+
+.iconFeedbackSuccess,
+.iconFeedbackSuccess * {
+  color: var(--Icon-Feedback-Success);
+  fill: var(--Icon-Feedback-Success);
+}
+
+.iconFeedbackWarning,
+.iconFeedbackWarning * {
+  color: var(--Icon-Feedback-Warning);
+  fill: var(--Icon-Feedback-Warning);
+}
+
+.iconFeedbackError,
+.iconFeedbackError * {
+  color: var(--Icon-Feedback-Error);
+  fill: var(--Icon-Feedback-Error);
+}
+
+.iconFeedbackNeutral,
+.iconFeedbackNeutral * {
+  color: var(--Icon-Feedback-Neutral);
+  fill: var(--Icon-Feedback-Neutral);
+}
+
+.currentColor,
+.currentColor * {
+  color: currentColor;
+  fill: currentColor;
+}
diff --git a/packages/design-system/lib/components/Icons/icon.ts b/packages/design-system/lib/components/Icons/icon.ts
new file mode 100644
index 000000000..b81c3473f
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/icon.ts
@@ -0,0 +1,19 @@
+import type { VariantProps } from 'class-variance-authority'
+import { iconVariants } from './variants'
+
+export interface IconProps
+  extends Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'>,
+    VariantProps<typeof iconVariants> {
+  size?: number
+}
+
+export interface LogoAndIllustrationProps
+  extends Omit<React.SVGAttributes<HTMLOrSVGElement>, 'color'>,
+    VariantProps<typeof iconVariants> {
+  width?: string | number
+  height?: string | number
+}
+
+export interface NucleoIconProps extends IconProps {
+  strokewidth?: number
+}
diff --git a/packages/design-system/lib/components/Icons/index.tsx b/packages/design-system/lib/components/Icons/index.tsx
new file mode 100644
index 000000000..ed392b0ae
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/index.tsx
@@ -0,0 +1,71 @@
+export { default as BedHotelIcon } from './Customised/Amenities&Facilities/BedHotel'
+export { default as CoolingIcon } from './Customised/Amenities&Facilities/Cooling'
+export { default as CouchTableIcon } from './Customised/Amenities&Facilities/CouchTable'
+export { default as FootStoolIcon } from './Customised/Amenities&Facilities/FootStool'
+export { default as HairDryerIcon } from './Customised/Amenities&Facilities/Hairdryer'
+export { default as HandSoapIcon } from './Customised/Amenities&Facilities/HandSoap'
+export { default as IceMachineIcon } from './Customised/Amenities&Facilities/IceMachine'
+export { default as MassageIcon } from './Customised/Amenities&Facilities/Massage'
+export { default as MdiBunkBedIcon } from './Customised/Amenities&Facilities/MdiBunkBedOutline'
+export { default as MirrorIcon } from './Customised/Amenities&Facilities/Mirror'
+export { default as MovingBedsIcon } from './Customised/Amenities&Facilities/MovingBeds'
+export { default as RoadIcon } from './Customised/Amenities&Facilities/Road'
+export { default as RugIcon } from './Customised/Amenities&Facilities/Rug'
+export { default as SafetyBoxIcon } from './Customised/Amenities&Facilities/SafetyBox'
+export { default as SlippersIcon } from './Customised/Amenities&Facilities/Slippers'
+export { default as TowelIcon } from './Customised/Amenities&Facilities/Towel'
+export { default as ViewIcon } from './Customised/Amenities&Facilities/View'
+export { default as WardIcon } from './Customised/Amenities&Facilities/Ward'
+export { default as WindowNotAvailableIcon } from './Customised/Amenities&Facilities/WindowNotAvailable'
+export { default as WoodFloorIcon } from './Customised/Amenities&Facilities/WoodFloor'
+export { default as DiamondAddIcon } from './Customised/Benefits/DiamondAdd'
+export { default as FacebookIcon } from './Customised/Socials/Facebook'
+export { default as InstagramIcon } from './Customised/Socials/Instagram'
+export { default as TripadvisorIcon } from './Customised/Socials/Tripadvisor'
+export { default as MinimizeIcon } from './Customised/UI/Minimize'
+export { default as BedIcon } from './Illustrations/Bed'
+export { default as CoinIcon } from './Illustrations/Coin'
+export { default as CroissantCoffeeEggIcon } from './Illustrations/CroissantCoffeeEgg'
+export { default as CutleryOneIcon } from './Illustrations/CutleryOne'
+export { default as CutleryTwoIcon } from './Illustrations/CutleryTwo'
+export { default as GiftOpenIcon } from './Illustrations/GiftOpen'
+export { default as HandKeyIcon } from './Illustrations/HandKey'
+export { default as HotelNightIcon } from './Illustrations/HotelNight'
+export { default as KidsIcon } from './Illustrations/Kids'
+export { default as KidsMocktailIcon } from './Illustrations/KidsMocktail'
+export { default as MagicWandIcon } from './Illustrations/MagicWand'
+export { default as MoneyHandIcon } from './Illustrations/MoneyHand'
+export { default as SurpriseIcon } from './Illustrations/Surprise'
+export { default as VoucherIcon } from './Illustrations/Voucher'
+export { default as DowntownCamperIcon } from './Logos/DowntownCamper'
+export { default as GrandHotelOsloLogoIcon } from './Logos/GrandHotelOslo'
+export { default as HaymarketIcon } from './Logos/Haymarket'
+export { default as HotelNorgeIcon } from './Logos/HotelNorge'
+export { default as MarskiLogoIcon } from './Logos/Marski'
+export { default as ScandicGoLogoIcon } from './Logos/ScandicGoLogo'
+export { default as ScandicLogoIcon } from './Logos/ScandicLogo'
+export { default as BathroomCabinet2Icon } from './Nucleo/Amenities&Facilities/bathroom-cabinet-2'
+export { default as ConferenceRoomIcon } from './Nucleo/Amenities&Facilities/conference-room'
+export { default as Door2Icon } from './Nucleo/Amenities&Facilities/door-2'
+export { default as Hairdresser1Icon } from './Nucleo/Amenities&Facilities/hairdresser-1'
+export { default as RecordPlayer3Icon } from './Nucleo/Amenities&Facilities/record-player-3'
+export { default as Toilet2Icon } from './Nucleo/Amenities&Facilities/toilet-2'
+export { default as UserPolice2Icon } from './Nucleo/Amenities&Facilities/user-police-2'
+export { default as BouquetIcon } from './Nucleo/Benefits/bouquet'
+export { default as Discount22Icon } from './Nucleo/Benefits/discount-2-2'
+export { default as BowlingPinsIcon } from './Nucleo/Experiences/bowling-pins'
+export { default as PalmTree2Icon } from './Nucleo/Experiences/palm-tree-2'
+export { default as Chips3Icon } from './Nucleo/Food/chips-3'
+export { default as Popcorn2Icon } from './Nucleo/Food/popcorn-2'
+export { default as HotelLogo } from './Logos'
+export { MaterialIcon } from './MaterialIcon'
+
+export type {
+  MaterialIconProps,
+  MaterialIconSetIconProps,
+} from './MaterialIcon'
+export type {
+  IconProps,
+  LogoAndIllustrationProps,
+  NucleoIconProps,
+} from './icon'
diff --git a/packages/design-system/lib/components/Icons/variants.ts b/packages/design-system/lib/components/Icons/variants.ts
new file mode 100644
index 000000000..54f72bf70
--- /dev/null
+++ b/packages/design-system/lib/components/Icons/variants.ts
@@ -0,0 +1,33 @@
+import { cva } from 'class-variance-authority'
+
+import styles from './icon.module.css'
+
+export const iconVariantConfig = {
+  variants: {
+    color: {
+      'Icon/Default': styles.iconDefault,
+      'Icon/Intense': styles.iconIntense,
+      'Icon/Accent': styles.iconAccent,
+      'Icon/Inverted': styles.iconInverted,
+
+      'Icon/Interactive/Default': styles.iconInteractiveDefault,
+      'Icon/Interactive/Secondary': styles.iconInteractiveSecondary,
+      'Icon/Interactive/Accent': styles.iconInteractiveAccent,
+      'Icon/Interactive/Disabled': styles.iconInteractiveDisabled,
+      'Icon/Interactive/Placeholder': styles.iconInteractivePlaceholder,
+
+      'Icon/Feedback/Information': styles.iconFeedbackInformation,
+      'Icon/Feedback/Success': styles.iconFeedbackSuccess,
+      'Icon/Feedback/Warning': styles.iconFeedbackWarning,
+      'Icon/Feedback/Neutral': styles.iconFeedbackNeutral,
+      'Icon/Feedback/Error': styles.iconFeedbackError,
+
+      CurrentColor: styles.currentColor,
+    },
+  },
+  defaultVariants: {
+    color: 'Icon/Default',
+  },
+} as const
+
+export const iconVariants = cva(styles.icon, iconVariantConfig)
diff --git a/packages/design-system/lib/components/RateCard/Campaign/index.tsx b/packages/design-system/lib/components/RateCard/Campaign/index.tsx
index 452b54c40..b205def33 100644
--- a/packages/design-system/lib/components/RateCard/Campaign/index.tsx
+++ b/packages/design-system/lib/components/RateCard/Campaign/index.tsx
@@ -3,8 +3,8 @@ import { Rate } from '../types'
 
 import styles from '../rate-card.module.css'
 import { Button } from '../../Button'
-import InfoCircleIcon from '../../Icons/InfoCircle'
 import { variants } from '../variants'
+import { MaterialIcon } from '../../Icons'
 
 interface CampaignRateCardProps {
   name: string
@@ -67,7 +67,7 @@ export default function CampaignRateCard({
                   size="Small"
                   onPress={handleTermsClick}
                 >
-                  <InfoCircleIcon height={20} width={20} />
+                  <MaterialIcon icon="info" size={20} color="CurrentColor" />
                 </Button>
                 {rateTitle}
                 <span className={styles.textSecondary}>
diff --git a/packages/design-system/lib/components/RateCard/Code/index.tsx b/packages/design-system/lib/components/RateCard/Code/index.tsx
index ddf353df2..03c3adfc3 100644
--- a/packages/design-system/lib/components/RateCard/Code/index.tsx
+++ b/packages/design-system/lib/components/RateCard/Code/index.tsx
@@ -3,8 +3,8 @@ import { Rate } from '../types'
 import styles from '../rate-card.module.css'
 import { Typography } from '../../Typography'
 import { Button } from '../../Button'
-import InfoCircleIcon from '../../Icons/InfoCircle'
 import { variants } from '../variants'
+import { MaterialIcon } from '../../Icons'
 
 interface CodeRateCardProps {
   name: string
@@ -63,7 +63,7 @@ export default function CodeRateCard({
                   size="Small"
                   onPress={handleTermsClick}
                 >
-                  <InfoCircleIcon height={20} width={20} />
+                  <MaterialIcon icon="info" size={20} color="CurrentColor" />
                 </Button>
                 {rateTitle}
                 <span className={styles.textSecondary}>
diff --git a/packages/design-system/lib/components/RateCard/NoRateAvailable/index.tsx b/packages/design-system/lib/components/RateCard/NoRateAvailable/index.tsx
index 18392e36d..b18702f9b 100644
--- a/packages/design-system/lib/components/RateCard/NoRateAvailable/index.tsx
+++ b/packages/design-system/lib/components/RateCard/NoRateAvailable/index.tsx
@@ -1,8 +1,8 @@
 import styles from '../rate-card.module.css'
 import { Typography } from '../../Typography'
 import { Button } from '../../Button'
-import InfoCircleIcon from '../../Icons/InfoCircle'
 import { variants } from '../variants'
+import { MaterialIcon } from '../../Icons'
 
 interface NoRateAvailableCardProps {
   variant: 'Regular' | 'Campaign' | 'Code' | 'Points'
@@ -42,7 +42,7 @@ export default function NoRateAvailableCard({
                 size="Small"
                 onPress={handleTermsClick}
               >
-                <InfoCircleIcon height={20} width={20} />
+                <MaterialIcon icon="info" size={20} color="CurrentColor" />
               </Button>
               {`${rateTitle} / ${paymentTerm}`}
             </h3>
diff --git a/packages/design-system/lib/components/RateCard/Points/index.tsx b/packages/design-system/lib/components/RateCard/Points/index.tsx
index d67b991d1..62034e097 100644
--- a/packages/design-system/lib/components/RateCard/Points/index.tsx
+++ b/packages/design-system/lib/components/RateCard/Points/index.tsx
@@ -3,11 +3,10 @@ import { RatePointsOption } from '../types'
 
 import styles from '../rate-card.module.css'
 import { Button } from '../../Button'
-import InfoCircleIcon from '../../Icons/InfoCircle'
-import InfoCircleFilledIcon from '../../Icons/InfoCircleFilled'
 import { Radio } from '../../Radio'
 import { RadioGroup } from 'react-aria-components'
 import { variants } from '../variants'
+import { MaterialIcon } from '../../Icons'
 
 interface PointsRateCardProps {
   rateTitle: string
@@ -51,7 +50,7 @@ export default function PointsRateCard({
                 size="Small"
                 onPress={handleTermsClick}
               >
-                <InfoCircleIcon height={20} width={20} />
+                <MaterialIcon icon="info" size={20} color="CurrentColor" />
               </Button>
               {rateTitle}
               <span className={styles.textSecondary}>
@@ -100,7 +99,7 @@ export default function PointsRateCard({
             <Typography variant="Body/Supporting text (caption)/smBold">
               <p className={styles.notEnoughPoints}>
                 <div className={styles.filledIcon}>
-                  <InfoCircleFilledIcon height={20} width={20} />
+                  <MaterialIcon icon="info" isFilled size={20} />
                 </div>
                 {notEnoughPointsText}
               </p>
diff --git a/packages/design-system/lib/components/RateCard/Regular/index.tsx b/packages/design-system/lib/components/RateCard/Regular/index.tsx
index 6e10eb3b7..dd2801a0f 100644
--- a/packages/design-system/lib/components/RateCard/Regular/index.tsx
+++ b/packages/design-system/lib/components/RateCard/Regular/index.tsx
@@ -3,9 +3,8 @@ import { Rate } from '../types'
 import styles from '../rate-card.module.css'
 import { Typography } from '../../Typography'
 import { Button } from '../../Button'
-import InfoCircleIcon from '../../Icons/InfoCircle'
-import CheckCircleIcon from '../../Icons/CheckCircle'
 import { variants } from '../variants'
+import { MaterialIcon } from '../../Icons'
 
 interface RegularRateCardProps {
   name: string
@@ -58,7 +57,7 @@ export default function RegularRateCard({
                   size="Small"
                   onPress={handleTermsClick}
                 >
-                  <InfoCircleIcon height={20} width={20} />
+                  <MaterialIcon icon="info" color="CurrentColor" />
                 </Button>
                 {rateTitle}
                 <span className={styles.textSecondary}>
@@ -67,7 +66,7 @@ export default function RegularRateCard({
               </h3>
             </Typography>
             <div className={styles.checkIcon}>
-              <CheckCircleIcon width={24} height={24} />
+              <MaterialIcon icon="check" color="CurrentColor" />
             </div>
           </header>
           <div>
diff --git a/packages/design-system/package.json b/packages/design-system/package.json
index e2c2a6053..68617b0d5 100644
--- a/packages/design-system/package.json
+++ b/packages/design-system/package.json
@@ -82,10 +82,12 @@
     "husky": "^9.1.7",
     "jiti": "^1",
     "lint-staged": "^15.4.1",
+    "material-symbols": "^0.29.0",
     "prettier": "^3.4.2",
     "react": "^18.2.0",
     "react-aria-components": "^1.6.0",
     "react-dom": "^18.2.0",
+    "react-material-symbols": "^4.4.0",
     "rollup": "^4.34.8",
     "rollup-preserve-directives": "^1.1.3",
     "storybook": "^8.6.2",
diff --git a/packages/design-system/tsconfig.json b/packages/design-system/tsconfig.json
index 3b96687d6..860a801a4 100644
--- a/packages/design-system/tsconfig.json
+++ b/packages/design-system/tsconfig.json
@@ -1,5 +1,6 @@
 {
   "compilerOptions": {
+    "declaration": true,
     "target": "ES2022",
     "useDefineForClassFields": true,
     "lib": ["ES2022", "DOM", "DOM.Iterable"],
diff --git a/yarn.lock b/yarn.lock
index 81174c5c7..c212ae1f3 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -6204,10 +6204,12 @@ __metadata:
     husky: "npm:^9.1.7"
     jiti: "npm:^1"
     lint-staged: "npm:^15.4.1"
+    material-symbols: "npm:^0.29.0"
     prettier: "npm:^3.4.2"
     react: "npm:^18.2.0"
     react-aria-components: "npm:^1.6.0"
     react-dom: "npm:^18.2.0"
+    react-material-symbols: "npm:^4.4.0"
     rollup: "npm:^4.34.8"
     rollup-preserve-directives: "npm:^1.1.3"
     storybook: "npm:^8.6.2"
@@ -6307,6 +6309,7 @@ __metadata:
     json-stable-stringify-without-jsonify: "npm:^1.0.1"
     libphonenumber-js: "npm:^1.10.60"
     lint-staged: "npm:^15.2.2"
+    material-symbols: "npm:^0.29.0"
     nanoid: "npm:^5.0.9"
     netlify-plugin-cypress: "npm:^2.2.1"
     next: "npm:^14.2.25"
@@ -6321,6 +6324,7 @@ __metadata:
     react-hook-form: "npm:^7.51.2"
     react-international-phone: "npm:^4.2.6"
     react-intl: "npm:^6.6.8"
+    react-material-symbols: "npm:^4.4.0"
     react-to-print: "npm:^3.0.2"
     schema-dts: "npm:^1.1.2"
     secure-json-parse: "npm:^4.0.0"
@@ -15921,6 +15925,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"material-symbols@npm:^0.29.0":
+  version: 0.29.0
+  resolution: "material-symbols@npm:0.29.0"
+  checksum: 10c0/622edb9b5af03e4ac468402c40c403117f04ff5407cb984912c3624fa0d6d00c8d584c418a0a5e2c667a006ef96058dc78306aadb4920ff9edf4c07c27d94e03
+  languageName: node
+  linkType: hard
+
 "math-intrinsics@npm:^1.1.0":
   version: 1.1.0
   resolution: "math-intrinsics@npm:1.1.0"
@@ -18193,6 +18204,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-material-symbols@npm:^4.4.0":
+  version: 4.4.0
+  resolution: "react-material-symbols@npm:4.4.0"
+  peerDependencies:
+    react: ^18.2.0
+    react-dom: ^18.2.0
+  checksum: 10c0/fe1755c549477967a6b7ec8d2f7e9f8631b3850577256ea8cb47be1851f53bfd916ac4a5c55b80b3710ac7be3a885b5853989fd5c50cd7a7f9d8add9035a78e6
+  languageName: node
+  linkType: hard
+
 "react-property@npm:2.0.2":
   version: 2.0.2
   resolution: "react-property@npm:2.0.2"