diff --git a/site/layouts/partials/footer/footer.html b/site/layouts/partials/footer/footer.html
index 9c3970695..5dc9efeb1 100644
--- a/site/layouts/partials/footer/footer.html
+++ b/site/layouts/partials/footer/footer.html
@@ -33,222 +33,195 @@
     </div>
     <hr class=" my-12 border-neutral-300 dark:border-neutral-600" />
     <div class="pb-10 text-center md:text-left">
-      <div class="grid-1 grid gap-8 md:grid-cols-2 lg:grid-cols-4">
+      <div class="grid-2 grid gap-10 px-12 md:grid-cols-2 lg:grid-cols-4">
         <div class="">
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/timeline/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Timeline</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/chat/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Chat</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/avatar/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Avatar</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/comments/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Comment box</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/bootstrap-comparison-table/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Pricing table</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/credit-card/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Credit card form</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/video-carousel/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Video gallery</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/weather/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Weather</a
-            >
+          <h3
+            class="mb-2.5 flex items-center justify-center text-xl font-semibold uppercase md:justify-start">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="currentColor"
+              class="mr-3 h-5 w-5">
+              <path
+                d="M12.378 1.602a.75.75 0 00-.756 0L3 6.632l9 5.25 9-5.25-8.622-5.03zM21.75 7.93l-9 5.25v9l8.628-5.032a.75.75 0 00.372-.648V7.93zM11.25 22.18v-9l-9-5.25v8.57a.75.75 0 00.372.648l8.628 5.033z"></path>
+            </svg>
+            Tailwind ELEMENTS
+          </h3>
+          <p>
+            An open-source collection of components, templates and plugins for
+            Tailwind CSS. Easily customizable &amp; optimized for performance.
           </p>
         </div>
-        <div class="">
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/mega-menu/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Mega Menu</a
-            >
-          </p>
-          <p class="mb-[1px]">
+
+        <div class="mx-12">
+          <h4 class="mb-2.5 text-xl font-bold uppercase">Useful Links</h4>
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/login/"
+              href="https://tailwind-elements.com/license/#contactFormLicense"
               class="text-neutral-700 dark:text-neutral-200"
-              >Login</a
+              >Contact Us</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/bootstrap-invoice/"
+              href="https://mdbootstrap.com/services/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Test</a
+              >Services</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/jumbotron/"
+              href="https://tailwind-elements.com/license/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Jumbotron</a
+              >License</a
             >
           </p>
-          <p class="mb-[1px]">
+
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/media-object/"
+              href="https://tailwind-elements.com/press-pack/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Media object</a
+              >Press Pack</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/multiselect/"
+              href="https://mdbgo.com/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Multiselect</a
+              >Free Hosting</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/to-do-list/"
+              href="https://tailwind-elements.com/docs/standard/extended/"
               class="text-neutral-700 dark:text-neutral-200"
-              >To do list</a
+              >Extended Docs</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/bootstrap-address-form//"
+              href="https://material-minimal.com/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Address Form</a
+              >Material Minimal</a
             >
           </p>
         </div>
-        <div class="">
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/news-feed/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >News feed</a
-            >
-          </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/offcanvas/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Offcanvas</a
-            >
-          </p>
-          <p class="mb-[1px]">
+
+        <div class="mx-12">
+          <h4 class="mb-2.5 text-xl font-bold uppercase">Coming Soon</h4>
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/page-transitions/"
+              href="https://tailwind-elements.com/docs/standard/templates/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Page transitions</a
+              >Templates</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/payment-forms/"
+              href="https://tailwind-elements.com/docs/standard/builder/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Payment form</a
+              >Drag &amp; Drop Builder</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/product-cards/"
+              href="https://tailwind-elements.com/angular/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Product card</a
+              >Angular</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/profiles/"
+              href="https://tailwind-elements.com/react/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Profile</a
+              >React</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/sidebar/"
+              href="https://tailwind-elements.com/vue/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Sidebar</a
+              >Vue</a
             >
           </p>
         </div>
