From 79ba2a22ff545ee0afbc7b83b4d05679c49abcb9 Mon Sep 17 00:00:00 2001
From: Alexander Wang <3120367+alixander@users.noreply.github.com>
Date: Fri, 7 Aug 2026 16:35:53 -0700
Subject: [PATCH] docs: add sponsor page

---
 docs/sponsor.md           | 58 +++++++++++++++++++++++++++++++++++++++
 sidebars.ts               |  5 ++++
 src/styles/custom.scss    | 38 +++++++++++++++++++++++++
 src/theme/Footer/index.js |  2 +-
 4 files changed, 102 insertions(+), 1 deletion(-)
 create mode 100644 docs/sponsor.md

diff --git a/docs/sponsor.md b/docs/sponsor.md
new file mode 100644
index 0000000..f48be18
--- /dev/null
+++ b/docs/sponsor.md
@@ -0,0 +1,58 @@
+# Sponsor D2
+
+<p className="hero__subtitle sponsorSubtitle margin-bottom--lg">
+  {
+    "D2 is fiscally sponsored by Hack Club (501(c)(3)). All donations are tax-deductible in the United States."
+  }
+</p>
+
+<div className="sponsorActions margin-top--lg margin-bottom--lg">
+  <a
+    className="button button--primary button--lg"
+    href="https://hcb.hackclub.com/donations/start/d2"
+  >
+    <span>Donate to D2</span>
+  </a>
+  <a
+    className="button button--primary button--outline button--lg"
+    href="https://hcb.hackclub.com/d2"
+  >
+    <span>View fund</span>
+  </a>
+</div>
+
+## Where the money goes
+
+D2 is free and open source.
+
+Donations support:
+
+- Keeping d2lang.com, the Playground, icons, and other public tools online.
+- Maintaining build, package, and distribution infrastructure.
+- Supporting open-source projects that D2 depends on.
+
+Fund usage is transparent. D2 was created by Alexander Wang and Anmol Sethi,
+and Alexander is currently the maintainer. It was originally developed as part
+of our work in a for-profit company, Terrastruct, but is now split into its own
+independent project, funded purely through donations. Nothing will go towards
+either of us; I work on D2 out of passion, not as a source of income.
+
+Hack Club charges a 7% fee for maintaining the nonprofit organization. They do
+wonderful work providing community, programs, and events for teenagers to
+participate in real world tech.
+
+## How the fund works
+
+The [D2 fund](https://hcb.hackclub.com/d2) is public: you can see its balance and every
+transaction. Hack Club handles the fund and nonprofit administration.
+
+Sponsoring D2 does not affect its roadmap, governance, or license. D2 remains open source
+under the
+[Mozilla Public License 2.0](https://github.com/d2lang/d2/blob/master/LICENSE.txt), and
+development happens in public on [GitHub](https://github.com/d2lang/d2).
+
+## Companies
+
+If your company uses D2, it can donate through the same fund. Want to make a larger
+donation or contribute infrastructure or services? Email me at
+[alex@d2lang.com](mailto:alex@d2lang.com).
diff --git a/sidebars.ts b/sidebars.ts
index 3f20c30..a6951a5 100644
--- a/sidebars.ts
+++ b/sidebars.ts
@@ -157,6 +157,11 @@ const sidebars: SidebarsConfig = {
     "tour/faq",
     "tour/troubleshoot",
     "tour/help",
+    {
+      type: "doc",
+      id: "sponsor",
+      label: "Sponsor D2",
+    },
   ],
   releasesSidebar: [
     {
diff --git a/src/styles/custom.scss b/src/styles/custom.scss
index 089fa49..279bfa6 100644
--- a/src/styles/custom.scss
+++ b/src/styles/custom.scss
@@ -105,6 +105,44 @@ img {
   border: 1px solid var(--border);
 }
 
+.sponsorSubtitle {
+  max-width: 46rem;
+  color: var(--ifm-color-emphasis-700);
+  line-height: 1.4;
+}
+
+.sponsorActions {
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  gap: 0.75rem;
+
+  .button {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    flex: 0 1 11rem;
+    min-width: 11rem;
+  }
+}
+
+@media (max-width: 576px) {
+  .sponsorSubtitle {
+    font-size: 1.25rem;
+  }
+
+  .sponsorActions {
+    display: grid;
+    grid-template-columns: 1fr;
+
+    .button {
+      width: 100%;
+      min-width: 0;
+      white-space: normal;
+    }
+  }
+}
+
 // Alerts
 :root {
   .alert--success {
diff --git a/src/theme/Footer/index.js b/src/theme/Footer/index.js
index 8685c29..f082ed5 100644
--- a/src/theme/Footer/index.js
+++ b/src/theme/Footer/index.js
@@ -34,7 +34,7 @@ function Footer() {
           .
         </span>
         <div className="Footer__Links">
-          <a className="Footer__Link" href="https://hcb.hackclub.com/donations/start/d2">
+          <a className="Footer__Link" href="/sponsor/">
             Donate
           </a>
           <a className="Footer__Link" href="https://github.com/d2lang/d2">