diff --git a/www/components/CTABanner/index.tsx b/www/components/CTABanner/index.tsx
index fac5d9a0758..10448082461 100644
--- a/www/components/CTABanner/index.tsx
+++ b/www/components/CTABanner/index.tsx
@@ -1,8 +1,13 @@
 import Button from 'components/Button'
 
-const CTABanner = () => {
+const CTABanner = (props: any) => {
+  const { darkerBg } = props
   return (
-    <div className="py-32 grid grid-cols-12 gap-4 items-center text-center bg-dark-800 px-16">
+    <div className={`
+        py-32 grid grid-cols-12 gap-4 items-center text-center bg-dark-800 
+        ${darkerBg ? 'dark:bg-dark-900' : ''} px-16
+      `}
+    >
       <div className="col-span-12">
         <h4 className="flex flex-col sm:flex-row sm:justify-center font-normal text-white text-2xl lg:text-3xl">
           <span className="block">Build in a weekend, scale to millions.</span>
diff --git a/www/pages/beta.tsx b/www/pages/beta.tsx
index 24fff8c2244..03eddcf22a3 100644
--- a/www/pages/beta.tsx
+++ b/www/pages/beta.tsx
@@ -1,13 +1,14 @@
 import Head from 'next/head'
+import { useRouter } from 'next/router'
 import { useEffect, useRef, useState } from 'react'
 import Container from 'components/Container'
 import Layout from 'components/Layout'
 import CountUp from 'components/CountUp'
 import FlyOut from 'components/UI/FlyOut'
+import CTABanner from 'components/CTABanner/index'
 import { APP_NAME, DESCRIPTION } from 'lib/constants'
 import { AlphaNumbers, IntroductionSegments, PerformanceComparisonData } from 'data/BetaPage'
 import { render } from 'react-dom'
-import { useRouter } from 'next/router'
 import Link from 'next/link'
 import { addBasePath } from 'next/dist/next-server/lib/router/router'
 
@@ -1016,6 +1017,7 @@ const Beta = () => {
         <div ref={references['next']}>
           <WhatsNext />
         </div>
+        <CTABanner darkerBg={true} />
       </Container>
     </Layout>
   )