Testimonials Components in Casper library

Testimonials from Casper

<section x-data="{ showContent: false }" class="relative py-12 sm:py-24 bg-body overflow-hidden">
  <div class="relative container mx-auto px-4">
    <div class="flex flex-wrap items-center -mx-4">
      <div class="w-full xl:w-2/5 px-4 mb-20 xl:mb-0">
        <div class="relative max-w-xl xl:max-w-md mx-auto xl:mx-0 md:pb-52">
          <img class="mb-16 animate-spinStar" src="casper-assets/testimonials/blink-star.png" alt="">
          <div class="relative z-10">
            <h2 class="font-heading text-4xl xs:text-5xl sm:text-6xl lg:text-7xl font-medium text-white tracking-tight mb-8">Trusted by more than 100k people</h2>
            <p class="text-xl text-gray-500 leading-relaxed mb-8">Casper is powered by state-of-the-art artificial intelligence and ensuring natural and meaningful interactions</p>
            <a x-show="!showContent" x-on:click.prevent="showContent = true" class="group inline-flex h-14 px-7 items-center justify-center text-base font-medium text-white hover:text-violet-500 bg-transparent hover:bg-white border-2 border-white transition duration-200 rounded-full" href="#">
              <span class="mr-2">SEE ALL TESTIMONIALS</span>
              <span>
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                  <path d="M17.9199 6.62C17.8185 6.37565 17.6243 6.18147 17.3799 6.08C17.2597 6.02876 17.1306 6.00158 16.9999 6H6.99994C6.73472 6 6.48037 6.10536 6.29283 6.29289C6.1053 6.48043 5.99994 6.73478 5.99994 7C5.99994 7.26522 6.1053 7.51957 6.29283 7.70711C6.48037 7.89464 6.73472 8 6.99994 8H14.5899L6.28994 16.29C6.19621 16.383 6.12182 16.4936 6.07105 16.6154C6.02028 16.7373 5.99414 16.868 5.99414 17C5.99414 17.132 6.02028 17.2627 6.07105 17.3846C6.12182 17.5064 6.19621 17.617 6.28994 17.71C6.3829 17.8037 6.4935 17.8781 6.61536 17.9289C6.73722 17.9797 6.86793 18.0058 6.99994 18.0058C7.13195 18.0058 7.26266 17.9797 7.38452 17.9289C7.50638 17.8781 7.61698 17.8037 7.70994 17.71L15.9999 9.41V17C15.9999 17.2652 16.1053 17.5196 16.2928 17.7071C16.4804 17.8946 16.7347 18 16.9999 18C17.2652 18 17.5195 17.8946 17.707 17.7071C17.8946 17.5196 17.9999 17.2652 17.9999 17V7C17.9984 6.86932 17.9712 6.74022 17.9199 6.62Z" fill="currentColor"></path>
                </svg>
              </span>
            </a>
          </div>
          <img class="block md:absolute bottom-0 right-0 md:-mr-40" src="casper-assets/testimonials/robot-side.png" alt="">
        </div>
      </div>
      <div class="relative w-full xl:w-3/5 px-4">
        <div class="absolute top-0 right-0 w-160 h-160 -mr-10 bg-gradient-to-t from-purple-700 to-darkBlue-900 rounded-full filter blur-4xl"></div>
        <div class="relative max-w-2xl mx-auto xl:mr-0">
          <div class="hidden md:block absolute bottom-0 left-0 md:ml-20 w-full md:max-w-xl h-40 bg-gradient-to-t from-darkBlue-900 to-transparent"></div>
          <div class="md:max-w-xl pl-8 pr-14 py-6 mb-8 md:h-40 rounded-3xl shadow-box-violet overflow-hidden bg-white bg-opacity-10">
            <div class="flex items-start">
              <img class="flex-shrink-0 block w-14 h-14 rounded-full" src="casper-assets/testimonials/avatar-2.png" alt="">
              <div class="ml-5">
                <div class="md:flex mb-3 items-center justify-between">
                  <div>
                    <span class="block text-xl text-white font-medium mb-1">Sulis Azalea</span>
                    <span class="block text-sm text-gray-500">CEO of Sans Design</span>
                  </div>
                  <div class="flex items-center">
                    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path>
                    </svg>
                    <span class="ml-2.5 text-xl font-medium text-white">5</span>
                  </div>
                </div>
                <p class="text-lg text-white">It was a pleasure working with the Saturn. They understood the brief correctly</p>
              </div>
            </div>
          </div>
          <div class="relative md:max-w-xl md:-ml-20 pl-8 pr-14 py-6 mb-8 md:h-40 rounded-3xl overflow-hidden">
            <img class="absolute top-0 left-0 w-full h-full" src="casper-assets/testimonials/bg-gradient-color.png" alt="">
            <div class="relative flex items-start">
              <img class="flex-shrink-0 block w-14 h-14 rounded-full" src="casper-assets/testimonials/avatar-1.png" alt="">
              <div class="ml-5">
                <div class="md:flex mb-3 items-center justify-between">
                  <div>
                    <span class="block text-xl text-black font-medium mb-1">Beby Jovanca</span>
                    <span class="block text-sm text-gray-600">CEO of Coca Soft</span>
                  </div>
                  <div class="flex items-center">
                    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path>
                    </svg>
                    <span class="ml-2.5 text-xl font-medium text-black">5</span>
                  </div>
                </div>
                <p class="text-lg text-black">It was a pleasure working with the Saturn. They understood the brief correctly</p>
              </div>
            </div>
          </div>
          <div class="md:max-w-xl pl-8 pr-14 py-6 mb-8 md:h-40 rounded-3xl shadow-box-violet overflow-hidden bg-white bg-opacity-10">
            <div class="flex items-start">
              <img class="flex-shrink-0 block w-14 h-14 rounded-full" src="casper-assets/testimonials/avatar-2.png" alt="">
              <div class="ml-5">
                <div class="md:flex mb-3 items-center justify-between">
                  <div>
                    <span class="block text-xl text-white font-medium mb-1">Jenifer Donn</span>
                    <span class="block text-sm text-gray-500">CEO of Eco Tech</span>
                  </div>
                  <div class="flex items-center">
                    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path>
                    </svg>
                    <span class="ml-2.5 text-xl font-medium text-white">5</span>
                  </div>
                </div>
                <p class="text-lg text-white">It was a pleasure working with the Saturn. They understood the brief correctly</p>
              </div>
            </div>
          </div>
          <div class="md:max-w-xl md:ml-20 pl-8 pr-14 py-6 md:h-40 rounded-3xl shadow-box-violet overflow-hidden bg-white bg-opacity-10">
            <div class="flex items-start">
              <img class="flex-shrink-0 block w-14 h-14 rounded-full" src="casper-assets/testimonials/avatar-1.png" alt="">
              <div class="ml-5">
                <div class="md:flex mb-3 items-center justify-between">
                  <div>
                    <span class="block text-xl text-white font-medium mb-1">Sulis Azalea</span>
                    <span class="block text-sm text-gray-500">CEO of Sans Design</span>
                  </div>
                  <div class="flex items-center">
                    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                      <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path>
                    </svg>
                    <span class="ml-2.5 text-xl font-medium text-white">5</span>
                  </div>
                </div>
                <p class="text-lg text-white">It was a pleasure working with the Saturn. They understood the brief correctly</p>
              </div>
            </div>
          </div>
          <div x-show="showContent" class="visibility-item mt-8">
            <div class="md:max-w-xl md:ml-20 pl-8 pr-14 py-6 md:h-40 rounded-3xl shadow-box-violet overflow-hidden bg-white bg-opacity-10">
              <div class="flex items-start">
                <img class="flex-shrink-0 block w-14 h-14 rounded-full" src="casper-assets/testimonials/avatar-1.png" alt="">
                <div class="ml-5">
                  <div class="md:flex mb-3 items-center justify-between">
                    <div>
                      <span class="block text-xl text-white font-medium mb-1">Emma Turner</span>
                      <span class="block text-sm text-gray-500">CEO of Bold Design</span>
                    </div>
                    <div class="flex items-center">
                      <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                        <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path>
                      </svg>
                      <span class="ml-2.5 text-xl font-medium text-white">5</span>
                    </div>
                  </div>
                  <p class="text-lg text-white">It was a pleasure working with the Saturn. They understood the brief correctly</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>

