diff --git a/site/content/docs/standard/content-styles/animations/index.html b/site/content/docs/standard/content-styles/animations/index.html
index 560ec7c61..64711923a 100644
--- a/site/content/docs/standard/content-styles/animations/index.html
+++ b/site/content/docs/standard/content-styles/animations/index.html
@@ -2115,3 +2115,57 @@ <h2 class="mb-5 text-lg font-bold">List group</h2>
   </section>
   <!--/Section: Examples-->
 </section>
+
+<hr class="mb-5 dark:border-neutral-600" />
+
+<!-- Section: Related resources -->
+<section id="section-related-resources">
+  <!-- Title -->
+  <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
+    Related resources
+  </h2>
+
+  <!-- Resources -->
+  <div class="justify-content-start w-100 my-5 text-start">
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colfocus active and othersors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >ripple effect</a
+    >
+
+    <!-- Main docs -->
+  </div>
+  <!-- Resources -->
+</section>
+<!-- Section: Related resources -->
diff --git a/site/content/docs/standard/content-styles/colors/index.html b/site/content/docs/standard/content-styles/colors/index.html
index f7af074dc..e9ebedfa9 100644
--- a/site/content/docs/standard/content-styles/colors/index.html
+++ b/site/content/docs/standard/content-styles/colors/index.html
@@ -1314,3 +1314,85 @@
   </section>
 </section>
 <!-- Section: Text color -->
+
+<hr class="mb-5 dark:border-neutral-600" />
+
+<!-- Section: Related resources -->
+<section id="section-related-resources">
+  <!-- Title -->
+  <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
+    Related resources
+  </h2>
+
+  <!-- Resources -->
+  <div class="justify-content-start w-100 my-5 text-start">
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >focus active and others</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/masks/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >masks</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hsla-colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hsla colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >ripple effect</a
+    >
+
+    <!-- Main docs -->
+  </div>
+  <!-- Resources -->
+</section>
+<!-- Section: Related resources -->
diff --git a/site/content/docs/standard/content-styles/dividers/index.html b/site/content/docs/standard/content-styles/dividers/index.html
index abc753277..ddc599064 100644
--- a/site/content/docs/standard/content-styles/dividers/index.html
+++ b/site/content/docs/standard/content-styles/dividers/index.html
@@ -635,42 +635,50 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- How to? -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/flexbox-use/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/grid-system/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Use Flexbox In Bootstrap</a
+      >grid system</a
     >
-
-    <!-- Extended docs -->
     <a
-      href="https://mdbootstrap.com/docs/standard/layout/vertical-alignment/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/responsiveness/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Vertical Align</a
+      >responsiveness</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/utilities/vertical-rule/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Vertical Rule</a
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
     >
   </div>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-    >Bootstrap Images</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/content-styles/figures/index.html b/site/content/docs/standard/content-styles/figures/index.html
index 60089558b..502116845 100644
--- a/site/content/docs/standard/content-styles/figures/index.html
+++ b/site/content/docs/standard/content-styles/figures/index.html
@@ -385,66 +385,41 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/textarea/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/fullscreen-background-image/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Textarea</a
+      >fullscreen background image</a
     >
-
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/text-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/text/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center Text In Bootstrap</a
+      >text</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center Image</a
+      >spacing</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/utilities/text/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Text Utilities</a
+      >ripple effect</a
     >
+    <!-- Extended docs -->
 
-    <!-- Main docs -->
-    <a
-      href="https://mdbootstrap.com/docs/standard/content-styles/typography/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Typography</a
-    >
+    <!-- How to? -->
 
-    <a
-      href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Images</a
-    >
+    <!-- Main docs -->
   </div>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-    >Bootstrap Images</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/content-styles/headings/index.html b/site/content/docs/standard/content-styles/headings/index.html
index d08be4d1d..75389bf64 100644
--- a/site/content/docs/standard/content-styles/headings/index.html
+++ b/site/content/docs/standard/content-styles/headings/index.html
@@ -504,39 +504,31 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/textarea/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Textarea</a
+      >flexbox</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/css-text-animations/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/text/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Text Animations</a
+      >text</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/text-responsive/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to make text responsive in Bootstrap</a
+      >spacing</a
     >
+    <!-- Extended docs -->
 
