diff --git a/docs/src/components/SubscriptionForm.astro b/docs/src/components/SubscriptionForm.astro
new file mode 100644
index 0000000..8128a54
--- /dev/null
+++ b/docs/src/components/SubscriptionForm.astro
@@ -0,0 +1,104 @@
+---
+import { Card } from '@astrojs/starlight/components';
+---
+
+<!-- SendPulse Subscription Form -->
+<style>.sp-force-hide {
+  display: none;
+}
+
+.sp-form[sp-id="232070"] {
+  display: block;
+  background: #ffffff;
+  padding: 15px;
+  width: 450px;
+  max-width: 100%;
+  border-radius: 8px;
+  border-color: #dddddd;
+  border-style: solid;
+  border-width: 1px;
+  font-family: Arial, "Helvetica Neue", sans-serif;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: auto;
+}
+
+.sp-form[sp-id="232070"] input[type="checkbox"] {
+  display: inline-block;
+  opacity: 1;
+  visibility: visible;
+}
+
+.sp-form[sp-id="232070"] .sp-form-fields-wrapper {
+  margin: 0 auto;
+  width: 420px;
+}
+
+.sp-form[sp-id="232070"] .sp-form-control {
+  background: #ffffff;
+  border-color: #cccccc;
+  border-style: solid;
+  border-width: 1px;
+  font-size: 15px;
+  padding-left: 8.75px;
+  padding-right: 8.75px;
+  border-radius: 4px;
+  height: 35px;
+  width: 100%;
+}
+
+.sp-form[sp-id="232070"] .sp-field label {
+  color: #444444;
+  font-size: 13px;
+  font-style: normal;
+  font-weight: bold;
+}
+
+.sp-form[sp-id="232070"] .sp-button-messengers {
+  border-radius: 4px;
+}
+
+.sp-form[sp-id="232070"] .sp-button {
+  border-radius: 4px;
+  background-color: #0089bf;
+  color: #ffffff;
+  width: auto;
+  font-weight: bold;
+}
+
+.sp-form[sp-id="232070"] .sp-button-container {
+  text-align: left;
+}</style>
+<div class="sp-form-outer sp-force-hide">
+  <div id="sp-form-232070" sp-id="232070" sp-hash="55b64e0209886940495b216b7a9a04ac634ac0dbd809c542ab00e6228035f8c4"
+       sp-lang="en" class="sp-form sp-form-regular sp-form-embed sp-form-horizontal"
+       sp-show-options="%7B%22satellite%22%3Afalse%2C%22maDomain%22%3A%22login.sendpulse.com%22%2C%22formsDomain%22%3A%22forms.sendpulse.com%22%2C%22condition%22%3A%22onEnter%22%2C%22scrollTo%22%3A25%2C%22delay%22%3A10%2C%22repeat%22%3A3%2C%22background%22%3A%22rgba(0%2C%200%2C%200%2C%200.5)%22%2C%22position%22%3A%22bottom-right%22%2C%22animation%22%3A%22%22%2C%22hideOnMobile%22%3Afalse%2C%22submitRedirectUrl%22%3A%22%22%2C%22urlFilter%22%3Afalse%2C%22urlFilterConditions%22%3A%5B%7B%22force%22%3A%22hide%22%2C%22clause%22%3A%22contains%22%2C%22token%22%3A%22%22%7D%5D%2C%22analytics%22%3A%7B%22ga%22%3A%7B%22eventLabel%22%3A%22Subscription_form_angular_challenge%22%2C%22send%22%3Atrue%7D%7D%2C%22utmEnable%22%3Afalse%7D">
+    <div class="sp-form-fields-wrapper">
+      <div class="sp-message">
+        <div></div>
+      </div>
+      <form novalidate="" class="sp-element-container ">
+        <div class="sp-field sp-field-full-width-add sp-field-full-width sp-field-full-width-add-active"
+             sp-id="sp-09e3e6a3-44e8-4ba2-872b-96675cdbb1b4" data->
+          <div style="font-family: inherit; line-height: 1.2;"><p>Get updated when a new Challenge is published</p>
+          </div>
+        </div>
+        <div class="sp-field " sp-id="sp-76dfa588-3af2-4619-b685-835cf8c62ef0"><label class="sp-control-label"><span>Email</span><strong>*</strong></label><input
+          type="email" sp-type="email" name="sform[email]" class="sp-form-control " placeholder="username@gmail.com"
+          sp-tips="%7B%22required%22%3A%22Required%20field%22%2C%22wrong%22%3A%22Wrong%20email%22%7D" autocomplete="on"
+          required="required"></div>
+        <div class="sp-field sp-button-container " sp-id="sp-82642eda-e68f-4b7a-a2b8-69e9d9bb5c99">
+          <button id="sp-82642eda-e68f-4b7a-a2b8-69e9d9bb5c99" class="sp-button">Subscribe</button>
+        </div>
+      </form>
+      <div class="sp-link-wrapper sp-brandname__left"><a class="sp-link " target="_blank"
+                                                         href="https://sendpulse.com/forms-powered-by-sendpulse?from=8570088"><span
+        class="sp-link-img">&nbsp;</span><span translate="FORM.PROVIDED_BY">Provided by SendPulse</span></a></div>
+    </div>
+  </div>
+</div>
+<script type="text/javascript" async="async"
+        src="//web.webformscr.com/apps/fc3/build/default-handler.js?1705909791474"></script>
+<!-- /SendPulse Subscription Form -->
+
+
diff --git a/docs/src/content/docs/test/index.mdx b/docs/src/content/docs/test/index.mdx
new file mode 100644
index 0000000..caa4031
--- /dev/null
+++ b/docs/src/content/docs/test/index.mdx
@@ -0,0 +1,9 @@
+---
+title: Test
+description: Guide to checking out someone else's answer.
+sidebar:
+  order: 3
+---
+import SubscriptionForm from '../../../components/SubscriptionForm.astro'
+
+<SubscriptionForm />