diff --git a/assets/css/global.css b/assets/css/global.css
index 59ab27a..b5d914f 100644
--- a/assets/css/global.css
+++ b/assets/css/global.css
@@ -11,6 +11,12 @@ html {
   -webkit-font-smoothing: antialiased;
 }
 
+body::-webkit-scrollbar {
+  display: none;
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
 * {
   box-sizing: border-box;
 }
diff --git a/components/ui/Menu.vue b/components/ui/Menu.vue
new file mode 100644
index 0000000..6e99069
--- /dev/null
+++ b/components/ui/Menu.vue
@@ -0,0 +1,95 @@
+<template>
+  <div class="menu">
+    <span @click="toggleMenu">
+      <img
+        class="w-8 cursor-pointer"
+        src="/images/icons/menu.svg"
+        :alt="$t('general.openMenu')"
+      />
+    </span>
+    <transition name="slide-fade">
+      <div
+        v-if="showMenu"
+        class="menu-body bg-primary h-screen w-full absolute top-0 left-0 z-10"
+      >
+        <span
+          class="close flex justify-end text-white p-3 font-bold text-2xl cursor-pointer"
+          @click="toggleMenu"
+        >
+          <img
+            class="w-6"
+            src="/images/icons/cross.svg"
+            :alt="$t('general.closeMenu')"
+          />
+        </span>
+        <div class="menu-content">
+          <div class="text-center flex flex-col p-5">
+            <a
+              v-for="(link, index) in links"
+              :key="index"
+              class="link font-bold text-2xl text-blue-main-800 rounded p-4 cursor-pointer"
+              @click="navigateTo(link.url)"
+            >
+              {{ link.name }}
+            </a>
+          </div>
+        </div>
+      </div>
+    </transition>
+  </div>
+</template>
+
+<script>
+import { NAV_LINKS } from '@/constants/navLinks'
+
+export default {
+  name: 'Menu',
+  data: () => ({
+    showMenu: false,
+  }),
+  computed: {
+    links() {
+      return NAV_LINKS
+    },
+  },
+  methods: {
+    toggleMenu() {
+      this.showMenu = !this.showMenu
+    },
+    navigateTo(url) {
+      this.toggleMenu()
+      this.$router.push(url)
+    },
+  },
+}
+</script>
+
+<style lang="scss" scoped>
+$heightClose: 60px;
+
+.close {
+  height: $heightClose;
+}
+
+.menu-content {
+  height: calc(100% - 120px);
+
+  @apply flex justify-center items-center;
+
+  .link:hover {
+    background: rgba(0, 0, 0, 0.2);
+  }
+}
+
+.slide-fade-enter-active {
+  transition: all 0.3s ease;
+}
+.slide-fade-leave-active {
+  transition: all 0.3s cubic-bezier(1, 0.5, 0.8, 1);
+}
+.slide-fade-enter,
+.slide-fade-leave-to {
+  transform: translateX(10px);
+  opacity: 0;
+}
+</style>
diff --git a/components/ui/TheHeader.vue b/components/ui/TheHeader.vue
index 0295fa2..35f7ab5 100644
--- a/components/ui/TheHeader.vue
+++ b/components/ui/TheHeader.vue
@@ -23,11 +23,13 @@
           </nuxt-link>
         </li>
       </ul>
+      <Menu class="block sm:hidden" />
     </div>
   </header>
 </template>
 
 <script>
+import { NAV_LINKS } from '@/constants/navLinks'
 import Logo from '~/components/Logo'
 
 export default {
@@ -35,26 +37,15 @@ export default {
   components: {
     Logo,
   },
-  data: () => ({
-    links: [
-      {
-        url: '/blog',
-        name: 'Blog',
-      },
-      {
-        url: '/projects',
-        name: 'Projects',
-      },
-      {
-        url: '/about',
-        name: 'About',
-      },
-    ],
-  }),
+  computed: {
+    links() {
+      return NAV_LINKS
+    },
+  },
 }
 </script>
 
-<style scoped>
+<style lang="scss" scoped>
 .links:last-child {
   border: 0;
 }
diff --git a/constants/navLinks.js b/constants/navLinks.js
new file mode 100644
index 0000000..0e366c3
--- /dev/null
+++ b/constants/navLinks.js
@@ -0,0 +1,14 @@
+export const NAV_LINKS = [
+  {
+    url: '/blog',
+    name: 'Blog',
+  },
+  {
+    url: '/projects',
+    name: 'Projects',
+  },
+  {
+    url: '/about',
+    name: 'About',
+  },
+]
diff --git a/locales/es.json b/locales/es.json
index 49a81a7..a29f539 100644
--- a/locales/es.json
+++ b/locales/es.json
@@ -1,6 +1,8 @@
 {
   "general": {
-    "altLogo": "Pablo Sirera, desarrollador web frontend | Javascript, Vue y Nuxt"
+    "altLogo": "Pablo Sirera, desarrollador web frontend | Javascript, Vue y Nuxt",
+    "closeMenu": "Cerrar menú",
+    "openMenu": "Abrir menú"
   },
   "months": {
     "april": "Abril",
diff --git a/static/images/icons/cross.svg b/static/images/icons/cross.svg
new file mode 100644
index 0000000..a9c4dd0
--- /dev/null
+++ b/static/images/icons/cross.svg
@@ -0,0 +1 @@
+<svg height="329pt" viewBox="0 0 329.26933 329" width="329pt" xmlns="http://www.w3.org/2000/svg"><path d="m194.800781 164.769531 128.210938-128.214843c8.34375-8.339844 8.34375-21.824219 0-30.164063-8.339844-8.339844-21.824219-8.339844-30.164063 0l-128.214844 128.214844-128.210937-128.214844c-8.34375-8.339844-21.824219-8.339844-30.164063 0-8.34375 8.339844-8.34375 21.824219 0 30.164063l128.210938 128.214843-128.210938 128.214844c-8.34375 8.339844-8.34375 21.824219 0 30.164063 4.15625 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921875-2.089844 15.082031-6.25l128.210937-128.214844 128.214844 128.214844c4.160156 4.160156 9.621094 6.25 15.082032 6.25 5.460937 0 10.921874-2.089844 15.082031-6.25 8.34375-8.339844 8.34375-21.824219 0-30.164063zm0 0"/></svg>
\ No newline at end of file
diff --git a/static/images/icons/menu.svg b/static/images/icons/menu.svg
new file mode 100644
index 0000000..5a5b8d9
--- /dev/null
+++ b/static/images/icons/menu.svg
@@ -0,0 +1 @@
+<svg id="Layer_1" enable-background="new 0 0 512 512" height="512" viewBox="0 0 512 512" width="512" xmlns="http://www.w3.org/2000/svg"><path d="m464.883 64.267h-417.766c-25.98 0-47.117 21.136-47.117 47.149 0 25.98 21.137 47.117 47.117 47.117h417.766c25.98 0 47.117-21.137 47.117-47.117 0-26.013-21.137-47.149-47.117-47.149z"/><path d="m464.883 208.867h-417.766c-25.98 0-47.117 21.136-47.117 47.149 0 25.98 21.137 47.117 47.117 47.117h417.766c25.98 0 47.117-21.137 47.117-47.117 0-26.013-21.137-47.149-47.117-47.149z"/><path d="m464.883 353.467h-417.766c-25.98 0-47.117 21.137-47.117 47.149 0 25.98 21.137 47.117 47.117 47.117h417.766c25.98 0 47.117-21.137 47.117-47.117 0-26.012-21.137-47.149-47.117-47.149z"/></svg>
\ No newline at end of file