-    <a
-      href="https://mdbootstrap.com/how-to/bootstrap/text-center/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to center text in Bootstrap</a
-    >
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
diff --git a/site/content/docs/standard/content-styles/hover-effects/index.html b/site/content/docs/standard/content-styles/hover-effects/index.html
index 809188acd..9fc81eb8b 100644
--- a/site/content/docs/standard/content-styles/hover-effects/index.html
+++ b/site/content/docs/standard/content-styles/hover-effects/index.html
@@ -689,39 +689,73 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/mega-menu/#section-dropdown-on-hover"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Dropdown on hover</a
+      >colors</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/search-expanding/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Expanding Search Bar</a
+      >icons</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-responsive/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to make Bootstrap image responsive</a
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >focus active and others</a
     >
-
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/masks/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to center image</a
+      >masks</a
     >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hsla-colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hsla colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >ripple effect</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/shadows/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >shadows</a
+    >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -743,13 +777,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/hover-effects/"
-    >Bootstrap Hover effects</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/content-styles/icons/index.html b/site/content/docs/standard/content-styles/icons/index.html
index fff993dcc..02da70f32 100644
--- a/site/content/docs/standard/content-styles/icons/index.html
+++ b/site/content/docs/standard/content-styles/icons/index.html
@@ -1240,12 +1240,78 @@
 
 <hr class="mb-5 dark:border-neutral-600" />
 
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/icons/"
-    >Bootstrap Icons</a
-  >
-  from MDBootstrap.
-</p>
+<!-- Section: Related resources -->
+<section id="section-related-resources">
+  <!-- Title -->
+  <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
+    Related resources
+  </h2>
+
+  <!-- Resources -->
+  <div class="justify-content-start w-100 my-5 text-start">
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar-icons-and-logo/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar icons and logo</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >focus active and others</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
+
+    <!-- Main docs -->
+  </div>
+  <!-- Resources -->
+</section>
+<!-- Section: Related resources -->
diff --git a/site/content/docs/standard/content-styles/images/index.html b/site/content/docs/standard/content-styles/images/index.html
index 5143f19f8..83d89f515 100644
--- a/site/content/docs/standard/content-styles/images/index.html
+++ b/site/content/docs/standard/content-styles/images/index.html
@@ -524,39 +524,87 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/gallery/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Gallery</a
+      >hover state</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/carousel-with-thumbnails/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Carousel Slider with Thumbnails</a
+      >focus active and others</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/fullscreen-background-image/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center Image</a
+      >fullscreen background image</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/arbitrary-values/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >arbitrary values</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/masks/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >masks</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >ripple effect</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/carousel/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >carousel</a
     >
-
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-responsive/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/rounded-corners/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to make image responsive in Bootstrap</a
+      >rounded corners</a
     >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/shadows/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >shadows</a
+    >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -578,13 +626,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-    >Bootstrap Images</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/content-styles/mask/index.html b/site/content/docs/standard/content-styles/mask/index.html
index 6d6ee426d..b03b9b64f 100644
--- a/site/content/docs/standard/content-styles/mask/index.html
+++ b/site/content/docs/standard/content-styles/mask/index.html
@@ -968,47 +968,73 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/gallery/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Gallery</a
+      >colors</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/carousel-with-thumbnails/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Carousel Slider with Thumbnails</a
+      >hover state</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/testimonials/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/fullscreen-background-image/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Testimonials / Reviews</a
+      >fullscreen background image</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/masks/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center Image</a
+      >masks</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hsla-colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hsla colors</a
     >
-
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-responsive/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to make image responsive in Bootstrap</a
+      >ripple effect</a
     >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/carousel/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >carousel</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/rounded-corners/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >rounded corners</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/shadows/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >shadows</a
+    >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -1030,13 +1056,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/masks/"
-    >Bootstrap Masks</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/content-styles/shadows/index.html b/site/content/docs/standard/content-styles/shadows/index.html
index 1c98e53ad..03aedd707 100644
--- a/site/content/docs/standard/content-styles/shadows/index.html
+++ b/site/content/docs/standard/content-styles/shadows/index.html
@@ -635,78 +635,48 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal">
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
-    <a
-      href="https://mdbootstrap.com/learn/mdb-foundations/bootstrap/shadows/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Shadows tutorial</a
-    >
-    <a
-      href="https://mdbootstrap.com/docs/standard/design-blocks/landing-page/newsletter/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Newsletter sections</a
-    >
-
-    <!-- How to? -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/jumbotron/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Jumbotron</a
+      >hover state</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/testimonials/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/masks/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Testimonials / Reviews</a
-    >
-
-    <!-- Main docs -->
-    <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-responsive/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Make Bootstrap Image Responsive</a
+      >masks</a
     >
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/image-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center Image</a
+      >buttons</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/content-styles/images/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/rounded-corners/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Images</a
+      >rounded corners</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/tools/design/shadows/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/shadows/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Shadows Generator</a
+      >shadows</a
     >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
