diff --git a/public/icons/carousel-arrow-left.svg b/public/icons/carousel-arrow-left.svg
new file mode 100644
index 0000000..34ae59a
--- /dev/null
+++ b/public/icons/carousel-arrow-left.svg
@@ -0,0 +1,23 @@
+<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g opacity="0.75" filter="url(#filter0_d_4286_4144)">
+<rect width="40" height="40" rx="7" transform="matrix(-1 0 0 1 48 4)" fill="#262626" shape-rendering="crispEdges"/>
+<mask id="mask0_4286_4144" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="18" y="14" width="20" height="20">
+<rect width="20" height="20" transform="matrix(-1 0 0 1 38 14)" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_4286_4144)">
+<path d="M24.5207 24.8334H33.8332C34.0693 24.8334 34.2672 24.7536 34.4269 24.5938C34.5866 24.4341 34.6665 24.2362 34.6665 24.0001C34.6665 23.764 34.5866 23.5661 34.4269 23.4063C34.2672 23.2466 34.0693 23.1668 33.8332 23.1668H24.5207L28.604 19.0834C28.7707 18.9168 28.8505 18.7223 28.8436 18.5001C28.8366 18.2779 28.7498 18.0834 28.5832 17.9168C28.4165 17.764 28.2221 17.6841 27.9998 17.6772C27.7776 17.6702 27.5832 17.7501 27.4165 17.9168L21.9165 23.4168C21.8332 23.5001 21.7741 23.5904 21.7394 23.6876C21.7047 23.7848 21.6873 23.889 21.6873 24.0001C21.6873 24.1112 21.7047 24.2154 21.7394 24.3126C21.7741 24.4098 21.8332 24.5001 21.9165 24.5834L27.4165 30.0834C27.5693 30.2362 27.7603 30.3126 27.9894 30.3126C28.2186 30.3126 28.4165 30.2362 28.5832 30.0834C28.7498 29.9168 28.8332 29.7188 28.8332 29.4897C28.8332 29.2605 28.7498 29.0626 28.5832 28.8959L24.5207 24.8334Z" fill="white"/>
+</g>
+</g>
+<defs>
+<filter id="filter0_d_4286_4144" x="0" y="0" width="56" height="56" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="4"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4286_4144"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4286_4144" result="shape"/>
+</filter>
+</defs>
+</svg>
diff --git a/public/icons/carousel-arrow-right.svg b/public/icons/carousel-arrow-right.svg
new file mode 100644
index 0000000..a5ce2ba
--- /dev/null
+++ b/public/icons/carousel-arrow-right.svg
@@ -0,0 +1,23 @@
+<svg width="56" height="56" viewBox="0 0 56 56" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g opacity="0.75" filter="url(#filter0_d_4286_4139)">
+<rect x="8" y="4" width="40" height="40" rx="7" fill="#262626" shape-rendering="crispEdges"/>
+<mask id="mask0_4286_4139" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="18" y="14" width="20" height="20">
+<rect x="18" y="14" width="20" height="20" fill="#D9D9D9"/>
+</mask>
+<g mask="url(#mask0_4286_4139)">
+<path d="M31.4793 24.8334H22.1668C21.9307 24.8334 21.7328 24.7536 21.5731 24.5938C21.4134 24.4341 21.3335 24.2362 21.3335 24.0001C21.3335 23.764 21.4134 23.5661 21.5731 23.4063C21.7328 23.2466 21.9307 23.1668 22.1668 23.1668H31.4793L27.396 19.0834C27.2293 18.9168 27.1495 18.7223 27.1564 18.5001C27.1634 18.2779 27.2502 18.0834 27.4168 17.9168C27.5835 17.764 27.7779 17.6841 28.0002 17.6772C28.2224 17.6702 28.4168 17.7501 28.5835 17.9168L34.0835 23.4168C34.1668 23.5001 34.2259 23.5904 34.2606 23.6876C34.2953 23.7848 34.3127 23.889 34.3127 24.0001C34.3127 24.1112 34.2953 24.2154 34.2606 24.3126C34.2259 24.4098 34.1668 24.5001 34.0835 24.5834L28.5835 30.0834C28.4307 30.2362 28.2397 30.3126 28.0106 30.3126C27.7814 30.3126 27.5835 30.2362 27.4168 30.0834C27.2502 29.9168 27.1668 29.7188 27.1668 29.4897C27.1668 29.2605 27.2502 29.0626 27.4168 28.8959L31.4793 24.8334Z" fill="white"/>
+</g>
+</g>
+<defs>
+<filter id="filter0_d_4286_4139" x="0" y="0" width="56" height="56" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
+<feOffset dy="4"/>
+<feGaussianBlur stdDeviation="4"/>
+<feComposite in2="hardAlpha" operator="out"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_4286_4139"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_4286_4139" result="shape"/>
+</filter>
+</defs>
+</svg>
diff --git a/public/icons/check.svg b/public/icons/check.svg
index fc2dcf7..1a4153d 100644
--- a/public/icons/check.svg
+++ b/public/icons/check.svg
@@ -1,3 +1,3 @@
 <svg width="12" height="9" viewBox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path id="Vector 171 (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M11.4147 0.77968C11.6641 1.04324 11.6613 1.46763 11.4084 1.72759L5.24286 8.06612C4.80328 8.51803 4.10367 8.5399 3.6389 8.11626L0.619653 5.36417C0.352306 5.12047 0.325105 4.69702 0.558898 4.41836C0.792692 4.13969 1.19895 4.11134 1.46629 4.35503L4.4106 7.03881L10.5053 0.773143C10.7581 0.513192 11.1653 0.516118 11.4147 0.77968Z" fill="#0A0A0A"/>