Testimonials from Casper

<section class="py-12 py-lg-24 bg-dark-light position-relative overflow-hidden"><img class="position-absolute top-0 end-0" src="casper-assets/blur/blur-circle-violet.svg" alt=""/> <div class="container position-relative"> <div class="row align-items-start"> <div class="col-12 col-lg-5 mb-14 mb-lg-0 position-relative"><img class="img-fluid d-block mb-14 animate-spinStar" src="casper-assets/testimonials/blink-star.png" alt=""/> <div class="mw-lg mx-auto mx-lg-0"> <h2 class="font-heading fw-medium text-white mb-8">Trusted by more than 100k people</h2> <p class="display-5 lh-lg text-light-light mb-8">Casper is powered by state-of-the-art artificial intelligence and ensuring natural and meaningful interactions</p><a class="btn btn-outline-light" href="#"><span class="me-2">SEE ALL TESTIMONIALS</span> <svg width="24" height="24" viewbox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <path d="M17.9199 6.62C17.8185 6.37565 17.6243 6.18147 17.3799 6.08C17.2597 6.02876 17.1306 6.00158 16.9999 6H6.99994C6.73472 6 6.48037 6.10536 6.29283 6.29289C6.1053 6.48043 5.99994 6.73478 5.99994 7C5.99994 7.26522 6.1053 7.51957 6.29283 7.70711C6.48037 7.89464 6.73472 8 6.99994 8H14.5899L6.28994 16.29C6.19621 16.383 6.12182 16.4936 6.07105 16.6154C6.02028 16.7373 5.99414 16.868 5.99414 17C5.99414 17.132 6.02028 17.2627 6.07105 17.3846C6.12182 17.5064 6.19621 17.617 6.28994 17.71C6.3829 17.8037 6.4935 17.8781 6.61536 17.9289C6.73722 17.9797 6.86793 18.0058 6.99994 18.0058C7.13195 18.0058 7.26266 17.9797 7.38452 17.9289C7.50638 17.8781 7.61698 17.8037 7.70994 17.71L15.9999 9.41V17C15.9999 17.2652 16.1053 17.5196 16.2928 17.7071C16.4804 17.8946 16.7347 18 16.9999 18C17.2652 18 17.5195 17.8946 17.707 17.7071C17.8946 17.5196 17.9999 17.2652 17.9999 17V7C17.9984 6.86932 17.9712 6.74022 17.9199 6.62Z" fill="currentColor"></path> </svg></a> </div> </div> <div class="col-12 col-lg-7"> <div class="mw-2xl mx-auto position-relative"> <div class="position-relative mw-xl mx-auto py-5 px-7 mb-8"><img class="position-absolute top-0 start-0 w-100 h-100" src="casper-assets/blur/box-testimonials-bg-blur.png" alt=""/> <div class="position-relative d-flex align-items-start"><img class="img-fluid" src="casper-assets/testimonials/avatar-2.png" alt=""/> <div class="ms-5"> <div class="d-flex pt-1 mb-3 lign-items-center w-100"> <div><span class="d-block display-5 fw-medium text-white">Sulis Azalea</span><span class="small text-secondary">CEO of Sans Design</span></div> <div class="d-inline-flex ms-auto"> <svg width="20" height="20" viewbox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path> </svg><span class="ms-2 display-5 text-white fw-medium">5</span> </div> </div> <p class="fs-6 text-white">It was a pleasure working with the Saturn. They understood the brief correctly</p> </div> </div> </div> <div class="position-relative mw-xl py-5 px-7 mb-8"><img class="position-absolute top-0 start-0 w-100 h-100" src="casper-assets/testimonials/bg-gradient-color.png" alt=""/> <div class="position-relative d-sm-flex align-items-start"><img class="img-fluid" src="casper-assets/testimonials/avatar-2.png" alt=""/> <div class="ms-5"> <div class="d-flex pt-1 mb-3 lign-items-center w-100"> <div><span class="d-block display-5 fw-medium">Sulis Azalea</span><span class="small text-secondary">CEO of Sans Design</span></div> <div class="d-inline-flex ms-auto"> <svg width="20" height="20" viewbox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path> </svg><span class="ms-2 display-5 fw-medium">5</span> </div> </div> <p class="fs-6">It was a pleasure working with the Saturn. They understood the brief correctly</p> </div> </div> </div> <div class="position-relative mw-xl mx-auto py-5 px-7 mb-8"><img class="position-absolute top-0 start-0 w-100 h-100" src="casper-assets/blur/box-testimonials-bg-blur.png" alt=""/> <div class="position-relative d-flex align-items-start"><img class="img-fluid" src="casper-assets/testimonials/avatar-3.png" alt=""/> <div class="ms-5"> <div class="d-flex pt-1 mb-3 lign-items-center w-100"> <div><span class="d-block display-5 fw-medium text-white">Jenifer Donn</span><span class="small text-secondary">CEO of Sans Design</span></div> <div class="d-inline-flex ms-auto"> <svg width="20" height="20" viewbox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path> </svg><span class="ms-2 display-5 text-white fw-medium">5</span> </div> </div> <p class="fs-6 text-white">It was a pleasure working with the Saturn. They understood the brief correctly</p> </div> </div> </div> <div class="position-relative mw-xl ms-auto py-5 px-7 mb-8"><img class="position-absolute top-0 start-0 w-100 h-100" src="casper-assets/blur/box-testimonials-bg-blur.png" alt=""/> <div class="position-relative d-flex align-items-start"><img class="img-fluid" src="casper-assets/testimonials/avatar-4.png" alt=""/> <div class="ms-5"> <div class="d-flex pt-1 mb-3 lign-items-center w-100"> <div><span class="d-block display-5 fw-medium text-white">Sulis Azalea</span><span class="small text-secondary">CEO of Sans Design</span></div> <div class="d-inline-flex ms-auto"> <svg width="20" height="20" viewbox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"> <path fill-rule="evenodd" clip-rule="evenodd" d="M11.227 0.796478L13.2574 5.09148C13.4564 5.51312 13.8405 5.8055 14.2859 5.87316L18.8282 6.56543C19.9504 6.73699 20.397 8.17711 19.5848 9.00228L16.3002 12.344C15.9774 12.6727 15.8305 13.1451 15.9068 13.609L16.682 18.3268C16.8729 19.4939 15.6997 20.3843 14.6967 19.8322L10.6369 17.6032C10.2389 17.3845 9.76225 17.3845 9.3631 17.6032L5.30334 19.8322C4.30026 20.3843 3.1271 19.4939 3.31916 18.3268L4.09316 13.609C4.16952 13.1451 4.02259 12.6727 3.6998 12.344L0.4152 9.00228C-0.396983 8.17711 0.0496019 6.73699 1.17185 6.56543L5.71406 5.87316C6.15949 5.8055 6.54475 5.51312 6.74375 5.09148L8.77305 0.796478C9.27517 -0.265493 10.7248 -0.265493 11.227 0.796478Z" fill="#FFD33C"></path> </svg><span class="ms-2 display-5 text-white fw-medium">5</span> </div> </div> <p class="fs-6 text-white">It was a pleasure working with the Saturn. They understood the brief correctly</p> </div> </div> </div> <div class="position-absolute bottom-0 start-0 w-100 py-28" style="background: linear-gradient(180deg, rgba(22, 25, 43, 0.00) 0%, #16192B 100%);"></div> </div> </div> </div> </div> </section>

