diff --git a/docs/getting-started/index.md b/docs/getting-started/index.md
deleted file mode 100644
index 4e14f032..00000000
--- a/docs/getting-started/index.md
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Getting Started
----
-
-# Getting Started
-
-If you're new to Harper, this section will guide you through the essential resources you need to get started.
-
-Follow the steps in this documentation to discover how Harper can simplify your backend stack, eliminate many inter-process communication delays, and achieve a more predictable and performant application experience.
-
-For more advanced concepts in Harper, see our [blog](https://www.harpersystems.dev/blog).
-
-## Harper Basics
-
-
- Learn about Harper's fundamental concepts and how they interact
-
-
-
diff --git a/docs/getting-started/index.mdx b/docs/getting-started/index.mdx
new file mode 100644
index 00000000..7bdd18bd
--- /dev/null
+++ b/docs/getting-started/index.mdx
@@ -0,0 +1,45 @@
+---
+title: Getting Started
+---
+
+import CustomDocCardList from '@site/src/components/CustomDocCardList';
+
+# Getting Started
+
+If you're new to Harper, this section will guide you through the essential resources you need to get started.
+
+Follow the steps in this documentation to discover how Harper can simplify your backend stack, eliminate many inter-process communication delays, and achieve a more predictable and performant application experience.
+
+For more advanced concepts in Harper, see our [blog](https://www.harpersystems.dev/blog).
+
+## Harper Basics
+
+
diff --git a/docs/index.md b/docs/index.md
deleted file mode 100644
index 79e62363..00000000
--- a/docs/index.md
+++ /dev/null
@@ -1,104 +0,0 @@
----
-title: Harper Docs
----
-
-# Harper Docs
-
-:::info
-[Connect with our team!](https://www.harpersystems.dev/contact)
-:::
-
-Welcome to the Harper Documentation! Here, you'll find all things Harper, and everything you need to get started, troubleshoot issues, and make the most of our platform.
-
-## Getting Started
-
-
- The process of connecting multiple Harper databases together to create a database mesh network that enables users to define data replication patterns.
-
- The web-based GUI for Harper. Studio enables you to administer, navigate, and monitor all of your Harper instances in a simple, user friendly interface.
-
-
-
diff --git a/docs/index.mdx b/docs/index.mdx
new file mode 100644
index 00000000..19f890a6
--- /dev/null
+++ b/docs/index.mdx
@@ -0,0 +1,79 @@
+---
+title: Harper Docs
+---
+
+import CustomDocCardList from '@site/src/components/CustomDocCardList';
+
+# Harper Docs
+
+:::info
+[Connect with our team!](https://www.harpersystems.dev/contact)
+:::
+
+Welcome to the Harper Documentation! Here, you'll find all things Harper, and everything you need to get started, troubleshoot issues, and make the most of our platform.
+
+## Getting Started
+
+
+
+## Building with Harper
+
+
diff --git a/src/components/CustomDocCardList.module.css b/src/components/CustomDocCardList.module.css
new file mode 100644
index 00000000..349a65b7
--- /dev/null
+++ b/src/components/CustomDocCardList.module.css
@@ -0,0 +1,48 @@
+.cardGrid {
+ display: grid;
+ grid-template-columns: repeat(var(--columns, 2), 1fr);
+ gap: var(--ifm-spacing-horizontal);
+ margin-bottom: 2rem;
+}
+
+.customCard {
+ --ifm-link-color: var(--ifm-color-emphasis-800);
+ --ifm-link-hover-color: var(--ifm-color-emphasis-700);
+ --ifm-link-hover-decoration: none;
+ box-shadow: 0 1.5px 3px 0 rgb(0 0 0 / 15%);
+ border: 1px solid var(--ifm-color-emphasis-200);
+ transition: all var(--ifm-transition-fast) ease;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+}
+
+.customCard:hover {
+ border-color: var(--ifm-color-primary);
+ box-shadow: 0 3px 6px 0 rgb(0 0 0 / 20%);
+ text-decoration: none;
+}
+
+.cardTitle {
+ font-size: 1.2rem;
+ margin-bottom: 0.5rem;
+}
+
+.cardDescription {
+ font-size: 0.9rem;
+ color: var(--ifm-color-content-secondary);
+ margin-bottom: 0;
+}
+
+/* Responsive breakpoints */
+@media (max-width: 996px) {
+ .cardGrid {
+ grid-template-columns: repeat(min(2, var(--columns, 2)), 1fr);
+ }
+}
+
+@media (max-width: 650px) {
+ .cardGrid {
+ grid-template-columns: 1fr;
+ }
+}
diff --git a/src/components/CustomDocCardList.tsx b/src/components/CustomDocCardList.tsx
new file mode 100644
index 00000000..c260724f
--- /dev/null
+++ b/src/components/CustomDocCardList.tsx
@@ -0,0 +1,37 @@
+import React from 'react';
+import clsx from 'clsx';
+import Link from '@docusaurus/Link';
+import { filterDocCardListItems } from '@docusaurus/plugin-content-docs/client';
+import Heading from '@theme/Heading';
+import styles from './CustomDocCardList.module.css';
+
+interface CustomDocCardListProps {
+ items: any[];
+ columns?: number;
+ className?: string;
+}
+
+function CustomDocCard({ item }: { item: any }) {
+ return (
+
+
+ {item.label}
+
+ {item.description &&
+ );
+}
diff --git a/versioned_docs/version-4.5/getting-started/index.md b/versioned_docs/version-4.5/getting-started/index.md
deleted file mode 100644
index 4e14f032..00000000
--- a/versioned_docs/version-4.5/getting-started/index.md
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Getting Started
----
-
-# Getting Started
-
-If you're new to Harper, this section will guide you through the essential resources you need to get started.
-
-Follow the steps in this documentation to discover how Harper can simplify your backend stack, eliminate many inter-process communication delays, and achieve a more predictable and performant application experience.
-
-For more advanced concepts in Harper, see our [blog](https://www.harpersystems.dev/blog).
-
-## Harper Basics
-
-
- Learn about Harper's fundamental concepts and how they interact
-
-
-
diff --git a/versioned_docs/version-4.5/getting-started/index.mdx b/versioned_docs/version-4.5/getting-started/index.mdx
new file mode 100644
index 00000000..7bdd18bd
--- /dev/null
+++ b/versioned_docs/version-4.5/getting-started/index.mdx
@@ -0,0 +1,45 @@
+---
+title: Getting Started
+---
+
+import CustomDocCardList from '@site/src/components/CustomDocCardList';
+
+# Getting Started
+
+If you're new to Harper, this section will guide you through the essential resources you need to get started.
+
+Follow the steps in this documentation to discover how Harper can simplify your backend stack, eliminate many inter-process communication delays, and achieve a more predictable and performant application experience.
+
+For more advanced concepts in Harper, see our [blog](https://www.harpersystems.dev/blog).
+
+## Harper Basics
+
+
diff --git a/versioned_docs/version-4.5/index.md b/versioned_docs/version-4.5/index.md
deleted file mode 100644
index 44b6e300..00000000
--- a/versioned_docs/version-4.5/index.md
+++ /dev/null
@@ -1,104 +0,0 @@
----
-title: Harper Docs
----
-
-# Harper Docs
-
-:::info
-[Connect with our team!](https://www.harpersystems.dev/contact)
-:::
-
-Welcome to the Harper Documentation! Here, you'll find all things Harper, and everything you need to get started, troubleshoot issues, and make the most of our platform.
-
-## Getting Started
-
-
- The process of connecting multiple Harper databases together to create a database mesh network that enables users to define data replication patterns.
-
- The web-based GUI for Harper. Studio enables you to administer, navigate, and monitor all of your Harper instances in a simple, user friendly interface.
-
-
-
diff --git a/versioned_docs/version-4.5/index.mdx b/versioned_docs/version-4.5/index.mdx
new file mode 100644
index 00000000..fb458855
--- /dev/null
+++ b/versioned_docs/version-4.5/index.mdx
@@ -0,0 +1,79 @@
+---
+title: Harper Docs
+---
+
+import CustomDocCardList from '@site/src/components/CustomDocCardList';
+
+# Harper Docs
+
+:::info
+[Connect with our team!](https://www.harpersystems.dev/contact)
+:::
+
+Welcome to the Harper Documentation! Here, you'll find all things Harper, and everything you need to get started, troubleshoot issues, and make the most of our platform.
+
+## Getting Started
+
+
+
+## Building with Harper
+
+
diff --git a/versioned_docs/version-4.6/getting-started/index.md b/versioned_docs/version-4.6/getting-started/index.md
deleted file mode 100644
index 4e14f032..00000000
--- a/versioned_docs/version-4.6/getting-started/index.md
+++ /dev/null
@@ -1,46 +0,0 @@
----
-title: Getting Started
----
-
-# Getting Started
-
-If you're new to Harper, this section will guide you through the essential resources you need to get started.
-
-Follow the steps in this documentation to discover how Harper can simplify your backend stack, eliminate many inter-process communication delays, and achieve a more predictable and performant application experience.
-
-For more advanced concepts in Harper, see our [blog](https://www.harpersystems.dev/blog).
-
-## Harper Basics
-
-
- Learn about Harper's fundamental concepts and how they interact
-
-
-
diff --git a/versioned_docs/version-4.6/getting-started/index.mdx b/versioned_docs/version-4.6/getting-started/index.mdx
new file mode 100644
index 00000000..7bdd18bd
--- /dev/null
+++ b/versioned_docs/version-4.6/getting-started/index.mdx
@@ -0,0 +1,45 @@
+---
+title: Getting Started
+---
+
+import CustomDocCardList from '@site/src/components/CustomDocCardList';
+
+# Getting Started
+
+If you're new to Harper, this section will guide you through the essential resources you need to get started.
+
+Follow the steps in this documentation to discover how Harper can simplify your backend stack, eliminate many inter-process communication delays, and achieve a more predictable and performant application experience.
+
+For more advanced concepts in Harper, see our [blog](https://www.harpersystems.dev/blog).
+
+## Harper Basics
+
+
diff --git a/versioned_docs/version-4.6/index.md b/versioned_docs/version-4.6/index.md
deleted file mode 100644
index 79e62363..00000000
--- a/versioned_docs/version-4.6/index.md
+++ /dev/null
@@ -1,104 +0,0 @@
----
-title: Harper Docs
----
-
-# Harper Docs
-
-:::info
-[Connect with our team!](https://www.harpersystems.dev/contact)
-:::
-
-Welcome to the Harper Documentation! Here, you'll find all things Harper, and everything you need to get started, troubleshoot issues, and make the most of our platform.
-
-## Getting Started
-
-
- The process of connecting multiple Harper databases together to create a database mesh network that enables users to define data replication patterns.
-
- The web-based GUI for Harper. Studio enables you to administer, navigate, and monitor all of your Harper instances in a simple, user friendly interface.
-
-
-
diff --git a/versioned_docs/version-4.6/index.mdx b/versioned_docs/version-4.6/index.mdx
new file mode 100644
index 00000000..19f890a6
--- /dev/null
+++ b/versioned_docs/version-4.6/index.mdx
@@ -0,0 +1,79 @@
+---
+title: Harper Docs
+---
+
+import CustomDocCardList from '@site/src/components/CustomDocCardList';
+
+# Harper Docs
+
+:::info
+[Connect with our team!](https://www.harpersystems.dev/contact)
+:::
+
+Welcome to the Harper Documentation! Here, you'll find all things Harper, and everything you need to get started, troubleshoot issues, and make the most of our platform.
+
+## Getting Started
+
+
+
+## Building with Harper
+
+