+<path id="Vector 171 (Stroke)" fill-rule="evenodd" clip-rule="evenodd" d="M11.4147 0.77968C11.6641 1.04324 11.6613 1.46763 11.4084 1.72759L5.24286 8.06612C4.80328 8.51803 4.10367 8.5399 3.6389 8.11626L0.619653 5.36417C0.352306 5.12047 0.325105 4.69702 0.558898 4.41836C0.792692 4.13969 1.19895 4.11134 1.46629 4.35503L4.4106 7.03881L10.5053 0.773143C10.7581 0.513192 11.1653 0.516118 11.4147 0.77968Z" fill="currentColor"/>
 </svg>
diff --git a/src/app/board/[boardId]/_components/CreatePolaroidModal/CreatePolaroid.tsx b/src/app/board/[boardId]/_components/CreatePolaroidModal/CreatePolaroid.tsx
index 3058669..f606acf 100644
--- a/src/app/board/[boardId]/_components/CreatePolaroidModal/CreatePolaroid.tsx
+++ b/src/app/board/[boardId]/_components/CreatePolaroidModal/CreatePolaroid.tsx
@@ -56,7 +56,7 @@ const CreatePolaroid = ({
   }, [fontSelectRef, showFontSelect])
 
   return (
-    <div className="relative flex h-dvh w-full max-w-md touch-pan-y flex-col items-center justify-between">
+    <div className="relative flex h-dvh w-full max-w-md touch-none flex-col items-center justify-between bg-gray-900/50">
       <ArrowBack />
       <div className="w-full overflow-y-scroll overscroll-none pb-[114px] pt-16 scrollbar-hide">
         <div className="mx-auto w-[272px]">
diff --git a/src/app/board/[boardId]/_components/CreatePolaroidModal/ThemaSelect.tsx b/src/app/board/[boardId]/_components/CreatePolaroidModal/ThemaSelect.tsx
index ce09a1b..16a7ec0 100644
--- a/src/app/board/[boardId]/_components/CreatePolaroidModal/ThemaSelect.tsx
+++ b/src/app/board/[boardId]/_components/CreatePolaroidModal/ThemaSelect.tsx
@@ -5,6 +5,7 @@ import { THEMAS } from '@/lib'
 import { useEffect, useState } from 'react'
 import Button from '@/components/Button'
 import ArrowBackIcon from 'public/icons/arrow_back_ios.svg'
+import CheckIcon from 'public/icons/check.svg'
 
 interface ThemaSelectItemProps {
   themaType: ThemaKeyType
@@ -20,10 +21,14 @@ const ThemaSelectItem = ({
   return (
     <div
       className={twMerge(
-        'flex items-center justify-center rounded-lg border-2 bg-gray-700 px-7 py-[22px]',
+        'relative flex items-center justify-center rounded-lg border-2 bg-gray-700 px-7 py-[22px]',
         isCurrentThema ? 'border-gray-100' : 'border-gray-700',
       )}
     >
+      {isCurrentThema && (
+        <CheckIcon className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-[calc(50%+10px)] scale-[3] text-gray-0" />
+      )}
+
       <Image
         src={`/images/polaroidThemas/${themaType}.png`}
         alt="polabo"
@@ -58,7 +63,7 @@ const ThemaSelect = ({
   }
 
   return (
-    <div className="relative flex h-dvh w-full max-w-md touch-pan-y flex-col items-center justify-between">
+    <div className="relative flex h-dvh w-full max-w-md touch-pan-y flex-col items-center justify-between bg-gray-900/50">
       <div className="absolute left-5 top-10">
         <ArrowBackIcon
           className="h-6 w-6 text-gray-0"
diff --git a/src/app/board/[boardId]/_components/modals/FinalModal.tsx b/src/app/board/[boardId]/_components/modals/FinalModal.tsx
index 7826f00..dac69da 100644
--- a/src/app/board/[boardId]/_components/modals/FinalModal.tsx
+++ b/src/app/board/[boardId]/_components/modals/FinalModal.tsx
@@ -11,10 +11,10 @@ const FinalModal = ({ isOpen, onClose, onConfirm }: ModalProps) => {
   return (
     <Modal isOpen={isOpen} onClose={onClose}>
       <Modal.CenterModal icon={<SurprisedIcon />}>
-        <Modal.Title>
-          {'업로드 후에는\n 수정 및 삭제가 불가합니다.'}
-        </Modal.Title>
-        <Modal.Content>폴라로이드를 업로드 할까요?</Modal.Content>
+        <Modal.Title>폴라로이드를 업로드 할까요?</Modal.Title>
+        <Modal.Content>
+          {'업로드 후에는 수정 및 삭제가 \n 불가합니다.'}
+        </Modal.Content>
 
         <Modal.BottomConfirmCancel
           cancelText="아니요"
diff --git a/src/components/Polaroid/PolaroidDetail/index.tsx b/src/components/Polaroid/PolaroidDetail/index.tsx
index b6c3dd3..afa26f3 100644
--- a/src/components/Polaroid/PolaroidDetail/index.tsx
+++ b/src/components/Polaroid/PolaroidDetail/index.tsx
@@ -5,6 +5,8 @@ import CloseIcon from 'public/icons/close.svg'
 import { useEffect, useRef, useState } from 'react'
 import Carousel from 'react-multi-carousel'
 import 'react-multi-carousel/lib/styles.css'
+import RightBtn from 'public/icons/carousel-arrow-right.svg'
+import LeftBtn from 'public/icons/carousel-arrow-left.svg'
 import PolaroidDeleteBtn from './PolaroidDeleteBtn'
 import PolaroidItem from './PolaroidItem'
 
@@ -46,6 +48,17 @@ const PolaroidDetailModal = ({
     deletePolaroid(polaroids[currentSlide - 1].id, boardId)
   }
 
+  const onRightClick = () => {
+    if (carouselRef.current) {
+      carouselRef.current.goToSlide(currentSlide + 1)
+    }
+  }
+  const onLeftClick = () => {
+    if (carouselRef.current) {
+      carouselRef.current.goToSlide(currentSlide - 1)
+    }
+  }
+
   return (
     <Modal isOpen={isOpen} onClose={onClose} closeOnOutsideClick={false}>
       <div className="relative mx-auto flex h-dvh max-w-md flex-1 touch-pan-x flex-col justify-center overflow-x-hidden py-10">
@@ -54,7 +67,7 @@ const PolaroidDetailModal = ({
           onClick={onClose}
         />
 
-        <div className="overflow-x-hidden">
+        <div className="relative touch-pan-x overflow-x-hidden">
           <Carousel
             ref={carouselRef}
             swipeable
@@ -84,6 +97,19 @@ const PolaroidDetailModal = ({
               {` / ${polaroids.length}`}
             </span>
           </div>
+
+          {currentSlide > 1 && (
+            <LeftBtn
+              className="absolute left-2 top-1/2 hidden -translate-y-1/2 transform cursor-pointer md:block"
+              onClick={onLeftClick}
+            />
+          )}
+          {currentSlide < polaroids.length && (
+            <RightBtn
+              className="absolute right-2 top-1/2 hidden -translate-y-1/2 transform cursor-pointer md:block"
+              onClick={onRightClick}
+            />
+          )}
         </div>
 
         {isBoardOwner && (