diff --git a/sidebars.js b/sidebars.js
index e2bf9020f4..dd8ccd3eb5 100644
--- a/sidebars.js
+++ b/sidebars.js
@@ -13,7 +13,7 @@
 
 const privacyIconSVG = `
   <svg style="margin-right: 20px;" role="img" xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 576 512">
-    <path fill="#1f7a78" d="M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80zm0-208a128 128 0 1 1 0 256 128 128 0 1 1 0-256z"/>
+    <path fill="#aeb1be" d="M288 80c-65.2 0-118.8 29.6-159.9 67.7C89.6 183.5 63 226 49.4 256c13.6 30 40.2 72.5 78.6 108.3C169.2 402.4 222.8 432 288 432s118.8-29.6 159.9-67.7C486.4 328.5 513 286 526.6 256c-13.6-30-40.2-72.5-78.6-108.3C406.8 109.6 353.2 80 288 80zM95.4 112.6C142.5 68.8 207.2 32 288 32s145.5 36.8 192.6 80.6c46.8 43.5 78.1 95.4 93 131.1c3.3 7.9 3.3 16.7 0 24.6c-14.9 35.7-46.2 87.7-93 131.1C433.5 443.2 368.8 480 288 480s-145.5-36.8-192.6-80.6C48.6 356 17.3 304 2.5 268.3c-3.3-7.9-3.3-16.7 0-24.6C17.3 208 48.6 156 95.4 112.6zM288 336c44.2 0 80-35.8 80-80s-35.8-80-80-80c-.7 0-1.3 0-2 0c1.3 5.1 2 10.5 2 16c0 35.3-28.7 64-64 64c-5.5 0-10.9-.7-16-2c0 .7 0 1.3 0 2c0 44.2 35.8 80 80 80zm0-208a128 128 0 1 1 0 256 128 128 0 1 1 0-256z"/>
   </svg>
 `;
 
diff --git a/src/components/PacksTable/PacksTable.tsx b/src/components/PacksTable/PacksTable.tsx
index f95568b56c..a0c7cf2df3 100644
--- a/src/components/PacksTable/PacksTable.tsx
+++ b/src/components/PacksTable/PacksTable.tsx
@@ -130,6 +130,14 @@ const FilteredTable: React.FC = () => {
   const [error, setError] = useState(false);
   const { colorMode } = useColorMode();
   const { defaultAlgorithm, darkAlgorithm } = theme;
+  const isDark = colorMode === "dark";
+  const customTheme = {
+    algorithm: isDark ? darkAlgorithm : defaultAlgorithm, // Start with the default dark theme
+    token: {
+      colorBgContainer: isDark ? "#012121" : "#F3F0EE",
+      colorPrimary: isDark ? "#44B2AF" : "#1F7A78",
+    },
+  };
 
   useEffect(() => {
     fetch("/packs-data/packs_report.json")
@@ -168,7 +176,7 @@ const FilteredTable: React.FC = () => {
 
   return (
     <div className={styles.tabPane}>
-      <ConfigProvider theme={{ algorithm: colorMode === "dark" ? darkAlgorithm : defaultAlgorithm }}>
+      <ConfigProvider theme={customTheme}>
         <div className={styles.unsupportedMessage}>
           <Admonition type="warning" title="Unsupported Display Size">
             The current screen size is not supported. Use a larger display to access the Packs table.
diff --git a/src/css/custom.scss b/src/css/custom.scss
index 72c68f9a59..a60b20f836 100644
--- a/src/css/custom.scss
+++ b/src/css/custom.scss
@@ -43,11 +43,12 @@ html {
   --ifm-link-decoration: underline;
 }
 
-// Remove link underlines from navbar, tags, and table of contents.
+// Remove link underlines from navbar, tags, cards and table of contents.
 nav a,
 .table-of-contents a,
-[class^="tag_"] {
-  text-decoration: none;
+[class^="tag_"] a,
+[class*="cardContainer_"] {
+  text-decoration: none !important;
 }
 
 // Adjust logo to be 40px high
diff --git a/src/css/dark-mode.scss b/src/css/dark-mode.scss
index 640bc1fe58..91e0aac977 100644
--- a/src/css/dark-mode.scss
+++ b/src/css/dark-mode.scss
@@ -18,6 +18,7 @@ html[data-theme="dark"] {
   --ifm-navbar-link-color: #ffffff;
   --ifm-navbar-background-color: var(--ifm-background-color);
   --ifm-toc-link-color: var(--ifm-font-color-base);
+  --ifm-card-background-color: var(--ifm-dropdown-background-color);
   --ifm-tabs-color: #818ba9;
   --docsearch-muted-color: #818ba9;
   --ifm-menu-color-background-hover: var(--ifm-dropdown-background-color);
diff --git a/src/css/light-mode.scss b/src/css/light-mode.scss
index 4d5a19361d..ab244376ed 100644
--- a/src/css/light-mode.scss
+++ b/src/css/light-mode.scss
@@ -33,6 +33,7 @@ html[data-theme="light"] {
   --ifm-color-danger-dark: #feeded;
   --ifm-alert-padding-horizontal: 1.5rem;
   --ifm-dropdown-background-color: var(--ifm-menu-color-background-active);
+  --ifm-card-background-color: var(--ifm-dropdown-background-color);
   --custom-table-header-color: #f7f7f7;
   --simpleCardPrimary: var(--ifm-color-primary);
   --simpleCardPrimaryHover: #135757;