diff --git a/src/components/Footer/index.tsx b/src/components/Footer/index.tsx
index b43f158..272af3d 100644
--- a/src/components/Footer/index.tsx
+++ b/src/components/Footer/index.tsx
@@ -1,23 +1,26 @@
+import React from 'react';
 import * as S from './styles';
 import interparkLogo from '@/assets/imgs/interpark-logo.png';
 import kopisLogo from '@/assets/imgs/kopis-logo.png';
 import yes24Logo from '@/assets/imgs/yes24-logo.png';
+
 const logoList = [
   { href: 'https://www.interpark.com', alt: 'interpark', src: interparkLogo },
   { href: 'https://www.kopis.or.kr', alt: 'KOPIS', src: kopisLogo },
   { href: 'https://www.yes24.com', alt: 'YES24', src: yes24Logo },
 ];
+
 export const Footer = () => {
   return (
     <S.FooterContainer>
       <S.StyledFooter>
         {logoList.map((logo, index) => (
-          <>
+          <React.Fragment key={logo.alt}>
             <a href={logo.href} target="_blank" rel="noopener noreferrer">
               <S.Logo src={logo.src} alt={logo.alt} />
             </a>
             {index < logoList.length - 1 && <S.StyledSeperator />}
-          </>
+          </React.Fragment>
         ))}
       </S.StyledFooter>
     </S.FooterContainer>
diff --git a/src/components/PaginationButton/index.tsx b/src/components/PaginationButton/index.tsx
new file mode 100644
index 0000000..1753998
--- /dev/null
+++ b/src/components/PaginationButton/index.tsx
@@ -0,0 +1,20 @@
+import * as S from './styles';
+
+interface PaginationButtonProps {
+  pageNumber: number;
+  currentPage: number;
+  onClickPaginationButton: (page: number) => void;
+}
+
+export const PaginationButton = ({ pageNumber, currentPage, onClickPaginationButton }: PaginationButtonProps) => {
+  const isActive = pageNumber === currentPage;
+  const onClick = (pageNumber: number) => () => onClickPaginationButton(pageNumber);
+
+  return (
+    <S.PaginationButton $isActive={isActive} onClick={onClick(pageNumber)}>
+      {pageNumber}
+    </S.PaginationButton>
+  );
+};
+
+export default PaginationButton;
diff --git a/src/components/PaginationButton/styles.ts b/src/components/PaginationButton/styles.ts
new file mode 100644
index 0000000..d2e9ba0
--- /dev/null
+++ b/src/components/PaginationButton/styles.ts
@@ -0,0 +1,16 @@
+import styled from 'styled-components';
+
+interface StyledPaginationButtonProps {
+  $isActive: boolean;
+}
+
+export const PaginationButton = styled.button<StyledPaginationButtonProps>`
+  padding: 5px 8px;
+  margin: 0 4px;
+  border: none;
+  border-radius: 4px;
+  background-color: ${({ $isActive, theme }) => ($isActive ? theme.colors.primary : theme.colors.white)};
+  color: ${({ $isActive, theme }) => ($isActive ? theme.colors.white : theme.colors.black)};
+  cursor: pointer;
+`;
+