diff --git a/app/[lang]/(live-current)/layout.tsx b/app/[lang]/(live-current)/layout.tsx
index 7e3604559..6e2c96d97 100644
--- a/app/[lang]/(live-current)/layout.tsx
+++ b/app/[lang]/(live-current)/layout.tsx
@@ -1,4 +1,5 @@
 /* eslint-disable @next/next/no-css-tags */
+import "@scandic-hotels/design-system/style.css"
 
 import AdobeScript from "@/components/Current/AdobeScript"
 import Footer from "@/components/Current/Footer"
diff --git a/components/Current/Aside/Puff/index.tsx b/components/Current/Aside/Puff/index.tsx
index a33e9f0fe..bdbbfee60 100644
--- a/components/Current/Aside/Puff/index.tsx
+++ b/components/Current/Aside/Puff/index.tsx
@@ -2,6 +2,7 @@ import { renderOptions } from "./renderOptions"
 
 import Image from "@/components/Image"
 import JsonToHtml from "@/components/JsonToHtml"
+import { Button } from "@scandic-hotels/design-system"
 
 import styles from "./puff.module.css"
 
@@ -27,6 +28,7 @@ export default function Puff({
           />
         ))}
         <section className={styles.content}>
+          <Button>Hej!</Button>
           <header>
             <h3 className={styles.heading}>{title}</h3>
           </header>
diff --git a/package.json b/package.json
index 3527342ac..91dd1314c 100644
--- a/package.json
+++ b/package.json
@@ -19,6 +19,7 @@
     "@contentstack/live-preview-utils": "^1.4.0",
     "@netlify/plugin-nextjs": "^5.0.0-beta.9",
     "@t3-oss/env-nextjs": "^0.9.2",
+    "@scandic-hotels/design-system": "git+ssh://git@scandic.bitbucket.org:scandic-swap/design-system.git#v0.1.0-rc.1",
     "class-variance-authority": "^0.7.0",
     "graphql": "^16.8.1",
     "graphql-request": "^6.1.0",