diff --git a/website/src/css/components/buttons.css b/website/src/css/components/buttons.css
new file mode 100644
index 00000000..4ef83046
--- /dev/null
+++ b/website/src/css/components/buttons.css
@@ -0,0 +1,50 @@
+
+.button
+{
+    border-radius: 2em;
+    display: inline-block;
+    font-size: 0.9em;
+    font-weight: var(--font-weight-light);
+    padding: 0.5em 1.5em;
+    text-align: center;
+}
+
+.button.primary
+{
+    background-color: var(--swatch-color-red-3);
+    border: 1px solid var(--swatch-color-red-3);
+    color: var(--swatch-color-white);
+}
+
+.button.primary:hover
+{
+    background-color: var(--swatch-color-red-2);
+    border: 1px solid var(--swatch-color-red-2);
+}
+
+.button.secondary
+{
+    background-color: var(--swatch-color-blue-5);
+    border: 1px solid var(--swatch-color-blue-5);
+    color: var(--swatch-color-white);
+}
+
+.button.secondary:hover
+{
+    background-color: var(--swatch-color-blue-4);
+    border: 1px solid var(--swatch-color-blue-4);
+}
+
+.button.inactive
+{
+    background-color: transparent;
+    border: 1px solid var(--swatch-color-gray-3);
+    color: var(--swatch-color-red-3);
+}
+
+.button.inactive:hover
+{
+    background-color: var(--swatch-color-gray-1);
+    border: 1px solid var(--swatch-color-gray-3);
+    color: var(--swatch-color-red-3);
+}
diff --git a/website/src/css/components/cards.css b/website/src/css/components/cards.css
index 74e3047f..592b3301 100644
--- a/website/src/css/components/cards.css
+++ b/website/src/css/components/cards.css
@@ -30,8 +30,8 @@
     border: 1px solid var(--swatch-color-white);
     border-top: 0.5em solid var(--swatch-color-red-3);
     display: flex;
-    gap: 2em;
     flex-direction: column;
+    gap: 2em;
     padding: 2.0em 1.0em;
     text-align: center;
 }
@@ -67,29 +67,14 @@
     margin: 0;
 }
 
-.card a
+.card .button
 {
-    background-color: transparent;
-    border: 1px solid var(--swatch-color-gray-3);
-    border-radius: 2em;
-    color: var(--swatch-color-red-3);
-    display: inline-block;
     flex-grow: 0;
     flex-shrink: 0;
-    font-size: 0.9em;
-    font-weight: var(--font-weight-light);
     padding: 0.5em 0;
-    text-align: center;
     width: 12em;
 }
 
-.card a:hover
-{
-    background-color: var(--swatch-color-gray-1);
-    border: 1px solid var(--swatch-color-gray-3);
-    color: var(--swatch-color-red-3);
-}
-
 .card.inactive
 {
     background-color: transparent;
@@ -106,20 +91,6 @@
     border-top: 0.5em solid var(--swatch-color-gray-3);
 }
 
