diff --git a/index.html b/index.html
index 00121a5..db191e6 100644
--- a/index.html
+++ b/index.html
@@ -3,13 +3,14 @@
   <head>
     <meta charset="UTF-8" />
     <!--Open Graph-->
+    <meta property="og:title" content="Selpiece" />
+    <meta property="og:url" content="https://selpiece.vercel.app/" />
+    <meta property="og:image"
+      content="https://github.com/KUSITMS-29th-TEAM-D/Frontend/assets/87255791/72c2e7b4-0c76-4b80-ab47-375950f28d6f" />
     <meta property="og:type" content="website" />
-    <!-- <meta property="og:title" content="" /> -->
-    <!-- <meta property="og:url" content="" /> -->
-    <!-- <meta
-      property="og:image"
-      content=""
-    /> -->
+    <meta property="og:image:alt" content="Selpiece" />
+    <meta property="og:description" content="자신의 조각을 찾아 고유한 브랜드를 디자인하는 공간, 셀피스" />
+    <meta property="og:site_name" content="Selpiece" />
     <link rel="icon" type="image/svg+xml" href="/src/assets/logos/favicon.png" />
     <link
       href="//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css"
diff --git a/package.json b/package.json
index 5b82a0b..422583a 100644
--- a/package.json
+++ b/package.json
@@ -16,6 +16,7 @@
     "react": "^18.2.0",
     "react-cookie": "^7.1.4",
     "react-dom": "^18.2.0",
+    "react-helmet-async": "^2.0.5",
     "react-router-dom": "^6.22.3",
     "react-slick": "^0.30.2",
     "recoil": "^0.7.7",
diff --git a/src/main.tsx b/src/main.tsx
index d8a8b9d..7a4c867 100644
--- a/src/main.tsx
+++ b/src/main.tsx
@@ -1,4 +1,5 @@
 import ReactDOM from 'react-dom/client';
+import { HelmetProvider } from 'react-helmet-async';
 import { BrowserRouter } from 'react-router-dom';
 import { RecoilRoot } from 'recoil';
 import { ThemeProvider } from 'styled-components';
@@ -7,12 +8,14 @@ import { Router } from '@/routers/router';
 import { GlobalStyle, theme } from '@/styles';
 
 ReactDOM.createRoot(document.getElementById('root')!).render(
-  <RecoilRoot>
-    <ThemeProvider theme={theme}>
-      <BrowserRouter>
-        <GlobalStyle />
-        <Router />
-      </BrowserRouter>
-    </ThemeProvider>
-  </RecoilRoot>
+  <HelmetProvider>
+    <RecoilRoot>
+      <ThemeProvider theme={theme}>
+        <BrowserRouter>
+          <GlobalStyle />
+          <Router />
+        </BrowserRouter>
+      </ThemeProvider>
+    </RecoilRoot>
+  </HelmetProvider>
 );
diff --git a/src/routers/router.tsx b/src/routers/router.tsx
index 8833816..01a7be9 100644
--- a/src/routers/router.tsx
+++ b/src/routers/router.tsx
@@ -81,12 +81,13 @@ export const Router = () => {
 
   return (
     <Routes>
+      <Route path="/" element={<TestLayout />}>
+        <Route path="" element={<DefineTestPage />} />
+      </Route>
       <Route element={<MainLayout />}>
         <Route path="/login" element={<RedirectPage />} />
         <Route path="/onboarding" element={<OnboardingPage />} />
-        <Route path="/" element={<TestLayout />}>
-          <Route path="" element={<DefineTestPage />} />
-        </Route>
+
         <Route path="/home" element={<HomePage />} />
         <Route path="/auth" element={<LoginPage />} />
         <Route path="/understand" element={<SelfUnderstandPage />} />
diff --git a/yarn.lock b/yarn.lock
index 3d14f04..bf89e5d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3022,6 +3022,13 @@ internal-slot@^1.0.7:
     hasown "^2.0.0"
     side-channel "^1.0.4"
 
+invariant@^2.2.4:
+  version "2.2.4"
+  resolved "https://registry.yarnpkg.com/invariant/-/invariant-2.2.4.tgz#610f3c92c9359ce1db616e538008d23ff35158e6"
+  integrity sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==
+  dependencies:
+    loose-envify "^1.0.0"
+
 is-array-buffer@^3.0.4:
   version "3.0.4"
   resolved "https://registry.yarnpkg.com/is-array-buffer/-/is-array-buffer-3.0.4.tgz#7a1f92b3d61edd2bc65d24f130530ea93d7fae98"
@@ -3326,7 +3333,7 @@ lodash.merge@^4.6.2:
   resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
   integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
 
-loose-envify@^1.1.0, loose-envify@^1.4.0:
+loose-envify@^1.0.0, loose-envify@^1.1.0, loose-envify@^1.4.0:
   version "1.4.0"
   resolved "https://registry.yarnpkg.com/loose-envify/-/loose-envify-1.4.0.tgz#71ee51fa7be4caec1a63839f7e682d8132d30caf"
   integrity sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==
@@ -3702,6 +3709,20 @@ react-dom@^18.2.0:
     loose-envify "^1.1.0"
     scheduler "^0.23.2"
 
+react-fast-compare@^3.2.2:
+  version "3.2.2"
+  resolved "https://registry.yarnpkg.com/react-fast-compare/-/react-fast-compare-3.2.2.tgz#929a97a532304ce9fee4bcae44234f1ce2c21d49"
+  integrity sha512-nsO+KSNgo1SbJqJEYRE9ERzo7YtYbou/OqjSQKxV7jcKox7+usiUVZOAC+XnDOABXggQTno0Y1CpVnuWEc1boQ==
+
+react-helmet-async@^2.0.5:
+  version "2.0.5"
+  resolved "https://registry.yarnpkg.com/react-helmet-async/-/react-helmet-async-2.0.5.tgz#cfc70cd7bb32df7883a8ed55502a1513747223ec"
+  integrity sha512-rYUYHeus+i27MvFE+Jaa4WsyBKGkL6qVgbJvSBoX8mbsWoABJXdEO0bZyi0F6i+4f0NuIb8AvqPMj3iXFHkMwg==
+  dependencies:
+    invariant "^2.2.4"
+    react-fast-compare "^3.2.2"
+    shallowequal "^1.1.0"
+
 react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -3955,7 +3976,7 @@ set-function-name@^2.0.1, set-function-name@^2.0.2:
     functions-have-names "^1.2.3"
     has-property-descriptors "^1.0.2"
 
-shallowequal@1.1.0:
+shallowequal@1.1.0, shallowequal@^1.1.0:
   version "1.1.0"
   resolved "https://registry.yarnpkg.com/shallowequal/-/shallowequal-1.1.0.tgz#188d521de95b9087404fd4dcb68b13df0ae4e7f8"
   integrity sha512-y0m1JoUZSlPAjXVtPPW70aZWfIL/dSP7AFkRnniLCrK/8MDKog3TySTBmckD+RObVxH0v4Tox67+F14PdED2oQ==
