diff --git a/.storybook/FreenowTheme.ts b/.storybook/FreenowTheme.ts
index 86ded7728..91ee73297 100644
--- a/.storybook/FreenowTheme.ts
+++ b/.storybook/FreenowTheme.ts
@@ -1,17 +1,16 @@
 // .storybook/FreenowTheme.ts
 import { create } from '@storybook/theming/create';
-import logo from '../public/assets/freenow-logo.svg';
 
 export default create({
     base: 'light',
 
     // Typography
-    fontBase: '"Open Sans", sans-serif',   
+    fontBase: '"Open Sans", sans-serif',
     fontCode: 'monospace',
 
     brandTitle: 'FREENOW',
     brandUrl: 'https://wave.free-now.com/',
-    brandImage: logo,
+    brandImage: 'https://wave.free-now.com/freenow-logo.svg',
     brandTarget: '_self',
 
     //
diff --git a/.storybook/preview-head.html b/.storybook/preview-head.html
new file mode 100644
index 000000000..11d42c2bd
--- /dev/null
+++ b/.storybook/preview-head.html
@@ -0,0 +1,7 @@
+<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png" />
+<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
+<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
+<link rel="manifest" href="/site.webmanifest" />
+<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5" />
+<meta name="msapplication-TileColor" content="#da532c" />
+<meta name="theme-color" content="#ffffff" />
diff --git a/docs/assets/wave-logo.svg b/docs/assets/wave-logo.svg
deleted file mode 100644
index efaaf7477..000000000
--- a/docs/assets/wave-logo.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 1847 462" width="1847" height="462" preserveAspectRatio="xMidYMid meet" style="width: 100%; height: 100%; transform: translate3d(0px, 0px, 0px); content-visibility: visible;"><defs><clipPath id="__lottie_element_2"><rect width="1847" height="462" x="0" y="0"></rect></clipPath></defs><g clip-path="url(#__lottie_element_2)"><g transform="matrix(1,0,0,1,923.5,231)" opacity="1" style="display: block;"><g opacity="1" transform="matrix(1,0,0,1,37.71900177001953,12.913999557495117)"><path fill="rgb(3,15,30)" fill-opacity="1" d=" M961.218994140625,-255.91400146484375 C961.218994140625,-255.91400146484375 961.218994140625,255.91400146484375 961.218994140625,255.91400146484375 C961.218994140625,255.91400146484375 -961.218994140625,255.91400146484375 -961.218994140625,255.91400146484375 C-961.218994140625,255.91400146484375 -961.218994140625,-255.91400146484375 -961.218994140625,-255.91400146484375 C-961.218994140625,-255.91400146484375 961.218994140625,-255.91400146484375 961.218994140625,-255.91400146484375z"></path></g></g><g transform="matrix(0.8799700140953064,0,0,0.8540199995040894,21.016998291015625,-57.51222229003906)" opacity="1" style="display: none;"><g opacity="1" transform="matrix(1,0,0,1,162.6009979248047,163.78900146484375)"><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="10" stroke="rgb(251,19,33)" stroke-opacity="1" stroke-width="110" d="M0 0"></path></g><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,0,0)" fill-opacity="1" d="M0 0"></path><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="4" stroke="rgb(251,19,33)" stroke-opacity="1" stroke-width="110" d="M0 0"></path></g></g><g style="display: block;" transform="matrix(0.8799700140953064,0,0,0.8540199995040894,21.016998291015625,-57.51222229003906)" opacity="1"><g opacity="1" transform="matrix(1,0,0,1,162.6009979248047,163.78900146484375)"><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="10" stroke="rgb(251,19,33)" stroke-opacity="1" stroke-width="110" d=" M-202.80999755859375,-204.57899475097656 C-202.80999755859375,-204.57899475097656 107.60099792480469,108.78800201416016 107.60099792480469,108.78800201416016"></path></g><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,0,0)" fill-opacity="1" d=" M2061,-60.57699966430664"></path><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="4" stroke="rgb(251,19,33)" stroke-opacity="1" stroke-width="110" d=" M2061,-60.57699966430664"></path></g></g><g transform="matrix(0.8799700140953064,0,0,0.8540199995040894,9.523681640625,-214.2012176513672)" opacity="1" style="display: block;"><g opacity="1" transform="matrix(1,0,0,1,1127.3990478515625,494.2099914550781)"><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="10" stroke="rgb(255,255,255)" stroke-opacity="1" stroke-width="110" d=" M916.4219970703125,-283.1860046386719 C916.4219970703125,-283.1860046386719 517.0150146484375,116.17400360107422 517.0150146484375,116.17400360107422 C480.822998046875,147.14500427246094 438.92401123046875,165.8489990234375 382.4530029296875,165.8489990234375 C323.510986328125,165.8489990234375 269.927001953125,142.36300659179688 232.61000061035156,101.69999694824219 C232.61000061035156,101.69999694824219 59.39400100708008,-78.43800354003906 59.39400100708008,-78.43800354003906 C59.39400100708008,-78.43800354003906 -12.034000396728516,-167.86700439453125 -111.31099700927734,-167.86700439453125 C-226.6820068359375,-167.86700439453125 -289.8110046386719,-88.10299682617188 -300.4179992675781,-77.49600219726562 C-396.6789855957031,18.766000747680664 -492.9410095214844,122.9469985961914 -589.2030029296875,219.20899963378906 C-589.2030029296875,219.20899963378906 -852.3989868164062,-46.893001556396484 -852.3989868164062,-46.893001556396484"></path></g><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,0,0)" fill-opacity="1" d="M0 0"></path><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="4" stroke="rgb(255,255,255)" stroke-opacity="1" stroke-width="110" d="M0 0"></path></g><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,0,0)" fill-opacity="1" d="M0 0"></path><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="4" stroke="rgb(255,255,255)" stroke-opacity="1" stroke-width="110" d="M0 0"></path></g><g opacity="1" transform="matrix(1,0,0,1,0,0)"><path fill="rgb(255,0,0)" fill-opacity="1" d=" M2034.7030029296875,219.78599548339844"></path><path stroke-linecap="butt" stroke-linejoin="miter" fill-opacity="0" stroke-miterlimit="4" stroke="rgb(255,255,255)" stroke-opacity="1" stroke-width="110" d=" M2034.7030029296875,219.78599548339844"></path></g></g></g></svg>
\ No newline at end of file
diff --git a/public/android-chrome-192x192.png b/public/android-chrome-192x192.png
new file mode 100644
index 000000000..60ed7e9b4
Binary files /dev/null and b/public/android-chrome-192x192.png differ
diff --git a/public/android-chrome-512x512.png b/public/android-chrome-512x512.png
new file mode 100644
index 000000000..f948b1637
Binary files /dev/null and b/public/android-chrome-512x512.png differ
diff --git a/public/apple-touch-icon.png b/public/apple-touch-icon.png
new file mode 100644
index 000000000..4eb9a39bd
Binary files /dev/null and b/public/apple-touch-icon.png differ
diff --git a/public/browserconfig.xml b/public/browserconfig.xml
new file mode 100644
index 000000000..b3930d0f0
--- /dev/null
+++ b/public/browserconfig.xml
@@ -0,0 +1,9 @@
+<?xml version="1.0" encoding="utf-8"?>
+<browserconfig>
+    <msapplication>
+        <tile>
+            <square150x150logo src="/mstile-150x150.png"/>
+            <TileColor>#da532c</TileColor>
+        </tile>
+    </msapplication>
+</browserconfig>
diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png
new file mode 100644
index 000000000..5a47178ba
Binary files /dev/null and b/public/favicon-16x16.png differ
diff --git a/public/favicon-32x32.png b/public/favicon-32x32.png
new file mode 100644
index 000000000..b46e22091
Binary files /dev/null and b/public/favicon-32x32.png differ
diff --git a/public/favicon.ico b/public/favicon.ico
new file mode 100644
index 000000000..42b2e6369
Binary files /dev/null and b/public/favicon.ico differ
diff --git a/public/assets/freenow-logo.svg b/public/freenow-logo.svg
similarity index 100%
rename from public/assets/freenow-logo.svg
rename to public/freenow-logo.svg
diff --git a/public/mstile-150x150.png b/public/mstile-150x150.png
new file mode 100644
index 000000000..082543a72
Binary files /dev/null and b/public/mstile-150x150.png differ
diff --git a/public/safari-pinned-tab.svg b/public/safari-pinned-tab.svg
new file mode 100644
index 000000000..7ea68d5f6
--- /dev/null
+++ b/public/safari-pinned-tab.svg
@@ -0,0 +1,30 @@
+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN"
+ "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">
+<svg version="1.0" xmlns="http://www.w3.org/2000/svg"
+ width="1592.000000pt" height="1592.000000pt" viewBox="0 0 1592.000000 1592.000000"
+ preserveAspectRatio="xMidYMid meet">
+<metadata>
+Created by potrace 1.14, written by Peter Selinger 2001-2017
+</metadata>
+<g transform="translate(0.000000,1592.000000) scale(0.100000,-0.100000)"
+fill="#000000" stroke="none">
+<path d="M7670 15913 c-1701 -63 -3357 -677 -4675 -1732 -446 -358 -898 -810
+-1256 -1256 -932 -1163 -1523 -2595 -1688 -4090 -36 -319 -45 -503 -45 -870 0
+-459 24 -788 90 -1215 211 -1373 787 -2681 1658 -3765 245 -306 680 -760 957
+-1001 1124 -977 2466 -1616 3904 -1859 496 -84 806 -109 1335 -109 410 0 555
+7 895 45 1253 138 2484 589 3535 1294 1387 930 2441 2262 3028 3830 444 1186
+598 2497 441 3755 -184 1478 -770 2858 -1707 4024 -324 402 -794 870 -1207
+1202 -1480 1190 -3371 1818 -5265 1747z m6013 -7158 l215 -210 -211 -205
+c-117 -113 -626 -607 -1133 -1098 -506 -491 -945 -911 -975 -933 -394 -297
+-897 -374 -1394 -213 -104 34 -291 130 -380 196 -63 46 -590 567 -1075 1062
+-245 250 -326 313 -500 395 -125 58 -196 74 -330 74 -176 0 -297 -30 -460
+-115 -53 -27 -127 -72 -165 -100 -39 -29 -509 -489 -1055 -1034 l-985 -982
+-535 526 c-295 290 -677 666 -850 835 l-315 309 215 208 c118 115 220 209 225
+209 6 0 291 -276 635 -614 l625 -614 765 763 c421 420 797 791 837 824 235
+199 499 318 823 373 99 17 375 17 470 0 262 -46 506 -160 740 -346 57 -45 535
+-523 1060 -1058 91 -93 192 -189 225 -214 74 -57 219 -127 305 -149 153 -39
+340 -33 490 15 196 63 155 26 1390 1226 613 596 1118 1083 1121 1082 4 -1 103
+-96 222 -212z"/>
+</g>
+</svg>
diff --git a/public/site.webmanifest b/public/site.webmanifest
new file mode 100644
index 000000000..0c3646019
--- /dev/null
+++ b/public/site.webmanifest
@@ -0,0 +1,19 @@
+{
+    "name": "Wave Design System",
+    "short_name": "Wave",
+    "icons": [
+        {
+            "src": "/android-chrome-192x192.png",
+            "sizes": "192x192",
+            "type": "image/png"
+        },
+        {
+            "src": "/android-chrome-512x512.png",
+            "sizes": "512x512",
+            "type": "image/png"
+        }
+    ],
+    "theme_color": "#ffffff",
+    "background_color": "#ffffff",
+    "display": "standalone"
+}