diff --git a/package-lock.json b/package-lock.json
index 707e812..7b99bea 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -33,6 +33,7 @@
         "react-switch": "^7.0.0",
         "recoil": "^0.7.7",
         "socket.io-client": "^4.6.1",
+        "recoil-persist": "^4.2.0",
         "styled-components": "^5.3.9",
         "styled-normalize": "^8.0.7",
         "typescript": "^4.9.5",
@@ -14957,6 +14958,14 @@
         }
       }
     },
+    "node_modules/recoil-persist": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/recoil-persist/-/recoil-persist-4.2.0.tgz",
+      "integrity": "sha512-MHVfML9GxJP3RpkKR4F5rp7DtvzIvjWhowtMao/b7h2k4afMio/4sMAdUtltIrDaeVegH0Iga8Sx5XQ3oD7CzA==",
+      "peerDependencies": {
+        "recoil": "^0.7.2"
+      }
+    },
     "node_modules/recursive-readdir": {
       "version": "2.2.3",
       "resolved": "https://registry.npmjs.org/recursive-readdir/-/recursive-readdir-2.2.3.tgz",
diff --git a/package.json b/package.json
index fc26a48..1737184 100644
--- a/package.json
+++ b/package.json
@@ -28,6 +28,7 @@
     "react-switch": "^7.0.0",
     "recoil": "^0.7.7",
     "socket.io-client": "^4.6.1",
+    "recoil-persist": "^4.2.0",
     "styled-components": "^5.3.9",
     "styled-normalize": "^8.0.7",
     "typescript": "^4.9.5",
diff --git a/src/components/pages/login/auth-page/Auth.tsx b/src/components/pages/login/auth-page/Auth.tsx
index 5ac8859..88444b0 100644
--- a/src/components/pages/login/auth-page/Auth.tsx
+++ b/src/components/pages/login/auth-page/Auth.tsx
@@ -1,28 +1,14 @@
 import React, { useEffect, useState } from 'react';
 import styled from 'styled-components';
-import axios, { AxiosResponse } from 'axios';
+import axios from 'axios';
 import { useNavigate } from 'react-router-dom';
 import { useCookies } from 'react-cookie';
-import { useRecoilValue, useSetRecoilState } from 'recoil';
+import { useSetRecoilState } from 'recoil';
 import { userState } from '../../../../recoil/locals/login/atoms/atom';
 import Layout from '../../../commons/layout/Layout';
 import Header from '../../../commons/header/Header';
 import { getImageUrl } from '../../../../api/ProfileImge';
 
-const GetImageUrl = async (userId: string): Promise<string> => {
-  // recoil 유저 토큰
-  const userInfo = useRecoilValue(userState);
-  const response: AxiosResponse<Blob> = await axios.get(
-    `http://localhost:3000/account/image?userId=${userId}`,
-    {
-      responseType: 'blob',
-      headers: { Authorization: `Bearer ${userInfo.token}` },
-    },
-  );
-  const imageUrl: string = URL.createObjectURL(response.data);
-  return imageUrl;
-};
-
 export default function Auth() {
   // 페이지 이동
   const navigate = useNavigate();
@@ -32,8 +18,8 @@ export default function Auth() {
   const [inputValue, setInputValue] = useState('');
   // recoil 유저 토큰 저장
   const setUserState = useSetRecoilState(userState);
-  // 쿠키에서 userId 받기
-  const [cookies] = useCookies(['token']);
+  // 쿠키
+  const [cookies, setCookie, removeCookie] = useCookies(['token']);
 
   // 입력 변화 핸들러
   const handleInputChange = (event: React.ChangeEvent<HTMLInputElement>) => {
@@ -66,6 +52,7 @@ export default function Auth() {
         imageUrl: userImage,
       };
       console.log(storeUser);
+      removeCookie('token');
       setUserState(storeUser);
       navigate(`/chat/channel`);
     } catch (error) {
diff --git a/src/recoil/locals/login/atoms/atom.tsx b/src/recoil/locals/login/atoms/atom.tsx
index 8b91d03..b517e58 100644
--- a/src/recoil/locals/login/atoms/atom.tsx
+++ b/src/recoil/locals/login/atoms/atom.tsx
@@ -1,5 +1,8 @@
+import { recoilPersist } from 'recoil-persist';
 import { atom } from 'recoil';
 
+const { persistAtom } = recoilPersist();
+
 const user = {
   token: '',
   userId: '',
@@ -10,4 +13,5 @@ const user = {
 export const userState = atom({
   key: 'userState',
   default: user,
+  effects_UNSTABLE: [persistAtom],
 });