+
+    <!-- Main docs -->
   </div>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/images/"
-    >Bootstrap Images</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/content-styles/typography/index.html b/site/content/docs/standard/content-styles/typography/index.html
index 0afd82548..0fb7ced4f 100644
--- a/site/content/docs/standard/content-styles/typography/index.html
+++ b/site/content/docs/standard/content-styles/typography/index.html
@@ -945,38 +945,31 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/textarea/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Textarea</a
+      >colors</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/css-text-animations/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Text Animations</a
+      >flexbox</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/text-responsive/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/text/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to make text responsive in Bootstrap</a
+      >text</a
     >
+    <!-- Extended docs -->
 
-    <a
-      href="https://mdbootstrap.com/how-to/bootstrap/text-center/"
-      type="button"
-      data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to center text in Bootstrap</a
-    >
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -999,13 +992,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/content-styles/typography/"
-    >Bootstrap Typography</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/bradcrumbs/index.html b/site/content/docs/standard/navigation/bradcrumbs/index.html
index 7cfb2beb8..85c01b835 100644
--- a/site/content/docs/standard/navigation/bradcrumbs/index.html
+++ b/site/content/docs/standard/navigation/bradcrumbs/index.html
@@ -774,37 +774,38 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/side-navbar/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Side Navbar</a
+      >navbar</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/navbar-transparent/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How To Center A Bootstrap Button?</a
+      >flexbox</a
     >
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/navbar-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to center Bootstrap Navbar</a
+      >spacing</a
     >
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/change-navbar-color/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to change Bootstrap Navbar color</a
+      >buttons</a
     >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -834,13 +835,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/breadcrumb/"
-    >Bootstrap Breadcrumbs</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/footer/index.html b/site/content/docs/standard/navigation/footer/index.html
index 6ea64d00b..7cb0f6fa5 100644
--- a/site/content/docs/standard/navigation/footer/index.html
+++ b/site/content/docs/standard/navigation/footer/index.html
@@ -2601,14 +2601,64 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- How to? -->
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/containers/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >containers</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/footer-add/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to add Footer in Bootstrap</a
+      >buttons</a
     >
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -2659,13 +2709,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/footer/"
-    >Bootstrap Footer</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/headers/index.html b/site/content/docs/standard/navigation/headers/index.html
index ea84c8e9b..a7ff062b0 100644
--- a/site/content/docs/standard/navigation/headers/index.html
+++ b/site/content/docs/standard/navigation/headers/index.html
@@ -785,12 +785,100 @@ <h3 class="mb-8 text-3xl font-bold">Subeading</h3>
 </section>
 <!-- Section: Background image -->
 
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/headers/"
-    >Bootstrap Headers</a
-  >
-  from MDBootstrap.
-</p>
+<hr class="mb-5 dark:border-neutral-600" />
+
+<!-- Section: Related resources -->
+<section id="section-related-resources">
+  <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
+    Related resources
+  </h2>
+
+  <!-- Resources -->
+  <div class="justify-content-start w-100 my-5 text-start">
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/fullscreen-background-image/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >fullscreen background image</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/masks/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >masks</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hsla-colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hsla colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/ripple-effect/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >ripple effect</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/carousel/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >carousel</a
+    >
+    <!-- How to? -->
+
+    <!-- Main docs -->
+
+    <!-- Other -->
+  </div>
+  <!-- Resources -->
+</section>
+<!-- Section: Related resources -->
diff --git a/site/content/docs/standard/navigation/mega-menu/index.html b/site/content/docs/standard/navigation/mega-menu/index.html
index 4842427ed..16fa0de29 100644
--- a/site/content/docs/standard/navigation/mega-menu/index.html
+++ b/site/content/docs/standard/navigation/mega-menu/index.html
@@ -3341,28 +3341,78 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/grid-system/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >grid system</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/responsiveness/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >responsiveness</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/mega-menu/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/grid-system/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >BootstrapMega Menu</a
+      >grid system</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/dropdown-multilevel/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Nested Dropdown</a
+      >spacing</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/multiselect/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Multiselect</a
+      >buttons</a
     >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/rounded-corners/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >rounded corners</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/shadows/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >shadows</a
+    >
+    <!-- Extended docs -->
 
     <!-- Main docs -->
     <a
