diff --git a/website/package-lock.json b/website/package-lock.json
index 71e8ce9a..ab47d093 100644
--- a/website/package-lock.json
+++ b/website/package-lock.json
@@ -9,6 +9,9 @@
       "version": "0.0.1",
       "dependencies": {
         "@astrojs/svelte": "^7.2.3",
+        "@fontsource/inter": "^5.2.8",
+        "@fontsource/open-sans": "^5.2.7",
+        "@fontsource/ramaraja": "^5.2.8",
         "@tailwindcss/vite": "^4.1.17",
         "astro": "^5.15.5",
         "svelte": "^5.45.8",
@@ -593,6 +596,33 @@
         "node": ">=18"
       }
     },
+    "node_modules/@fontsource/inter": {
+      "version": "5.2.8",
+      "resolved": "https://registry.npmjs.org/@fontsource/inter/-/inter-5.2.8.tgz",
+      "integrity": "sha512-P6r5WnJoKiNVV+zvW2xM13gNdFhAEpQ9dQJHt3naLvfg+LkF2ldgSLiF4T41lf1SQCM9QmkqPTn4TH568IRagg==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
+    "node_modules/@fontsource/open-sans": {
+      "version": "5.2.7",
+      "resolved": "https://registry.npmjs.org/@fontsource/open-sans/-/open-sans-5.2.7.tgz",
+      "integrity": "sha512-8yfgDYjE5O0vmTPdrcjV35y4yMnctsokmi9gN49Gcsr0sjzkMkR97AnKDe6OqZh2SFkYlR28fxOvi21bYEgMSw==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
+    "node_modules/@fontsource/ramaraja": {
+      "version": "5.2.8",
+      "resolved": "https://registry.npmjs.org/@fontsource/ramaraja/-/ramaraja-5.2.8.tgz",
+      "integrity": "sha512-MIrLpCbfo+L750CnkLmvkV/UKbvOXLfliPCDDHgolliTbryL7UqRRSq32UdxfAXGisSRrzq82zVNTdwljA0Mxw==",
+      "license": "OFL-1.1",
+      "funding": {
+        "url": "https://github.com/sponsors/ayuhito"
+      }
+    },
     "node_modules/@img/colour": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/@img/colour/-/colour-1.0.0.tgz",
diff --git a/website/package.json b/website/package.json
index 4ce356f4..4b6310fd 100644
--- a/website/package.json
+++ b/website/package.json
@@ -10,6 +10,9 @@
   },
   "dependencies": {
     "@astrojs/svelte": "^7.2.3",
+    "@fontsource/inter": "^5.2.8",
+    "@fontsource/open-sans": "^5.2.7",
+    "@fontsource/ramaraja": "^5.2.8",
     "@tailwindcss/vite": "^4.1.17",
     "astro": "^5.15.5",
     "svelte": "^5.45.8",
diff --git a/website/src/assets/backgrounds/chevron.svg b/website/src/assets/backgrounds/chevron.svg
index 15ce0393..b11335f8 100644
--- a/website/src/assets/backgrounds/chevron.svg
+++ b/website/src/assets/backgrounds/chevron.svg
@@ -7,13 +7,38 @@
    viewBox="0 0 43.898979 41.612965"
    version="1.1"
    id="svg1"
+   sodipodi:docname="chevron.svg"
+   inkscape:version="1.4.3 (0d15f75042, 2025-12-25)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
    xmlns="http://www.w3.org/2000/svg"
    xmlns:svg="http://www.w3.org/2000/svg">
+  <sodipodi:namedview
+     id="namedview1"
+     pagecolor="#505050"
+     bordercolor="#eeeeee"
+     borderopacity="1"
+     inkscape:showpageshadow="0"
+     inkscape:pageopacity="0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#505050"
+     inkscape:document-units="mm"
+     showgrid="false"
+     inkscape:zoom="5.1692123"
+     inkscape:cx="82.894641"
+     inkscape:cy="78.638673"
+     inkscape:window-width="1858"
+     inkscape:window-height="1022"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg1" />
   <defs
      id="defs1" />
   <g
      id="layer1"
-     transform="translate(-56.885413,-141.55208)">
+     transform="translate(-56.885413,-141.55208)"
+     style="fill:#1a84d2;fill-opacity:1">
     <path
        id="rect15"
        style="fill:#1a84d2;fill-opacity:1;stroke-width:2.74226;paint-order:markers fill stroke"
diff --git a/website/src/components/Contact.astro b/website/src/components/Contact.astro
index 484c069a..144baf23 100644
--- a/website/src/components/Contact.astro
+++ b/website/src/components/Contact.astro
@@ -7,14 +7,14 @@ import wedge from "../assets/backgrounds/wedge.svg";
   <div class="max-w-[130ch] mx-auto">
     <div class="flex flex-row">
       <div class="sm:w-2/5 p-6 py-12">
-        <div class="prose">
+        <div class="prose prose-headings:text-left">
           <Content />
         </div>
         <form action="message" class="mt-6">
           <div><label for="name">Name:</label></div>
           <div>
             <input
-              class="my-3 p-3 w-full border-2 border-sky-500 rounded-2xl"
+              class="my-3 p-3 w-full border-2 border-bdt-blue rounded-2xl"
               type="text"
               name="name"
               id="name"
@@ -24,7 +24,7 @@ import wedge from "../assets/backgrounds/wedge.svg";
           <div><label for="name">Email:</label></div>
           <div>
             <input
-              class="my-3 p-3 w-full border-2 border-sky-500 rounded-2xl"
+              class="my-3 p-3 w-full border-2 border-bdt-blue rounded-2xl"
               type="text"
               name="email"
               id="email"
@@ -34,13 +34,13 @@ import wedge from "../assets/backgrounds/wedge.svg";
           <div><label for="name">Message:</label></div>
           <div>
             <textarea
-              class="my-3 p-3 w-full h-40 border-2 border-sky-500 rounded-2xl"
+              class="my-3 p-3 w-full h-40 border-2 border-bdt-blue rounded-2xl"
               name="message"
               id="message"
               placeholder="Your message"></textarea>
           </div>
           <input
-            class="px-6 py-2 mt-3 font-serif font-bold bg-green-300 rounded-full text-lg cursor-pointer"
+            class="px-6 py-2 pt-3 mt-3 font-serif bg-bdt-green rounded-full text-xl cursor-pointer"
             type="submit"
             value="Submit"
             size=""
diff --git a/website/src/components/Footer.astro b/website/src/components/Footer.astro
index bcfe6401..b1168266 100644
--- a/website/src/components/Footer.astro
+++ b/website/src/components/Footer.astro
@@ -1,7 +1,5 @@
-<footer class="py-12 text-center flex flex-col gap-3 bg-green-300">
-  <a class="underline text-lg" href=`${import.meta.env.BASE_URL}/#top`
-    >Return to top</a
-  >
-  <p class="text-2xl! font-semibold font-serif">Benefit Decision Toolkit</p>
+<footer class="py-12 text-center flex flex-col gap-3 bg-bdt-green">
+  <a class="underline" href=`${import.meta.env.BASE_URL}/#top`>Return to top</a>
+  <p class="text-2xl! font-serif mt-2">Benefit Decision Toolkit</p>
   <p>With ❤️ from Philly</p>
 </footer>
diff --git a/website/src/components/Header.astro b/website/src/components/Header.astro
index 257aef3a..673ac5ec 100644
--- a/website/src/components/Header.astro
+++ b/website/src/components/Header.astro
@@ -4,7 +4,7 @@ import logo from "../assets/logos/bdt-logo-large-mono-dark.svg";
 import NavMenu from "./NavMenu.svelte";
 ---
 
-<header class="p-6 bg-sky-500 sm:static z-50">
+<header class="p-6 bg-bdt-blue sm:static z-50">
   <div
     class="flex flex-row justify-between items-baseline gap-6 max-w-[130ch] mx-auto"
   >
diff --git a/website/src/components/Hero.astro b/website/src/components/Hero.astro
index a4920f2a..bb107008 100644
--- a/website/src/components/Hero.astro
+++ b/website/src/components/Hero.astro
@@ -8,16 +8,16 @@ import { Content } from "../assets/copy/Hero.md";
 >
   <div class="max-w-[130ch] mx-auto mt-20">
     <div
-      class="prose prose-p:text-slate-100 prose-headings:text-slate-100 prose-headings:text-left max-w-120 prose-p:text-shadow-sm/35 prose-p:text-2xl! prose-p:leading-8! prose-headings:text-shadow-lg/15"
+      class="prose prose-p:text-slate-100 prose-headings:text-slate-100 prose-headings:text-left max-w-120 prose-p:text-shadow-sm/35 prose-p:text-xl! prose-p:leading-7! prose-headings:text-shadow-lg/15"
     >
       <Content />
     </div>
     <a href=`${import.meta.env.BASE_URL}/#projects`>
-      <p
-        class="mt-6 w-fit px-6 py-2 bg-white border-2 border-sky-500 rounded-full text-sky-700! text-lg font-bold font-serif"
+      <div
+        class="mt-6 w-fit px-6 py-2 pt-3 bg-white border-2 border-bdt-blue rounded-full text-sky-700 font-serif text-xl"
       >
-        See what we can do
-      </p>
+        <span>See what we can do</span>
+      </div>
     </a>
   </div>
 </section>
diff --git a/website/src/components/Overview.astro b/website/src/components/Overview.astro
index 4858f44c..c0b9763f 100644
--- a/website/src/components/Overview.astro
+++ b/website/src/components/Overview.astro
@@ -2,7 +2,7 @@
 import { Content } from "../assets/copy/Overview.md";
 ---
 
-<section id="overview" class="bg-green-200">
+<section id="overview" class="bg-bdt-green">
   <div class="max-w-[85ch] mx-auto py-12 px-3 prose">
     <Content />
   </div>
diff --git a/website/src/components/Process.astro b/website/src/components/Process.astro
index efbbe719..8517b9f8 100644
--- a/website/src/components/Process.astro
+++ b/website/src/components/Process.astro
@@ -3,7 +3,7 @@ import { Content } from "../assets/copy/Process.md";
 const steps = ["Create a Screener", "Add Logic", "Deploy Your Tool"];
 ---
 
-<section id="process" class="border-b-2 border-sky-500">
+<section id="process" class="border-b-2 border-bdt-blue">
   <div class="max-w-[85ch] mx-auto py-12 px-3 flex flex-col gap-8 relative">
     <div class="prose max-w-[85ch]">
       <Content />
diff --git a/website/src/components/Projects.astro b/website/src/components/Projects.astro
index 316476e9..92be9b48 100644
--- a/website/src/components/Projects.astro
+++ b/website/src/components/Projects.astro
@@ -6,7 +6,7 @@ const projects = await getCollection("projects");
 
 <section
   id="projects"
-  class="bg-sky-500/50 bg-[url(../assets/backgrounds/wavy.png)] bg-cover bg-blend-multiply"
+  class="bg-bdt-blue/60 bg-[url(../assets/backgrounds/wavy.png)] bg-cover bg-blend-multiply"
 >
   <div class="max-w-[130ch] mx-auto py-12 px-3">
     <h2 class="font-bold font-serif text-2xl text-center mb-9">
@@ -18,7 +18,7 @@ const projects = await getCollection("projects");
           const { Content } = await render(project);
           return (
             <li class="bg-white/50 p-6 rounded-2xl md:w-1/2">
-              <div class="prose">
+              <div class="prose prose-a:font-semibold">
                 <Content />
               </div>
             </li>
diff --git a/website/src/layouts/Layout.astro b/website/src/layouts/Layout.astro
index 4842a859..04fb8a25 100644
--- a/website/src/layouts/Layout.astro
+++ b/website/src/layouts/Layout.astro
@@ -2,6 +2,8 @@
 import "../styles/global.css";
 import Header from "../components/Header.astro";
 import Footer from "../components/Footer.astro";
+import "@fontsource/inter";
+import "@fontsource/ramaraja";
 ---
 
 <html lang="en" class="scroll-smooth">
@@ -13,7 +15,7 @@ import Footer from "../components/Footer.astro";
     <title>Benefit Decision Toolkit</title>
   </head>
   <body
-    class="prose-headings:font-serif prose-headings:text-center prose-p:text-black prose-p:leading-6 prose-a:font-semibold prose-h2:text-3xl prose-h3:text-2xl prose-p:text-lg"
+    class="prose-headings:font-serif prose-headings:font-normal prose-headings:text-center prose-p:text-black prose-p:leading-6 prose-h2:text-4xl prose-h3:text-3xl prose-p:text-lg"
   >
     <div id="top"></div>
     <Header />
diff --git a/website/src/styles/global.css b/website/src/styles/global.css
index 61aee364..f13ddf9b 100644
--- a/website/src/styles/global.css
+++ b/website/src/styles/global.css
@@ -2,6 +2,8 @@
 @plugin "@tailwindcss/typography";
 
 @theme {
-  --font-sans: "Open Sans";
-  --font-serif: "Ramaraja";
+  --font-sans: "Inter", sans;
+  --font-serif: "Ramaraja", serif;
+  --color-bdt-blue: #1a84d2;
+  --color-bdt-green: #cff7d3;
 }