Our features

This tailwind example is contributed by Tanvir Hasan Bappy (Tanvir), on 03-Dec-2024. Component is made with Tailwind v3.4. It is responsive. It supports dark mode.

Other

Author Tanvir Hasan Bappy (Tanvir)

Tailwind v3.4 1.9k 5

Fork Fullscreen

<section class="flex flex-col gap-8 py-12 2xl:py-16 max-w-screen-2xl m-auto w-full px-3 sm:px-8 lg:px-16 xl:px-32">
    <h3 class="text-4xl font-semibold tracking-tight sm:max-md:text-center">Our features</h3>
    <div class="grid w-full grid-flow-row gap-x-0 gap-y-6 sm:max-md:justify-items-center md:grid-cols-2 md:justify-items-start md:gap-6 lg:grid-cols-3">
      <div class="flex max-w-lg flex-col items-start gap-6 overflow-hidden rounded-xl border border-slate-200">
        <div class="flex w-full items-center justify-center bg-[url('https://tailframes.com/images/squares-bg.webp')] bg-cover bg-center bg-no-repeat py-20 2xl:py-28">
          <svg width="128" height="132" viewBox="0 0 128 132" fill="none" xmlns="http://www.w3.org/2000/svg" class="size-32">
            <g filter="url(#filter0_dd_3487_18637)">
              <path
                d="M6.21166 50.2316C2.78106 37.4284 10.379 24.2683 23.1822 20.8377L77.7682 6.21139C90.5714 2.78079 103.731 10.3788 107.162 23.1819L121.788 77.7679C125.219 90.5711 117.621 103.731 104.818 107.162L50.2318 121.788C37.4286 125.219 24.2685 117.621 20.8379 104.818L6.21166 50.2316Z"
                fill="url(#paint0_linear_3487_18637)"></path>
            </g>
            <path fill-rule="evenodd" clip-rule="evenodd"
              d="M79.3211 12.0069L24.7351 26.6332C15.1327 29.2062 9.43426 39.0762 12.0072 48.6786L26.6335 103.265C29.2064 112.867 39.0765 118.565 48.6789 115.993L103.265 101.366C112.867 98.7933 118.566 88.9232 115.993 79.3208L101.367 24.7349C98.7936 15.1325 88.9235 9.43399 79.3211 12.0069ZM23.1822 20.8377C10.379 24.2683 2.78106 37.4284 6.21166 50.2316L20.8379 104.818C24.2685 117.621 37.4286 125.219 50.2318 121.788L104.818 107.162C117.621 103.731 125.219 90.5711 121.788 77.7679L107.162 23.1819C103.731 10.3788 90.5714 2.78079 77.7682 6.21139L23.1822 20.8377Z"
              fill="white"></path>
            <g filter="url(#filter1_dd_3487_18637)">
              <path d="M75.4895 33.922L79.1948 47.7503L62.5168 52.2191L79.2288 65.2224L64.2187 69.2444L69.5391 89.1003L56.1968 92.6754L50.8764 72.8194L64.2187 69.2444L46.5061 56.5092L42.8008 42.6809L75.4895 33.922Z" fill="white"></path>
            </g>
            <defs>
              <filter id="filter0_dd_3487_18637" x="0.387939" y="4.3877" width="127.224" height="127.224" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
                <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="1" operator="erode" in="SourceAlpha" result="effect1_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="4"></feOffset>
                <feGaussianBlur stdDeviation="3"></feGaussianBlur>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="multiply" in2="BackgroundImageFix" result="effect1_dropShadow_3487_18637"></feBlend>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="2" operator="erode" in="SourceAlpha" result="effect2_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="2"></feOffset>
                <feGaussianBlur stdDeviation="2"></feGaussianBlur>
                <feComposite in2="hardAlpha" operator="out"></feComposite>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="normal" in2="effect1_dropShadow_3487_18637" result="effect2_dropShadow_3487_18637"></feBlend>
                <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_3487_18637" result="shape"></feBlend>
              </filter>
              <filter id="filter1_dd_3487_18637" x="37.8008" y="32.922" width="46.428" height="68.7534" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
                <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="1" operator="erode" in="SourceAlpha" result="effect1_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="4"></feOffset>
                <feGaussianBlur stdDeviation="3"></feGaussianBlur>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="multiply" in2="BackgroundImageFix" result="effect1_dropShadow_3487_18637"></feBlend>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="2" operator="erode" in="SourceAlpha" result="effect2_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="2"></feOffset>
                <feGaussianBlur stdDeviation="2"></feGaussianBlur>
                <feComposite in2="hardAlpha" operator="out"></feComposite>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="normal" in2="effect1_dropShadow_3487_18637" result="effect2_dropShadow_3487_18637"></feBlend>
                <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_3487_18637" result="shape"></feBlend>
              </filter>
              <linearGradient id="paint0_linear_3487_18637" x1="96.0511" y1="100.032" x2="72.1628" y2="14.9302" gradientUnits="userSpaceOnUse">
                <stop stop-color="#2050D9"></stop>
                <stop offset="1" stop-color="#6FA1F3"></stop>
              </linearGradient>
            </defs>
          </svg>
        </div>
        <div class="flex flex-col items-start gap-4 px-4 py-6 md:gap-6 md:px-8">
          <p class="text-2xl font-semibold tracking-tight">Headline</p>
          <p class="text-base text-slate-500">We've done it carefully and simply. Combined with the ingredients makes for beautiful landings.</p>
          <button type="button" aria-disabled="false"
            class="group inline-flex items-center justify-center whitespace-nowrap rounded-lg align-middle text-sm font-semibold leading-none transition-all duration-300 ease-in-out disabled:cursor-not-allowed stroke-blue-700 text-blue-700 h-[42px] min-w-[42px] gap-2 disabled:stroke-slate-400 disabled:text-slate-400 hover:stroke-blue-950 hover:text-blue-950 self-end p-0">
            <div>Read More</div>
            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#1D4ED8" stroke-width="1.5" xmlns="http://www.w3.org/2000/svg" class="size-6 stroke-inherit">
              <path d="M11 16L15 12L11 8" stroke-linecap="round" stroke-linejoin="round"></path>
              <circle cx="12" cy="12" r="9"></circle>
            </svg>
          </button>
        </div>
      </div>
      <div class="flex max-w-lg flex-col items-start gap-6 overflow-hidden rounded-xl border border-slate-200">
        <div class="flex w-full items-center justify-center bg-[url('https://tailframes.com/images/squares-bg.webp')] bg-cover bg-center bg-no-repeat py-20 2xl:py-28">
          <svg width="128" height="132" viewBox="0 0 128 132" fill="none" xmlns="http://www.w3.org/2000/svg" class="size-32">
            <g filter="url(#filter0_dd_3487_18637)">
              <path
                d="M6.21166 50.2316C2.78106 37.4284 10.379 24.2683 23.1822 20.8377L77.7682 6.21139C90.5714 2.78079 103.731 10.3788 107.162 23.1819L121.788 77.7679C125.219 90.5711 117.621 103.731 104.818 107.162L50.2318 121.788C37.4286 125.219 24.2685 117.621 20.8379 104.818L6.21166 50.2316Z"
                fill="url(#paint0_linear_3487_18637)"></path>
            </g>
            <path fill-rule="evenodd" clip-rule="evenodd"
              d="M79.3211 12.0069L24.7351 26.6332C15.1327 29.2062 9.43426 39.0762 12.0072 48.6786L26.6335 103.265C29.2064 112.867 39.0765 118.565 48.6789 115.993L103.265 101.366C112.867 98.7933 118.566 88.9232 115.993 79.3208L101.367 24.7349C98.7936 15.1325 88.9235 9.43399 79.3211 12.0069ZM23.1822 20.8377C10.379 24.2683 2.78106 37.4284 6.21166 50.2316L20.8379 104.818C24.2685 117.621 37.4286 125.219 50.2318 121.788L104.818 107.162C117.621 103.731 125.219 90.5711 121.788 77.7679L107.162 23.1819C103.731 10.3788 90.5714 2.78079 77.7682 6.21139L23.1822 20.8377Z"
              fill="white"></path>
            <g filter="url(#filter1_dd_3487_18637)">
              <path d="M75.4895 33.922L79.1948 47.7503L62.5168 52.2191L79.2288 65.2224L64.2187 69.2444L69.5391 89.1003L56.1968 92.6754L50.8764 72.8194L64.2187 69.2444L46.5061 56.5092L42.8008 42.6809L75.4895 33.922Z" fill="white"></path>
            </g>
            <defs>
              <filter id="filter0_dd_3487_18637" x="0.387939" y="4.3877" width="127.224" height="127.224" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
                <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="1" operator="erode" in="SourceAlpha" result="effect1_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="4"></feOffset>
                <feGaussianBlur stdDeviation="3"></feGaussianBlur>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="multiply" in2="BackgroundImageFix" result="effect1_dropShadow_3487_18637"></feBlend>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="2" operator="erode" in="SourceAlpha" result="effect2_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="2"></feOffset>
                <feGaussianBlur stdDeviation="2"></feGaussianBlur>
                <feComposite in2="hardAlpha" operator="out"></feComposite>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="normal" in2="effect1_dropShadow_3487_18637" result="effect2_dropShadow_3487_18637"></feBlend>
                <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_3487_18637" result="shape"></feBlend>
              </filter>
              <filter id="filter1_dd_3487_18637" x="37.8008" y="32.922" width="46.428" height="68.7534" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
                <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="1" operator="erode" in="SourceAlpha" result="effect1_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="4"></feOffset>
                <feGaussianBlur stdDeviation="3"></feGaussianBlur>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="multiply" in2="BackgroundImageFix" result="effect1_dropShadow_3487_18637"></feBlend>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="2" operator="erode" in="SourceAlpha" result="effect2_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="2"></feOffset>
                <feGaussianBlur stdDeviation="2"></feGaussianBlur>
                <feComposite in2="hardAlpha" operator="out"></feComposite>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="normal" in2="effect1_dropShadow_3487_18637" result="effect2_dropShadow_3487_18637"></feBlend>
                <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_3487_18637" result="shape"></feBlend>
              </filter>
              <linearGradient id="paint0_linear_3487_18637" x1="96.0511" y1="100.032" x2="72.1628" y2="14.9302" gradientUnits="userSpaceOnUse">
                <stop stop-color="#2050D9"></stop>
                <stop offset="1" stop-color="#6FA1F3"></stop>
              </linearGradient>
            </defs>
          </svg>
        </div>
        <div class="flex flex-col items-start gap-4 px-4 py-6 md:gap-6 md:px-8">
          <p class="text-2xl font-semibold tracking-tight">Headline</p>
          <p class="text-base text-slate-500">We've done it carefully and simply. Combined with the ingredients makes for&nbsp;beautiful landings.</p>
          <button type="button" aria-disabled="false"
            class="group inline-flex items-center justify-center whitespace-nowrap rounded-lg align-middle text-sm font-semibold leading-none transition-all duration-300 ease-in-out disabled:cursor-not-allowed stroke-blue-700 text-blue-700 h-[42px] min-w-[42px] gap-2 disabled:stroke-slate-400 disabled:text-slate-400 hover:stroke-blue-950 hover:text-blue-950 self-end p-0">
            <div>Read More</div>
            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#1D4ED8" stroke-width="1.5" xmlns="http://www.w3.org/2000/svg" class="size-6 stroke-inherit">
              <path d="M11 16L15 12L11 8" stroke-linecap="round" stroke-linejoin="round"></path>
              <circle cx="12" cy="12" r="9"></circle>
            </svg>
          </button>
        </div>
      </div>
      <div class="flex max-w-lg flex-col items-start gap-6 overflow-hidden rounded-xl border border-slate-200">
        <div class="flex w-full items-center justify-center bg-[url('https://tailframes.com/images/squares-bg.webp')] bg-cover bg-center bg-no-repeat py-20 2xl:py-28">
          <svg width="128" height="132" viewBox="0 0 128 132" fill="none" xmlns="http://www.w3.org/2000/svg" class="size-32">
            <g filter="url(#filter0_dd_3487_18637)">
              <path
                d="M6.21166 50.2316C2.78106 37.4284 10.379 24.2683 23.1822 20.8377L77.7682 6.21139C90.5714 2.78079 103.731 10.3788 107.162 23.1819L121.788 77.7679C125.219 90.5711 117.621 103.731 104.818 107.162L50.2318 121.788C37.4286 125.219 24.2685 117.621 20.8379 104.818L6.21166 50.2316Z"
                fill="url(#paint0_linear_3487_18637)"></path>
            </g>
            <path fill-rule="evenodd" clip-rule="evenodd"
              d="M79.3211 12.0069L24.7351 26.6332C15.1327 29.2062 9.43426 39.0762 12.0072 48.6786L26.6335 103.265C29.2064 112.867 39.0765 118.565 48.6789 115.993L103.265 101.366C112.867 98.7933 118.566 88.9232 115.993 79.3208L101.367 24.7349C98.7936 15.1325 88.9235 9.43399 79.3211 12.0069ZM23.1822 20.8377C10.379 24.2683 2.78106 37.4284 6.21166 50.2316L20.8379 104.818C24.2685 117.621 37.4286 125.219 50.2318 121.788L104.818 107.162C117.621 103.731 125.219 90.5711 121.788 77.7679L107.162 23.1819C103.731 10.3788 90.5714 2.78079 77.7682 6.21139L23.1822 20.8377Z"
              fill="white"></path>
            <g filter="url(#filter1_dd_3487_18637)">
              <path d="M75.4895 33.922L79.1948 47.7503L62.5168 52.2191L79.2288 65.2224L64.2187 69.2444L69.5391 89.1003L56.1968 92.6754L50.8764 72.8194L64.2187 69.2444L46.5061 56.5092L42.8008 42.6809L75.4895 33.922Z" fill="white"></path>
            </g>
            <defs>
              <filter id="filter0_dd_3487_18637" x="0.387939" y="4.3877" width="127.224" height="127.224" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
                <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="1" operator="erode" in="SourceAlpha" result="effect1_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="4"></feOffset>
                <feGaussianBlur stdDeviation="3"></feGaussianBlur>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="multiply" in2="BackgroundImageFix" result="effect1_dropShadow_3487_18637"></feBlend>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="2" operator="erode" in="SourceAlpha" result="effect2_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="2"></feOffset>
                <feGaussianBlur stdDeviation="2"></feGaussianBlur>
                <feComposite in2="hardAlpha" operator="out"></feComposite>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="normal" in2="effect1_dropShadow_3487_18637" result="effect2_dropShadow_3487_18637"></feBlend>
                <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_3487_18637" result="shape"></feBlend>
              </filter>
              <filter id="filter1_dd_3487_18637" x="37.8008" y="32.922" width="46.428" height="68.7534" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
                <feFlood flood-opacity="0" result="BackgroundImageFix"></feFlood>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="1" operator="erode" in="SourceAlpha" result="effect1_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="4"></feOffset>
                <feGaussianBlur stdDeviation="3"></feGaussianBlur>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="multiply" in2="BackgroundImageFix" result="effect1_dropShadow_3487_18637"></feBlend>
                <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"></feColorMatrix>
                <feMorphology radius="2" operator="erode" in="SourceAlpha" result="effect2_dropShadow_3487_18637"></feMorphology>
                <feOffset dy="2"></feOffset>
                <feGaussianBlur stdDeviation="2"></feGaussianBlur>
                <feComposite in2="hardAlpha" operator="out"></feComposite>
                <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.1 0"></feColorMatrix>
                <feBlend mode="normal" in2="effect1_dropShadow_3487_18637" result="effect2_dropShadow_3487_18637"></feBlend>
                <feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_3487_18637" result="shape"></feBlend>
              </filter>
              <linearGradient id="paint0_linear_3487_18637" x1="96.0511" y1="100.032" x2="72.1628" y2="14.9302" gradientUnits="userSpaceOnUse">
                <stop stop-color="#2050D9"></stop>
                <stop offset="1" stop-color="#6FA1F3"></stop>
              </linearGradient>
            </defs>
          </svg>
        </div>
        <div class="flex flex-col items-start gap-4 px-4 py-6 md:gap-6 md:px-8">
          <p class="text-2xl font-semibold tracking-tight">Headline</p>
          <p class="text-base text-slate-500">We've done it carefully and simply. Combined with the ingredients makes for&nbsp;beautiful landings.</p>
          <button type="button" aria-disabled="false"
            class="group inline-flex items-center justify-center whitespace-nowrap rounded-lg align-middle text-sm font-semibold leading-none transition-all duration-300 ease-in-out disabled:cursor-not-allowed stroke-blue-700 text-blue-700 h-[42px] min-w-[42px] gap-2 disabled:stroke-slate-400 disabled:text-slate-400 hover:stroke-blue-950 hover:text-blue-950 self-end p-0">
            <div>Read More</div>
            <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#1D4ED8" stroke-width="1.5" xmlns="http://www.w3.org/2000/svg" class="size-6 stroke-inherit">
              <path d="M11 16L15 12L11 8" stroke-linecap="round" stroke-linejoin="round"></path>
              <circle cx="12" cy="12" r="9"></circle>
            </svg>
          </button>
        </div>
      </div>
    </div>
  </section>

Related Examples

Linear infinite brand scrolling with hover effect
Beautiful lineat brand scrolling partner with hover effect

Walid Ahmad

2 years ago

2.9k
Contact Form Component
A multi-step, responsive contact form with a modern dark-themed design. The form includes four steps: name, email, phone number, and message. It features a side panel with contact information and a sleek, gradient-styled interface using Tailwind CSS.

Muhammad Umair Arshad

1 year ago

1.5k
Fancy underline

Simon Scheffer

3 years ago

13.2k
Upvote downvote buttons

Lucas Martinez

3 years ago

12.5k
About Us Component

KULDEEP

1 year ago

2k
Ripple Animation
Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are loading, loader,Author box, User information,Transitions

Tofayel Islam

8 months ago

792
Customer support chatbox
Floating chatbox

gmer33

3 years ago

12.2k
Verify OTP
Verify OTP

Tanvir Hasan Bappy (Tanvir)

8 months ago

765
nft card
nft card

5upreme505

1 year ago

2k
Maintenance page

Faye

1 year ago

2.7k
free tailwind resume template
free tailwind resume template

Geoffrey Callaghan

2 years ago

4.8k
Giftcard grid

ariaw

1 year ago

1.2k