@@ -3383,13 +3433,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/extended/mega-menu/"
-    >Bootstrap Mega menu</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/navbar/index.html b/site/content/docs/standard/navigation/navbar/index.html
index c3850079d..3c3d608ab 100644
--- a/site/content/docs/standard/navigation/navbar/index.html
+++ b/site/content/docs/standard/navigation/navbar/index.html
@@ -1544,58 +1544,80 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/side-navbar/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Side Navbar</a
+      >navbar</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/jumbotron/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/containers/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Jumbotron</a
+      >containers</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/hamburger-menu/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Hamburger Menu</a
+      >colors</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/dropdown-multilevel/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Nested Dropdown</a
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar-icons-and-logo/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar icons and logo</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/navbar-transparent/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/arbitrary-values/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to make Bootstrap Navbar transparent</a
+      >arbitrary values</a
     >
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/navbar-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to center Bootstrap Navbar</a
+      >flexbox</a
     >
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/change-navbar-color/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to change Bootstrap Navbar color</a
+      >spacing</a
     >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -1618,13 +1640,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/navbar/"
-    >Bootstrap Footer</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/offcanvas/index.html b/site/content/docs/standard/navigation/offcanvas/index.html
index 04695f04c..38e97a77d 100644
--- a/site/content/docs/standard/navigation/offcanvas/index.html
+++ b/site/content/docs/standard/navigation/offcanvas/index.html
@@ -980,30 +980,50 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/offcanvas/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Offcanvas</a
+      >navbar</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/sidebar/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Sidebar</a
+      >focus active and others</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
     >
-
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/hamburger-menu/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Hamburger Menu</a
+      >buttons</a
     >
+    <!-- Extended docs -->
 
     <!-- Other -->
     <a
@@ -1017,13 +1037,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/sidenav/"
-    >Bootstrap Sidenav</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/pagination/index.html b/site/content/docs/standard/navigation/pagination/index.html
index 921ec7209..d784a95bf 100644
--- a/site/content/docs/standard/navigation/pagination/index.html
+++ b/site/content/docs/standard/navigation/pagination/index.html
@@ -1825,14 +1825,64 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- How to? -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/flexbox-use/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
       type="button"
       data-te-ripple-init
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-tight text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >How to use flexbox in Bootstrap</a
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/hover-state/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >hover state</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
     >
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -1846,13 +1896,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/pagination/"
-    >Bootstrap Pagination</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/pills/index.html b/site/content/docs/standard/navigation/pills/index.html
index 1be67570f..104870304 100644
--- a/site/content/docs/standard/navigation/pills/index.html
+++ b/site/content/docs/standard/navigation/pills/index.html
@@ -2919,36 +2919,73 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/social-media/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
       type="button"
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium 
-                                uppercase leading-tight text-neutral-700 shadow-md transition duration-150 
-                                ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg 
-                                focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg"
-      >Social Media Icons & Buttons</a
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/square-buttons/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
       type="button"
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium 
-                                uppercase leading-tight text-neutral-700 shadow-md transition duration-150 
-                                ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg 
-                                focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg"
-      >Square Buttons</a
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
     >
-
-    <!-- How to? -->
     <a
-      href="https://mdbootstrap.com/how-to/bootstrap/button-center/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
       type="button"
-      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium 
-                                uppercase leading-tight text-neutral-700 shadow-md transition duration-150 
-                                ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg 
-                                focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg"
-      >How To Center A Bootstrap Button?</a
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >focus active and others</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
     >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/rounded-corners/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >rounded corners</a
+    >
+    <!-- Extended docs -->
+
+    <!-- How to? -->
 
     <!-- Main docs -->
     <a
@@ -2973,13 +3010,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/pills/"
-    >Bootstrap Pills</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/scrollspy/index.html b/site/content/docs/standard/navigation/scrollspy/index.html
index 706f90cf5..43b879ff7 100644
--- a/site/content/docs/standard/navigation/scrollspy/index.html
+++ b/site/content/docs/standard/navigation/scrollspy/index.html
@@ -711,19 +711,29 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/back-to-top/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
       type="button"
+      data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Scroll Back To Top</a
+      >navbar</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/page-transitions/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colfocus-active-and-othersors/"
       type="button"
+      data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Page Transition</a
+      >focus active and others</a
     >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
+    <!-- Extended docs -->
 
     <!-- Other -->
     <a
@@ -736,13 +746,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/scrollspy/"
-    >Bootstrap Scrollspy</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/sidenav/index.html b/site/content/docs/standard/navigation/sidenav/index.html
index a72d98b31..bcfc08c61 100644
--- a/site/content/docs/standard/navigation/sidenav/index.html
+++ b/site/content/docs/standard/navigation/sidenav/index.html
@@ -5042,7 +5042,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:-72px_-572px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:-72px_-572px_!important]"></span>
                         </span>
                         Polski</a
                       >
