diff --git a/frontend/src/assets/backButton.svg b/frontend/src/assets/backButton.svg
new file mode 100644
index 000000000..3693f7b99
--- /dev/null
+++ b/frontend/src/assets/backButton.svg
@@ -0,0 +1,3 @@
+<svg width="48" height="48" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M38 24H10M10 24L24 10M10 24L24 38" stroke="#7F7F7F" stroke-width="5" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>
diff --git a/frontend/src/components/common/BackButton/index.tsx b/frontend/src/components/common/BackButton/index.tsx
new file mode 100644
index 000000000..c2e295c27
--- /dev/null
+++ b/frontend/src/components/common/BackButton/index.tsx
@@ -0,0 +1,31 @@
+import React from 'react';
+import { NavigateOptions, useNavigate } from 'react-router';
+
+import BackButtonIcon from '@/assets/backButton.svg';
+
+import * as S from './styles';
+
+interface BackButtonProps {
+  prevPath: string;
+  navigateOptions?: NavigateOptions;
+  buttonStyle?: React.CSSProperties;
+  wrapperStyle?: React.CSSProperties;
+}
+
+const BackButton = ({ prevPath, navigateOptions, buttonStyle, wrapperStyle }: BackButtonProps) => {
+  const navigate = useNavigate();
+
+  const handleBackButtonClick = () => {
+    navigate(prevPath, navigateOptions);
+  };
+
+  return (
+    <S.BackButtonWrapper $style={wrapperStyle}>
+      <S.BackButton onClick={handleBackButtonClick} $style={buttonStyle} type="button">
+        <img src={BackButtonIcon} alt="뒤로가기 버튼" />
+      </S.BackButton>
+    </S.BackButtonWrapper>
+  );
+};
+
+export default BackButton;
diff --git a/frontend/src/components/common/BackButton/styles.ts b/frontend/src/components/common/BackButton/styles.ts
new file mode 100644
index 000000000..46a909b04
--- /dev/null
+++ b/frontend/src/components/common/BackButton/styles.ts
@@ -0,0 +1,20 @@
+import styled from '@emotion/styled';
+
+interface BackButtonStyleProps {
+  $style?: React.CSSProperties;
+}
+
+export const BackButtonWrapper = styled.div<BackButtonStyleProps>`
+  display: flex;
+  justify-content: flex-start;
+  width: 100%;
+
+  ${({ $style }) => $style && { ...$style }}
+`;
+
+export const BackButton = styled.button<BackButtonStyleProps>`
+  width: 3.5rem;
+  height: 3.5rem;
+
+  ${({ $style }) => $style && { ...$style }}
+`;
diff --git a/frontend/src/pages/DetailedReviewPage/components/DetailedReviewPageContents/index.tsx b/frontend/src/pages/DetailedReviewPage/components/DetailedReviewPageContents/index.tsx
index cef4b9e72..28a8e9e4b 100644
--- a/frontend/src/pages/DetailedReviewPage/components/DetailedReviewPageContents/index.tsx
+++ b/frontend/src/pages/DetailedReviewPage/components/DetailedReviewPageContents/index.tsx
@@ -46,7 +46,6 @@ const DetailedReviewPageContents = () => {
     };
   }, [detailedReview]);
 
-  // TODO: 리뷰 공개/비공개 토글 버튼 기능
   return (
     <S.DetailedReviewPageContents>
       <ReviewDescription
diff --git a/frontend/src/pages/ReviewCollectionPage/index.tsx b/frontend/src/pages/ReviewCollectionPage/index.tsx
index c582d30e6..90a25c32e 100644
--- a/frontend/src/pages/ReviewCollectionPage/index.tsx
+++ b/frontend/src/pages/ReviewCollectionPage/index.tsx
@@ -1,4 +1,4 @@
-import { AuthAndServerErrorFallback, ErrorSuspenseContainer, TopButton } from '@/components';
+import { AuthAndServerErrorFallback, ErrorSuspenseContainer } from '@/components';
 import ReviewDisplayLayout from '@/components/layouts/ReviewDisplayLayout';
 
 import ReviewCollectionPageContents from './components/ReviewCollectionPageContents';
@@ -8,7 +8,6 @@ const ReviewCollectionPage = () => {
     <ErrorSuspenseContainer fallback={AuthAndServerErrorFallback}>
       <ReviewDisplayLayout isReviewList={false}>
         <ReviewCollectionPageContents />
-        <TopButton />
       </ReviewDisplayLayout>
     </ErrorSuspenseContainer>
   );
diff --git a/frontend/src/pages/ReviewListPage/index.tsx b/frontend/src/pages/ReviewListPage/index.tsx
index a2aec6cdf..ada1bc7d4 100644
--- a/frontend/src/pages/ReviewListPage/index.tsx
+++ b/frontend/src/pages/ReviewListPage/index.tsx
@@ -1,4 +1,4 @@
-import { ErrorSuspenseContainer, AuthAndServerErrorFallback, TopButton } from '@/components';
+import { ErrorSuspenseContainer, AuthAndServerErrorFallback } from '@/components';
 import ReviewDisplayLayout from '@/components/layouts/ReviewDisplayLayout';
 
 import ReviewListPageContents from './components/ReviewListPageContents';
@@ -8,7 +8,6 @@ const ReviewListPage = () => {
     <ErrorSuspenseContainer fallback={AuthAndServerErrorFallback}>
       <ReviewDisplayLayout isReviewList={true}>
         <ReviewListPageContents />
-        <TopButton />
       </ReviewDisplayLayout>
     </ErrorSuspenseContainer>
   );