diff --git a/package.json b/package.json
index aa784e5f..1c969b1e 100644
--- a/package.json
+++ b/package.json
@@ -21,6 +21,7 @@
     "react": "^18",
     "react-dom": "^18",
     "react-hook-form": "^7.51.4",
+    "react-toastify": "^10.0.5",
     "swiper": "^11.1.1",
     "tailwind-merge": "^2.2.1",
     "vaul": "^0.9.0",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b89716e8..c9f6b1d9 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -32,6 +32,9 @@ dependencies:
   react-hook-form:
     specifier: ^7.51.4
     version: 7.51.5(react@18.2.0)
+  react-toastify:
+    specifier: ^10.0.5
+    version: 10.0.5(react-dom@18.2.0)(react@18.2.0)
   swiper:
     specifier: ^11.1.1
     version: 11.1.1
@@ -13654,6 +13657,17 @@ packages:
       tslib: 2.6.2
     dev: false
 
+  /react-toastify@10.0.5(react-dom@18.2.0)(react@18.2.0):
+    resolution: {integrity: sha512-mNKt2jBXJg4O7pSdbNUfDdTsK9FIdikfsIE/yUCxbAEXl4HMyJaivrVFcn3Elvt5xvCQYhUZm+hqTIu1UXM3Pw==}
+    peerDependencies:
+      react: '>=18'
+      react-dom: '>=18'
+    dependencies:
+      clsx: 2.1.0
+      react: 18.2.0
+      react-dom: 18.2.0(react@18.2.0)
+    dev: false
+
   /react@18.2.0:
     resolution:
       {
diff --git a/src/app/(post)/createPost/_component/ImageUploader.tsx b/src/app/(post)/createPost/_component/ImageUploader.tsx
index 0f35d443..03533470 100644
--- a/src/app/(post)/createPost/_component/ImageUploader.tsx
+++ b/src/app/(post)/createPost/_component/ImageUploader.tsx
@@ -34,7 +34,7 @@ const ImageUploader = ({ imageSrcUrl, onChange }: ImageUploaderProps) => {
 
   return (
     <>
-      <div className='bg-gray-accent7 flex w-full justify-center p-10'>
+      <div className='flex w-full justify-center p-10'>
         <div className='relative '>
           {previewImageUrl ? (
             <>
diff --git a/src/app/(post)/createPost/_component/PostForm/index.tsx b/src/app/(post)/createPost/_component/PostForm/index.tsx
index 2f9bf3df..a1ab6d55 100644
--- a/src/app/(post)/createPost/_component/PostForm/index.tsx
+++ b/src/app/(post)/createPost/_component/PostForm/index.tsx
@@ -3,6 +3,7 @@
 import { Controller, useForm } from 'react-hook-form';
 
 import { PostValue, createPost } from '@/src/apis/postDetail';
+import Toast from '@/src/app/_components/Toast';
 import Button from '@/src/components/Button/Button';
 import FormField from '@/src/components/FormField';
 import Selector from '@/src/components/Selector';
@@ -26,6 +27,7 @@ const PostForm = () => {
 
   const onSubmitPost = (data: PostValue) => {
     createPost(data);
+    Toast.default('등록되었습니다.');
   };
 
   return (
@@ -53,7 +55,6 @@ const PostForm = () => {
             {...register('title')}
           />
         </FormField>
-
         <FormField
           labelText='투표 설명'
           isRequired
@@ -67,7 +68,6 @@ const PostForm = () => {
             {...register('content')}
           />
         </FormField>
-
         <FormField labelText='투표 항목' isRequired>
           <Controller
             name='voteOptions'
@@ -80,7 +80,6 @@ const PostForm = () => {
             )}
           />
         </FormField>
-
         <FormField
           labelText='채널 선택'
           isRequired
diff --git a/src/app/(post)/createPost/page.tsx b/src/app/(post)/createPost/page.tsx
index 27146dd1..45e7609f 100644
--- a/src/app/(post)/createPost/page.tsx
+++ b/src/app/(post)/createPost/page.tsx
@@ -3,12 +3,12 @@ import PostForm from './_component/PostForm';
 
 const CreatePostPage = () => {
   return (
-    <div className='flex h-full flex-col'>
+    <>
       <TopBar.Container>
         <TopBar.BackButton href='/' />
       </TopBar.Container>
       <PostForm />
-    </div>
+    </>
   );
 };
 
diff --git a/src/app/_components/Toast.tsx b/src/app/_components/Toast.tsx
new file mode 100644
index 00000000..be156204
--- /dev/null
+++ b/src/app/_components/Toast.tsx
@@ -0,0 +1,33 @@
+import { ToastOptions, toast } from 'react-toastify';
+
+import { cn } from '@/src/utils/cn';
+
+const defaultToastOption: ToastOptions = {
+  position: 'bottom-center',
+  autoClose: 4000,
+  hideProgressBar: true,
+  closeOnClick: true,
+  draggable: true,
+  pauseOnHover: false,
+  closeButton: false,
+  icon: false,
+};
+
+const Toast = {
+  default: (
+    message: string,
+    options: ToastOptions = {},
+    className?: string,
+  ) => {
+    toast.info(message, {
+      ...defaultToastOption,
+      ...options,
+      className: cn(
+        'font-text-1-rg h-[44px] w-[358px] rounded-lg bg-[#2D3033] text-white',
+        className,
+      ),
+    });
+  },
+};
+
+export default Toast;
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 128e4093..07aad487 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,4 +1,6 @@
 import type { Metadata, Viewport } from 'next';
+import { ToastContainer } from 'react-toastify';
+import 'react-toastify/dist/ReactToastify.css';
 
 import Introduction from '../components/Introduction';
 import { MSWComponent } from '../mocks/MSWComponent';
@@ -43,6 +45,7 @@ const RootLayout = ({
                 {children}
               </div>
             </div>
+            <ToastContainer className='bottom-[103px] flex flex-col items-center justify-center' />
           </MSWComponent>
         </Providers>
       </body>