@@ -5055,7 +5055,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:0px_-1196px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:0px_-1196px_!important]"></span>
                         </span>
                         中文</a
                       >
@@ -5068,7 +5068,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:-36px_-910px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:-36px_-910px_!important]"></span>
                         </span>
                         日本語</a
                       >
@@ -5081,7 +5081,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:0px_-1430px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:0px_-1430px_!important]"></span>
                         </span>
                         Deutsch</a
                       >
@@ -5094,7 +5094,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:0px_-1976px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:0px_-1976px_!important]"></span>
                         </span>
                         Français</a
                       >
@@ -5107,7 +5107,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:-0px_-1742px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:-0px_-1742px_!important]"></span>
                         </span>
                         Español</a
                       >
@@ -5120,7 +5120,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:-72px_-884px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:-72px_-884px_!important]"></span>
                         </span>
                         Русский</a
                       >
@@ -5133,7 +5133,7 @@ <h2 class="mb-2 mt-0 text-[2.8rem] font-medium leading-[1.2]">
                         <span
                           class="relative mr-2 inline-block h-[11px] w-4 overflow-hidden bg-gray-200 leading-[11px] decoration-inherit">
                           <span
-                            class="inline-block h-[11px] w-4 content-[''] [background-position:-72px_-702px_!important] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px]"></span>
+                            class="inline-block h-[11px] w-4 content-[''] [background:url(https://tecdn.b-cdn.net/img/svg/flags.png)_no-repeat_-108px_-1976px] [background-position:-72px_-702px_!important]"></span>
                         </span>
                         Português</a
                       >
@@ -6195,35 +6195,36 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   </h2>
 
   <div class="justify-content-start w-100 my-5 text-start">
-    <!-- Extended docs -->
+    <!-- Tutorials -->
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/side-navbar/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Side Navbar</a
+      >navbar</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/sidebar/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Sidebar</a
+      >icons</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/hamburger-menu/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap hamburger menu</a
+      >spacing</a
     >
     <a
-      href="https://mdbootstrap.com/docs/standard/extended/offcanvas/"
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
       type="button"
       data-te-ripple-init
       class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
-      >Bootstrap Offcanvas</a
+      >buttons</a
     >
+    <!-- Extended docs -->
 
     <!-- Other -->
     <a
@@ -6235,13 +6236,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
     >
   </div>
 </section>
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-500"
-    href="https://mdbootstrap.com/docs/standard/navigation/sidenav/"
-    >Bootstrap Sidenav</a
-  >
-  from MDBootstrap.
-</p>
diff --git a/site/content/docs/standard/navigation/tabs/index.html b/site/content/docs/standard/navigation/tabs/index.html
index 98ec79678..df2fbb508 100644
--- a/site/content/docs/standard/navigation/tabs/index.html
+++ b/site/content/docs/standard/navigation/tabs/index.html
@@ -2804,6 +2804,70 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
 
   <!-- Resources -->
   <div class="justify-content-start w-100 my-5 text-start">
+    <!-- Tutorials -->
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/navbar/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >navbar</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/colors/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >colors</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/icons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >icons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/focus-active-and-others/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >focus active and others</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/dark-mode/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >dark mode</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/flexbox/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >flexbox</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/spacing/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >spacing</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/buttons/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >buttons</a
+    >
+    <a
+      href="https://tailwind-elements.com/learn/te-foundations/tailwind-css/rounded-corners/"
+      type="button"
+      data-te-ripple-init
+      class="my-2 inline-block rounded-full bg-neutral-200 px-6 pb-2 pt-2.5 text-xs font-medium uppercase leading-normal text-neutral-700 shadow-md transition duration-150 ease-in-out hover:bg-neutral-300 hover:shadow-lg focus:bg-neutral-300 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-neutral-400 active:shadow-lg dark:bg-neutral-600 dark:text-neutral-200 dark:hover:bg-neutral-500 dark:focus:bg-neutral-500 dark:active:bg-neutral-400"
+      >rounded corners</a
+    >
     <!-- Main docs -->
     <a
       href="https://tailwind-elements.com/docs/standard/components/button-group/"
@@ -2821,13 +2885,3 @@ <h2 class="mb-5 mt-0 text-3xl font-semibold leading-normal" data-te-spy-item>
   <!-- Resources -->
 </section>
 <!-- Section: Related resources -->
-
-<p>
-  If you are looking for more advanced options, try
-  <a
-    class="text-primary dark:text-primary-400"
-    href="https://mdbootstrap.com/docs/standard/navigation/tabs/"
-    >Bootstrap Tabs</a
-  >
-  from MDBootstrap.
-</p>