Testimonials Components by Shuffle

Choose from 16 variations of Testimonials UI components. Presented here are variants available in Casper library.

You will also find many other types of components in Shuffle Editor that will be in the same style. Each library has been designed by a professional designer and coded by our team of developers.

Get access to all Testimonials UI components, code and our visual editor. Try the demo for free!

Redirecting to PayPal

Supporting tools

Plans

Testimonials Components in Casper library

Framework

UI Library

Components

Testimonials from Casper

Testimonials from Casper

Testimonials Components by Shuffle

The easiest way to create beautiful websites

How many people?

monthly

annual

lifetime

Create an account

From idea to live website in minutes.

Why the Lifetime License price is changing

New in your Lifetime License

AI Agent

Multi-AI Designer

Make it yours with AI

Sign in to create with AI

Add images & videos

How it works

Products

UI Components

Extensions

Support

Company

Redirecting to PayPal

Shuffle's Editors

Supporting tools

Plans

Shuffle’s design systems

Most popular ui libraries

Flex

Zanrly

Saturn

Flaro

Gradia

Basko

Artemis

Vendia

Testimonials Components in Casper library

Framework

UI Library

Components

Testimonials from Casper

Testimonials from Casper

Testimonials Components by Shuffle

The easiest way to create beautiful websites

How many people?

monthly

annual

lifetime

Create an account

From idea to live website in minutes.

Products

UI Components

Extensions

Support

Company