diff --git a/src/assets/images/menu-button.png b/src/assets/images/menu-button.png
new file mode 100644
index 0000000..1075a8b
Binary files /dev/null and b/src/assets/images/menu-button.png differ
diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
index 23587b2..449a68a 100644
--- a/src/components/Header/index.tsx
+++ b/src/components/Header/index.tsx
@@ -3,35 +3,37 @@ import "./styles.scss";
 import logo from "../../assets/images/logo.png";
 import cart from "../../assets/images/header-cart.png";
 import search from "../../assets/images/header-search.png";
+import menuButton from "../../assets/images/menu-button.png";
 
 const Header = () => {
   return (
     <header className="header">
       <div className="header__content">
-        <div className="header__content-top">
-          <div className="logo">
-            <a href="/">
-              <img src={logo} alt="Logo da M3" />
-            </a>
-          </div>
-          <div className="search-desktop">
-            <input
-              className="search-desktop__input"
-              type="text"
-              placeholder="Buscar..."
-            />
-            <button className="search-desktop__button" type="button">
-              <img src={search} alt="Pesquisar" />
-            </button>
-          </div>
-          <div className="buttons">
-            <button className="buttons__logIn" type="button">
-              ENTRAR
-            </button>
-            <button className="buttons__cart" type="button">
-              <img src={cart} alt="Carrinho" />
-            </button>
-          </div>
+        <button className="menu-mobile-button">
+          <img src={menuButton} alt="Menu mobile" />
+        </button>
+        <div className="logo">
+          <a href="/">
+            <img src={logo} alt="Logo da M3" />
+          </a>
+        </div>
+        <div className="search-desktop">
+          <input
+            className="search-desktop__input"
+            type="text"
+            placeholder="Buscar..."
+          />
+          <button className="search-desktop__button" type="button">
+            <img src={search} alt="Pesquisar" />
+          </button>
+        </div>
+        <div className="buttons">
+          <button className="buttons__logIn" type="button">
+            ENTRAR
+          </button>
+          <button className="buttons__cart" type="button">
+            <img src={cart} alt="Carrinho" />
+          </button>
         </div>
       </div>
       <div className="header__nav">
@@ -49,6 +51,16 @@ const Header = () => {
           </ul>
         </nav>
       </div>
+      <div className="search-mobile">
+        <input
+          className="search-mobile__input"
+          type="text"
+          placeholder="Buscar..."
+        />
+        <button className="search-mobile__button" type="button">
+          <img src={search} alt="Pesquisar" />
+        </button>
+      </div>
     </header>
   );
 };
diff --git a/src/components/Header/styles.scss b/src/components/Header/styles.scss
index 50fddeb..d9ef0e8 100644
--- a/src/components/Header/styles.scss
+++ b/src/components/Header/styles.scss
@@ -7,110 +7,119 @@
 
   &__content {
     width: 84.375%;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    height: 76px;
+    padding: 0 16px 0 16px;
 
-    &-top {
+    .menu-mobile-button {
+      display: none;
+    }
+
+    .logo,
+    .buttons {
+      height: 100%;
+    }
+
+    .logo {
       display: flex;
       justify-content: center;
-      height: 76px;
+      align-items: center;
+      width: 136px;
 
-      .logo,
-      .buttons {
-        height: 100%;
+      a {
+        width: 100%;
       }
 
-      .logo {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-
-        img {
-          width: 100%;
-          height: 25.86px;
-          cursor: pointer;
-        }
+      img {
+        width: 100%;
+        height: 25.86px;
+        cursor: pointer;
       }
+    }
 
-      .search-desktop {
-        display: flex;
-        flex-grow: 1;
-        justify-content: center;
-        align-items: center;
+    .search-desktop {
+      display: flex;
+      flex-grow: 1;
+      justify-content: center;
+      align-items: center;
 
-        &__input {
-          width: 28.668%;
-          height: 32px;
-          border: none;
-          border-top-left-radius: 5px;
-          border-bottom-left-radius: 5px;
+      &__input {
+        width: 29.915%;
+        height: 32px;
+        border: none;
+        border-top-left-radius: 5px;
+        border-bottom-left-radius: 5px;
 
-          &::placeholder {
-            padding: 8px 0 8px 16px;
-            font-style: normal;
-            font-weight: 400;
-            font-size: 14px;
-            line-height: 16px;
-            color: var(--gray-200);
-          }
-        }
-
-        &__button {
-          width: 32px;
-          height: 32px;
-          border: none;
-          background: var(--white-500);
-          border-top-right-radius: 5px;
-          border-bottom-right-radius: 5px;
-          padding-right: 7px;
-          transition: 0.3s;
-
-          &:hover {
-            filter: brightness(85%);
-          }
-
-          img {
-            width: 18px;
-            height: 18px;
-          }
-        }
-      }
-
-      .buttons {
-        display: flex;
-        justify-content: center;
-        align-items: center;
-        gap: 55px;
-
-        &__logIn {
+        &::placeholder {
+          padding: 8px 0 8px 16px;
           font-style: normal;
           font-weight: 400;
           font-size: 14px;
           line-height: 16px;
-          text-transform: uppercase;
-          color: var(--white-500);
-          background: transparent;
-          border: none;
-          transition: 0.3s;
+          color: var(--gray-200);
+        }
+      }
 
-          &:hover {
-            filter: brightness(80%);
-          }
+      &__button {
+        width: 32px;
+        height: 32px;
+        border: none;
+        background: var(--white-500);
+        border-top-right-radius: 5px;
+        border-bottom-right-radius: 5px;
+        padding-right: 7px;
+        transition: 0.3s;
+
+        &:hover {
+          filter: brightness(85%);
         }
 
-        &__cart {
+        img {
+          width: 18px;
+          height: 18px;
+        }
+      }
+    }
+
+    .buttons {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      width: 13%;
+
+      &__logIn {
+        width: 53px;
+        font-style: normal;
+        font-weight: 400;
+        font-size: 14px;
+        line-height: 16px;
+        text-transform: uppercase;
+        color: var(--white-500);
+        background: transparent;
+        border: none;
+        transition: 0.3s;
+
+        &:hover {
+          filter: brightness(80%);
+        }
+      }
+
+      &__cart {
+        width: 28px;
+        height: 28px;
+        background: var(--black-500);
+        border: none;
+        transition: 0.3s;
+
+        &:hover {
+          filter: brightness(85%);
+        }
+
+        img {
           width: 28px;
           height: 28px;
-          background: var(--black-500);
-          border: none;
-          transition: 0.3s;
-
-          &:hover {
-            filter: brightness(85%);
-          }
-
-          img {
-            width: 100%;
-            height: 100%;
-          }
         }
       }
     }
@@ -122,6 +131,7 @@
     display: flex;
     justify-content: center;
     width: 100%;
+    padding: 0 16px 0 16px;
 
     nav {
       display: flex;
@@ -149,4 +159,90 @@
       }
     }
   }
+
+  .search-mobile {
+    display: none;
+  }
+
+  @media (max-width: 1024px) {
+    &__content {
+      width: 100%;
+      justify-content: space-between;
+
+      .menu-mobile-button {
+        display: block;
+        background: transparent;
+        border: none;
+        width: 28px;
+        height: 22.5px;
+        cursor: pointer;
+
+        img {
+          width: 28px;
+          height: 22.5px;
+        }
+      }
+      .search-desktop {
+        display: none;
+      }
+
+      .buttons {
+        width: 2.823%;
+        justify-content: flex-end;
+
+        &__logIn {
+          display: none;
+        }
+      }
+    }
+
+    &__nav {
+      display: none;
+    }
+
+    .search-mobile {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 100%;
+      padding: 0 16px 25px 16px;
+
+      &__input {
+        width: 100%;
+        height: 36px;
+        border: none;
+        border-top-left-radius: 5px;
+        border-bottom-left-radius: 5px;
+
+        &::placeholder {
+          padding: 8px 0 8px 16px;
+          font-style: normal;
+          font-weight: 400;
+          font-size: 14px;
+          line-height: 16px;
+          color: var(--gray-200);
+        }
+      }
+
+      &__button {
+        width: 32px;
+        height: 36px;
+        border: none;
+        background: var(--white-500);
+        border-top-right-radius: 5px;
+        border-bottom-right-radius: 5px;
+        padding-right: 7px;
+        transition: 0.3s;
+
+        &:hover {
+          filter: brightness(85%);
+        }
+
+        img {
+          width: 18px;
+          height: 18px;
+        }
+      }
+    }
+  }
 }