diff --git a/components/Nav/src/Nav.vue b/components/Nav/src/Nav.vue
index d278f70..6091156 100644
--- a/components/Nav/src/Nav.vue
+++ b/components/Nav/src/Nav.vue
@@ -25,10 +25,6 @@ export default {
           text: "Components",
           route: "/components",
         },
-        {
-          text: "Patterns",
-          route: "/patterns",
-        },
       ],
     };
   },
diff --git a/pages/design.vue b/pages/design.vue
new file mode 100644
index 0000000..ad9fd4a
--- /dev/null
+++ b/pages/design.vue
@@ -0,0 +1,9 @@
+<template>
+  <nuxt-child :key="$route.fullPath" />
+</template>
+
+<script>
+export default {
+  layout: "documentation",
+};
+</script>
diff --git a/pages/design/_design.vue b/pages/design/_design.vue
new file mode 100644
index 0000000..140aa57
--- /dev/null
+++ b/pages/design/_design.vue
@@ -0,0 +1,26 @@
+<template>
+  <h1 class="my-x3 text-d3 font-medium">{{ pageName }}</h1>
+</template>
+
+<script>
+export default {
+  computed: {
+    pageName() {
+      let pageName = this.$route.params.design;
+      pageName = this.kebabToPascal(pageName);
+      return pageName;
+    },
+  },
+
+  methods: {
+    kebabToPascal(string) {
+      let spiltString = string.split("-");
+      for (var i = 0; i < spiltString.length; i++) {
+        spiltString[i] =
+          spiltString[i].charAt(0).toUpperCase() + spiltString[i].slice(1);
+      }
+      return spiltString.join("");
+    },
+  },
+};
+</script>
diff --git a/pages/design/index.vue b/pages/design/index.vue
new file mode 100644
index 0000000..dca8ae2
--- /dev/null
+++ b/pages/design/index.vue
@@ -0,0 +1,5 @@
+<template>
+  <div>
+    <h1 class="my-x3 text-d3 font-medium">Design Main page</h1>
+  </div>
+</template>