diff --git a/src/components/board-pagination/board-pagination.module.css b/src/components/board-pagination/board-pagination.module.css
index 7d45ca25..625a8a0f 100644
--- a/src/components/board-pagination/board-pagination.module.css
+++ b/src/components/board-pagination/board-pagination.module.css
@@ -46,6 +46,8 @@
   overflow: hidden;
   list-style: none;
   background-color: var(--pagelist-background-color);
+  border-right: 1px solid var(--pagelist-item-border-color);
+  border-bottom: 1px solid var(--pagelist-item-border-color);
 }
 
 .footerPageItem {
@@ -97,7 +99,7 @@
   background: transparent;
   list-style: none;
   overflow: hidden;
-  color: var(--boardsbar-desktop-link-text-color);
+  color: var(--button-desktop-text-color);
 }
 
 .footerPageLink {
@@ -108,15 +110,14 @@
   padding: 0;
   border: none;
   background: transparent;
-  color: var(--boardsbar-desktop-link-text-color);
+  color: var(--button-desktop-text-color);
   text-transform: capitalize;
   cursor: pointer;
-  text-decoration: var(--boardsbar-desktop-link-text-decoration);
+  text-decoration: var(--button-text-decoration);
 }
 
 .footerPageLink:hover {
-  color: var(--boardsbar-desktop-link-text-color-hover);
-  text-decoration: var(--boardsbar-desktop-link-text-decoration-hover);
+  color: var(--button-desktop-text-color-hover);
 }
 
 .pagelistSeparatorLink {
@@ -127,7 +128,6 @@
 }
 
 .footerPageCurrent {
+  composes: footerPageLink;
   font-weight: bold;
-  color: var(--boardsbar-desktop-link-text-color-hover);
-  text-decoration: var(--boardsbar-desktop-link-text-decoration);
 }
diff --git a/src/components/board-pagination/board-pagination.tsx b/src/components/board-pagination/board-pagination.tsx
index d62730ce..25ce137b 100644
--- a/src/components/board-pagination/board-pagination.tsx
+++ b/src/components/board-pagination/board-pagination.tsx
@@ -61,23 +61,15 @@ const BoardPagination = ({ basePath, currentPage, totalPages, footerStyle = fals
                 <span className={styles.footerPageBracket}>]</span>
               </span>
             )}
-            {pageNumbers.map((page) =>
-              page === currentPage ? (
-                <span key={page} className={styles.footerPageItem}>
-                  <span className={styles.footerPageBracket}>[</span>
-                  <span className={styles.footerPageCurrent}>{page}</span>
-                  <span className={styles.footerPageBracket}>]</span>
-                </span>
-              ) : (
-                <span key={page} className={styles.footerPageItem}>
-                  <span className={styles.footerPageBracket}>[</span>
-                  <Link to={pageHref(page)} className={styles.footerPageLink}>
-                    {page}
-                  </Link>
-                  <span className={styles.footerPageBracket}>]</span>
-                </span>
-              ),
-            )}
+            {pageNumbers.map((page) => (
+              <span key={page} className={styles.footerPageItem}>
+                <span className={styles.footerPageBracket}>[</span>
+                <Link to={pageHref(page)} className={page === currentPage ? styles.footerPageCurrent : styles.footerPageLink}>
+                  {page}
+                </Link>
+                <span className={styles.footerPageBracket}>]</span>
+              </span>
+            ))}
             {currentPage < totalPages ? (
               <button type='button' className={styles.pagelistNavButton} onClick={() => navigate(pageHref(currentPage + 1))}>
                 {t('next')}