diff --git a/data-table.js b/data-table.js
index 1488ad5..e60445c 100644
--- a/data-table.js
+++ b/data-table.js
@@ -281,6 +281,8 @@ class DataTable extends IgniteElement {
             pageJumpToClass: "form-select border-0 w-auto text-dark",
             showRefreshButton: true,
             refreshButtonClass: "btn btn-secondary text-dark",
+            primaryPageButtonClass: "btn-primary",
+            secondaryPageButtonClass: "btn-secondary",
             refresh: null,
             pendingFilter: null,
             loading: false
@@ -411,7 +413,7 @@ class DataTable extends IgniteElement {
 
                                 return new button()
                                     .class("btn text-center flex-grow-1")
-                                    .class(current, current => current ? "btn-primary" : "btn-secondary")
+                                    .class(current, current => current ? this.primaryPageButtonClass : this.secondaryPageButtonClass)
                                     .innerText(filler ? "..." : index + 1)
                                     .onClick(() => this.currentPage = index)
                             }),