-        <div class="">
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/quotes/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Quote</a
-            >
-          </p>
-          <p class="mb-[1px]">
+
+        <div class="ml-5">
+          <h4 class="mb-2.5 text-xl font-bold uppercase">Community</h4>
+
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/shopping-carts/"
+              href="https://github.com/mdbootstrap/Tailwind-Elements/discussions"
               class="text-neutral-700 dark:text-neutral-200"
-              >Shopping cart</a
+              >Discussion</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/side-navbar/"
+              href="https://github.com/mdbootstrap/Tailwind-Elements/issues"
               class="text-neutral-700 dark:text-neutral-200"
-              >Side navbar</a
+              >Issues</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/square-buttons/"
+              href="https://tailwind-elements.com/docs/standard/getting-started/contribute/"
               class="text-neutral-700 dark:text-neutral-200"
-              >Square button</a
+              >Contribute</a
             >
           </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/testimonial-slider/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Testimonial slider</a
+
+          <hr class="my-4 w-40 bg-neutral-100 opacity-100 dark:opacity-50" />
+
+          <p class="mb-1 flex items-center justify-center md:justify-start">
+            <a
+              href="https://github.com/mdbootstrap/Tailwind-Elements"
+              class="flex text-neutral-700 dark:text-neutral-200 md:justify-start">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="mr-2 h-5 w-5"
+                fill="currentColor"
+                viewBox="0 0 24 24">
+                <path
+                  d="M12 0c-6.626 0-12 5.373-12 12 0 5.302 3.438 9.8 8.207 11.387.599.111.793-.261.793-.577v-2.234c-3.338.726-4.033-1.416-4.033-1.416-.546-1.387-1.333-1.756-1.333-1.756-1.089-.745.083-.729.083-.729 1.205.084 1.839 1.237 1.839 1.237 1.07 1.834 2.807 1.304 3.492.997.107-.775.418-1.305.762-1.604-2.665-.305-5.467-1.334-5.467-5.931 0-1.311.469-2.381 1.236-3.221-.124-.303-.535-1.524.117-3.176 0 0 1.008-.322 3.301 1.23.957-.266 1.983-.399 3.003-.404 1.02.005 2.047.138 3.006.404 2.291-1.552 3.297-1.23 3.297-1.23.653 1.653.242 2.874.118 3.176.77.84 1.235 1.911 1.235 3.221 0 4.609-2.807 5.624-5.479 5.921.43.372.823 1.102.823 2.222v3.293c0 .319.192.694.801.576 4.765-1.589 8.199-6.086 8.199-11.386 0-6.627-5.373-12-12-12z"></path>
+              </svg>
+
+              GitHub</a
             >
           </p>
-          <p class="mb-[1px]">
+          <p class="mb-1 flex items-center justify-center md:justify-start">
             <a
-              href="https://mdbootstrap.com/docs/standard/extended/testimonials/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Testimonials</a
+              href="https://twitter.com/ElementTailwind/"
+              class="flex text-neutral-700 dark:text-neutral-200 md:justify-start">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="mr-2 h-5 w-5"
+                fill="currentColor"
+                viewBox="0 0 24 24">
+                <path
+                  d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z"></path>
+              </svg>
+
+              Twitter</a
             >
           </p>
-          <p class="mb-[1px]">
-            <a
-              href="https://mdbootstrap.com/docs/standard/extended/textarea/"
-              class="text-neutral-700 dark:text-neutral-200"
-              >Textarea</a
+
+          <p class="mb-1 flex items-center justify-center md:justify-start">
+            <a
+              href="https://www.youtube.com/channel/UC5CF7mLQZhvx8O5GODZAhdA"
+              class="flex text-neutral-700 dark:text-neutral-200 md:justify-start">
+              <svg
+                xmlns="http://www.w3.org/2000/svg"
+                class="mr-1 h-6 w-6"
+                fill="currentColor"
+                viewBox="2 1 24 24">
+                <path
+                  stroke-linecap="round"
+                  stroke-linejoin="round"
+                  d="M5.25 5.653c0-.856.917-1.398 1.667-.986l11.54 6.348a1.125 1.125 0 010 1.971l-11.54 6.347a1.125 1.125 0 01-1.667-.985V5.653z"></path>
+              </svg>
+
+              YouTube</a
             >
           </p>
         </div>