diff --git a/packages/apps/user/src/components/NaverLoginButton/NaverLoginButton.js b/packages/apps/user/src/components/NaverLoginButton/NaverLoginButton.js
new file mode 100644
index 00000000..dc3d13b1
--- /dev/null
+++ b/packages/apps/user/src/components/NaverLoginButton/NaverLoginButton.js
@@ -0,0 +1,20 @@
+import { Image } from '@chakra-ui/react';
+import logo from '../../images/btnG_icon_circle.png';
+import { useCallback } from 'react';
+
+const NaverForm = function () {
+  const base_url = 'https://nid.naver.com/oauth2.0/authorize';
+  const REDIRECT_URI = `http://localhost:8080/auth/login/naver-callback`;
+  const STATE = 'slfjsdf';
+  const NAVER_AUTH_URL = `${base_url}?response_type=code&client_id=${
+    process.env.REACT_APP_NAVER_CLIENT_ID
+  }&redirect_uri=${encodeURI(REDIRECT_URI)}&state=${STATE}`;
+
+  const onLoginClick = useCallback(() => {
+    window.location.href = NAVER_AUTH_URL;
+  }, [NAVER_AUTH_URL]);
+
+  return <Image onClick={onLoginClick} height={'14'} src={logo} />;
+};
+
+export default NaverForm;
diff --git a/packages/apps/user/src/components/NaverLoginButton/package.json b/packages/apps/user/src/components/NaverLoginButton/package.json
new file mode 100644
index 00000000..c14e1c8e
--- /dev/null
+++ b/packages/apps/user/src/components/NaverLoginButton/package.json
@@ -0,0 +1,3 @@
+{
+  "main": "NaverLoingButton.js"
+}
diff --git a/packages/apps/user/src/images/btnG_icon_circle.png b/packages/apps/user/src/images/btnG_icon_circle.png
new file mode 100644
index 00000000..e3c3242f
Binary files /dev/null and b/packages/apps/user/src/images/btnG_icon_circle.png differ
diff --git a/packages/apps/user/src/views/Auth/LogIn/LogIn.js b/packages/apps/user/src/views/Auth/LogIn/LogIn.js
index b7d12bff..37dbcf72 100644
--- a/packages/apps/user/src/views/Auth/LogIn/LogIn.js
+++ b/packages/apps/user/src/views/Auth/LogIn/LogIn.js
@@ -1,12 +1,8 @@
 import { useCallback, useState } from 'react';
 
-import { useNavigate , Link as ReactRouterLink } from 'react-router-dom';
+import { useNavigate, Link as ReactRouterLink } from 'react-router-dom';
 import { FaUserAlt, FaLock } from 'react-icons/fa';
-import {
-  AiFillGithub,
-  AiFillGoogleCircle,
-  AiFillTwitterCircle,
-} from 'react-icons/ai';
+import { AiFillGoogleCircle, AiFillTwitterCircle } from 'react-icons/ai';
 import { useForm } from 'react-hook-form';
 import {
   Box,
@@ -26,6 +22,7 @@ import {
 } from '@chakra-ui/react';
 
 import { logIn, googleLogin, auth, provider } from '../../../../firebase';
+import NaverLoginButton from '../../../components/NaverLoginButton/NaverLoginButton';
 
 function LogIn() {
   const [showPassword, setShowPassword] = useState(false);
@@ -101,9 +98,7 @@ function LogIn() {
                 alignItems="center"
                 padding="15px"
               >
-                <Button bgColor="white">
-                  <Icon as={AiFillGithub} boxSize="30px" />
-                </Button>
+                <NaverLoginButton />
 
                 <Button bgColor="white" onClick={googleClick}>
                   <Icon as={AiFillGoogleCircle} boxSize="30px" />
@@ -112,6 +107,7 @@ function LogIn() {
                   <Icon as={AiFillTwitterCircle} boxSize="30px" />
                 </Button>
               </HStack>
+
               <FormControl isInvalid={errors.email}>
                 <InputGroup>
                   <InputLeftElement pointerEvents="none">