-.card.inactive a
-{
-    background-color: var(--swatch-color-red-3);
-    border: 1px solid var(--swatch-color-red-3);
-    color: var(--swatch-color-white);
-}
-
-.card.inactive a:hover
-{
-    background-color: var(--swatch-color-red-2);
-    border: 1px solid var(--swatch-color-red-2);
-    color: var(--swatch-color-white);
-}
-
 @media (min-width: 1200px)
 {
     .cards
diff --git a/website/src/css/components/grow.css b/website/src/css/components/grow.css
new file mode 100644
index 00000000..a48924d7
--- /dev/null
+++ b/website/src/css/components/grow.css
@@ -0,0 +1,101 @@
+
+.grow
+{
+    align-content: stretch;
+    align-items: stretch;
+    background-color: var(--swatch-color-white);
+    display: flex;
+    justify-content: space-evenly;
+    width: 100%;
+}
+
+.grow .option
+{
+    align-items: center;
+    display: flex;
+    flex-direction: column;
+    flex-grow: 1;
+    flex-shrink: 1;
+    gap: 0.7em;
+}
+
+.grow .divider
+{
+    flex-grow: 0;
+    flex-shrink: 0;
+}
+
+.grow .option h3
+{
+    flex-grow: 0;
+    flex-shrink: 0;
+    font-size: 1.5em;
+    font-weight: var(--font-weight-medium);
+    margin: 0;
+}
+
+.grow .option .button
+{
+    flex-grow: 0;
+    flex-shrink: 0;
+    width: 8em;
+}
+
+.grow .contribute
+{
+    border-left: 0.5em solid var(--swatch-color-blue-5);
+    padding: 2em 4vw 2em 6vw;
+}
+
+.grow .sponsor
+{
+    border-right: 0.5em solid var(--swatch-color-red-3);
+    padding: 2em 6vw 2em 4vw;
+}
+
+@media (min-width: 795px)
+{
+    .grow
+    {
+        flex-direction: row;
+    }
+
+    .grow .option
+    {
+        width: 50%;
+    }
+
+    .grow .divider
+    {
+        background-image: url('../../images/project/breaker-grow-vertical.svg');
+        background-position: center center; 
+        background-repeat: no-repeat;
+        background-size: cover;
+        width: 120px;
+    }
+}
+
+@media (max-width: 795px)
+{
+    .grow
+    {
+        flex-direction: column;
+    }
+
+    .grow .option
+    {
+        width: auto;
+    }
+
+    .grow .divider
+    {
+        background-image: url('../../images/project/breaker-grow-horizontal.svg');
+        background-position: center center; 
+        background-repeat: no-repeat;
+        background-size: cover;
+        border-left: 0.5em solid var(--swatch-color-blue-5);
+        border-right: 0.5em solid var(--swatch-color-red-3);
+        height: 11vw;
+        width: auto;
+    }
+}
diff --git a/website/src/images/project/breaker-grow-horizontal.svg b/website/src/images/project/breaker-grow-horizontal.svg
new file mode 100644
index 00000000..e0fecf91
--- /dev/null
+++ b/website/src/images/project/breaker-grow-horizontal.svg
@@ -0,0 +1 @@
+<svg version="1.1" viewBox="0.0 0.0 521.8740157480315 64.0" fill="none" stroke="none" stroke-linecap="square" stroke-miterlimit="10" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><clipPath id="p.0"><path d="m0 0l521.874 0l0 64.0l-521.874 0l0 -64.0z" clip-rule="nonzero"/></clipPath><g clip-path="url(#p.0)"><path fill="#000000" fill-opacity="0.0" d="m0 0l521.874 0l0 64.0l-521.874 0z" fill-rule="evenodd"/><path fill="#f3f3f3" d="m521.7008 0l-521.8268 56.7616l0 7.2383995l521.8268 -56.7616z" fill-rule="evenodd"/></g></svg>
\ No newline at end of file
diff --git a/website/src/images/project/breaker-grow-vertical.svg b/website/src/images/project/breaker-grow-vertical.svg
new file mode 100644
index 00000000..4c1d1bd5
--- /dev/null
+++ b/website/src/images/project/breaker-grow-vertical.svg
@@ -0,0 +1 @@
+<svg version="1.1" viewBox="0.0 0.0 112.501312335958 269.0472440944882" fill="none" stroke="none" stroke-linecap="square" stroke-miterlimit="10" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><clipPath id="p.0"><path d="m0 0l112.50131 0l0 269.04724l-112.50131 0l0 -269.04724z" clip-rule="nonzero"/></clipPath><g clip-path="url(#p.0)"><path fill="#000000" fill-opacity="0.0" d="m0 0l112.50131 0l0 269.04724l-112.50131 0z" fill-rule="evenodd"/><path fill="#f3f3f3" d="m-0.12729658 269.10748l100.00321 -269.16534l12.752693 0l-100.00321 269.16534z" fill-rule="evenodd"/></g></svg>
\ No newline at end of file
diff --git a/website/src/index.html b/website/src/index.html
index 96352327..c64352a8 100644
--- a/website/src/index.html
+++ b/website/src/index.html
@@ -255,55 +255,71 @@ <h2>
                             <img src="images/features/segmentation.svg" alt="Segmentation">
                             <h3>Segmentation</h3>
                             <p>Breaks down applications into deployable packages.</p>
-                            <a href="https://docs.jitar.dev/fundamentals/building-blocks.html#segments" target="_blank">Learn more</a>
+                            <a class="button inactive" href="https://docs.jitar.dev/fundamentals/building-blocks.html#segments" target="_blank">Learn more</a>
                         </div>
                         <div class="card">
                             <img src="images/features/orchestration.svg" alt="Orchestration">
                             <h3>Orchestration</h3>
                             <p>Coordinates running segmented procedures.</p>
-                            <a href="https://docs.jitar.dev/fundamentals/building-blocks.html#automated-orchestration" target="_blank">Learn more</a>
+                            <a class="button inactive" href="https://docs.jitar.dev/fundamentals/building-blocks.html#automated-orchestration" target="_blank">Learn more</a>
                         </div>
                         <div class="card">
                             <img src="images/features/load-balancing.svg" alt="Load balancing">
                             <h3>Load balancing</h3>
                             <p>Balances the execution of procedures automatically.</p>
-                            <a href="https://docs.jitar.dev/deploy/load-balancing.html" target="_blank">Learn more</a>
+                            <a class="button inactive" href="https://docs.jitar.dev/deploy/load-balancing.html" target="_blank">Learn more</a>
                         </div>
                         <div class="card">
                             <img src="images/features/access-protection.svg" alt="Access protection">
                             <h3>Access protection</h3>
                             <p>Protects the access to private procedures.</p>
-                            <a href="https://docs.jitar.dev/deploy/segmentation.html#access-protection" target="_blank">Learn more</a>
+                            <a class="button inactive" href="https://docs.jitar.dev/deploy/segmentation.html#access-protection" target="_blank">Learn more</a>
                         </div>
                         <div class="card">
                             <img src="images/features/transportation.svg" alt="Transportation">
                             <h3>Transportation</h3>
                             <p>(de)serializes data automatically.</p>
-                            <a href="https://docs.jitar.dev/develop/data-sharing.html#automatic-de-serialization" target="_blank">Learn more</a>
+                            <a class="button inactive" href="https://docs.jitar.dev/develop/data-sharing.html#automatic-de-serialization" target="_blank">Learn more</a>
                         </div>
                         <div class="card">
                             <img src="images/features/multi-version.svg" alt="Multi-version">
                             <h3>Multi-version</h3>
                             <p>Supports multiple versions of the same procedure.</p>
-                            <a href="https://docs.jitar.dev/deploy/segmentation.html#versioning" target="_blank">Learn more</a>
+                            <a class="button inactive" href="https://docs.jitar.dev/deploy/segmentation.html#versioning" target="_blank">Learn more</a>
                         </div>
                         <div class="card">
                             <img src="images/features/integration.svg" alt="Integration">
                             <h3>Integration</h3>
                             <p>Integrates in any existing landscape.</p>
-                            <a href="https://docs.jitar.dev/integrate/rpc-api.html" target="_blank">Learn more</a>
+                            <a class="button inactive" href="https://docs.jitar.dev/integrate/rpc-api.html" target="_blank">Learn more</a>
                         </div>
                         <div class="card inactive">
                             <img src="images/features/and-more.svg" alt="And more ...">
                             <h3>And more ...</h3>
                             <p>Validation, health checks, middleware, hooks, …</p>
-                            <a href="https://docs.jitar.dev" target="_blank">Read the docs</a>
+                            <a class="button primary" href="https://docs.jitar.dev" target="_blank">Read the docs</a>
                         </div>
                     </div>
                 </section>
 
-                <section id="help">
-
+                <section id="project">
+                    <h2>
+                        <span class="line"><span class="bold">Open source and free</span> to use for (non) commercial applications.</span>
+                        <span class="line">Jitar is developed by a small team and <span class="bold">grows with help from others.</span>.</span>
+                    </h2>
+                    <div class="grow">
+                        <div class="option contribute">
+                            <h3>Contribute</h3>
+                            <p>Help us develop Jitar. Feel free to create or work on issues, improve the docs or <a href="#">give us a star</a>!</p>
+                            <a class="button secondary" href="#" target="_blank">Learn more</a>
+                        </div>
+                        <div class="divider">&nbsp;</div>
+                        <div class="option sponsor">
+                            <h3>Sponsor</h3>
+                            <p>Buy us time to work on Jitar. More time means more new features, faster bug fixes and more!</p>
+                            <a class="button primary" href="#" target="_blank">Learn more</a>
+                        </div>
+                    </div>
                 </section>
 
             </main>
diff --git a/website/src/site.css b/website/src/site.css
index caf851d9..60da527b 100644
--- a/website/src/site.css
+++ b/website/src/site.css
@@ -1,9 +1,11 @@
 @import url('css/vars.css');
 @import url('css/layout.css');
 
+@import url('css/components/buttons.css');
 @import url('css/components/cards.css');
 @import url('css/components/code.css');
 @import url('css/components/explainer.css');
+@import url('css/components/grow.css');
 @import url('css/components/hero.css');
 @import url('css/components/nav.css');
 @import url('css/components/roadmap.css');