Log In
BASIC-LIBRARY / SECTION / FEATURE

Feature Six

Preview Code
Quick edit
<section class="body-font text-gray-600 max-w-screen-2xl mr-auto ml-auto">
  <div
    class="container pl-5 pr-5 px-5 pt-24 pb-24 py-24 ml-auto mr-auto mx-auto"
  >
    <div
      class="flex items-center ml-auto mr-auto mx-auto border-b pb-10 mb-10 border-gray-200 flex-col sm:flex-row lg:w-3/5"
    >
      <div
        class="inline-flex flex-shrink-0 h-20 w-20 items-center justify-center rounded-full bg-indigo-100 text-indigo-500 sm:w-32 sm:h-32 sm:mr-10"
      >
        <svg
          fill="none"
          stroke="currentColor"
          stroke-linecap="round"
          stroke-linejoin="round"
          stroke-width="2"
          class="w-10 h-10 sm:w-16 sm:h-16"
          viewBox="0 0 24 24"
        >
          <path d="M22 12h-4l-3 9L9 3l-3 9H2"></path>
        </svg>
      </div>
      <div class="flex-grow text-center mt-6 sm:text-left sm:mt-0">
        <h2 class="title-font text-gray-900 text-lg font-medium mb-2">
          Smart Deployment
        </h2>
        <p class="leading-relaxed text-base">
          Automate your release cycles with confidence using integrated CI/CD
          pipelines that streamline your workflow from commit to production.
        </p>
        <a class="inline-flex mt-3 text-indigo-500 items-center">
          <span data-node-handle="base-text" class="inline-block h-auto w-auto">
            Learn More
          </span>
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            class="w-4 h-4 ml-2"
            viewBox="0 0 24 24"
          >
            <path d="M5 12h14M12 5l7 7-7 7"></path>
          </svg>
        </a>
      </div>
    </div>
    <div
      class="flex items-center ml-auto mr-auto mx-auto border-b pb-10 mb-10 border-gray-200 flex-col sm:flex-row lg:w-3/5"
    >
      <div class="flex-grow text-center mt-6 sm:text-left sm:mt-0">
        <h2 class="title-font text-gray-900 text-lg font-medium mb-2">
          Unified Dashboard
        </h2>
        <p class="leading-relaxed text-base">
          Gain a centralized view of all your services, logs, and metrics with
          our customizable dashboard built for real-time visibility.
        </p>
        <a class="inline-flex mt-3 text-indigo-500 items-center">
          <span data-node-handle="base-text" class="inline-block h-auto w-auto">
            Learn More
          </span>
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            class="w-4 h-4 ml-2"
            viewBox="0 0 24 24"
          >
            <path d="M5 12h14M12 5l7 7-7 7"></path>
          </svg>
        </a>
      </div>
      <div
        class="sm:order-none order-first inline-flex flex-shrink-0 h-20 w-20 items-center justify-center rounded-full bg-indigo-100 text-indigo-500 sm:w-32 sm:h-32 sm:ml-10"
      >
        <svg
          fill="none"
          stroke="currentColor"
          stroke-linecap="round"
          stroke-linejoin="round"
          stroke-width="2"
          class="w-10 h-10 sm:w-16 sm:h-16"
          viewBox="0 0 24 24"
        >
          <circle cx="6" cy="6" r="3"></circle>
          <circle cx="6" cy="18" r="3"></circle>
          <path d="M20 4L8.12 15.88M14.47 14.48L20 20M8.12 8.12L12 12"></path>
        </svg>
      </div>
    </div>
    <div
      class="flex items-center ml-auto mr-auto mx-auto flex-col sm:flex-row lg:w-3/5"
    >
      <div
        class="inline-flex flex-shrink-0 h-20 w-20 items-center justify-center rounded-full bg-indigo-100 text-indigo-500 sm:w-32 sm:h-32 sm:mr-10"
      >
        <svg
          fill="none"
          stroke="currentColor"
          stroke-linecap="round"
          stroke-linejoin="round"
          stroke-width="2"
          class="w-10 h-10 sm:w-16 sm:h-16"
          viewBox="0 0 24 24"
        >
          <path d="M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2"></path>
          <circle cx="12" cy="7" r="4"></circle>
        </svg>
      </div>
      <div class="flex-grow text-center mt-6 sm:text-left sm:mt-0">
        <h2 class="title-font text-gray-900 text-lg font-medium mb-2">
          Adaptive Access
        </h2>
        <p class="leading-relaxed text-base">
          Ensure secure, role-based access across your applications with dynamic
          user permissions and seamless single sign-on integration.
        </p>
        <a class="inline-flex mt-3 text-indigo-500 items-center">
          <span data-node-handle="base-text" class="inline-block h-auto w-auto">
            Learn More
          </span>
          <svg
            fill="none"
            stroke="currentColor"
            stroke-linecap="round"
            stroke-linejoin="round"
            stroke-width="2"
            class="w-4 h-4 ml-2"
            viewBox="0 0 24 24"
          >
            <path d="M5 12h14M12 5l7 7-7 7"></path>
          </svg>
        </a>
      </div>
    </div>
    <button
      class="flex ml-auto mr-auto mx-auto mt-20 text-white bg-indigo-500 border-0 pt-2 pb-2 py-2 pl-8 pr-8 px-8 focus:outline-none rounded text-lg hover:bg-indigo-600"
    >
      Button
    </button>
  </div>
</section>
© 2025 tailsections.com. All rights reserved

Don’t Lose Your Edits!

Your changes are saved locally, but they may expire or be lost if you don’t create an account.

Create Account