Tailwind Teams

Discover 7 Tailwind Teams available in Loopple

Team Section With Images

Component from Motion Landing Library Builder
<div class="w-full draggable">
    <div class="container flex flex-col mx-auto my-20 gap-14">
      <div class="w-full text-center md:text-start">
        <h2 class="mb-6 text-4xl font-extrabold leading-tight md:text-5xl text-dark-grey-900 font-display">Meet the Exceptional Team</h2>
        <p class="text-lg font-normal md:w-7/12 text-dark-grey-500">
          Our dedicated professionals bring unparalleled expertise and commitment to every endeavor. We believe in the art of innovation, and our passion propels us forward. Experience the excellence that sets us apart.
        </p>
      </div>
      <div class="grid w-full grid-cols-2 gap-6 md:grid-cols-3 lg:grid-cols-4">
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-1.jpeg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">Olivia Baker</h3>
            <p class="text-lg font-bold text-purple-blue-500">Director of Finance</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">Olivia is our financial wizard, meticulously managing our finances, investments, and budgets.</p>
          </div>
        </div>
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-2.jpeg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">Andrew Foster</h3>
            <p class="text-lg font-bold text-purple-blue-500">Senior Product Manager</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">Andrew oversees our product development, turning ideas into market-ready solutions.</p>
          </div>
        </div>
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-3.jpeg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">Jessica Lee</h3>
            <p class="text-lg font-bold text-purple-blue-500">Customer Relations Manager</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">Jessica is our customer champion, ensuring every client interaction is a positive one.</p>
          </div>
        </div>
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-4.jpeg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">Richard Ward</h3>
            <p class="text-lg font-bold text-purple-blue-500">Creative Design Lead</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">Richard is our creative genius, transforming ideas into captivating visuals.</p>
          </div>
        </div>
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-6.jpg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">Michael Chang</h3>
            <p class="text-lg font-bold text-purple-blue-500">Head of Operations</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">Michael is the mastermind behind our efficient operations. He ensures our processes run like a well-oiled machine.</p>
          </div>
        </div>
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-9.jpg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">Sarah Mitchell</h3>
            <p class="text-lg font-bold text-purple-blue-500">Chief Marketing Officer (CMO)</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">Sarah is the creative force behind our brand. Her marketing prowess and strategic thinking drive business growth.</p>
          </div>
        </div>
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-14.jpg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">David Rodriguez</h3>
            <p class="text-lg font-bold text-purple-blue-500">Chief Technology Officer (CTO)</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">David is our tech guru, spearheading innovation and ensuring our products are cutting-edge. </p>
          </div>
        </div>
        <div class="flex flex-col items-start gap-4">
          <div class="w-20 h-20 rounded-full bg-cover bg-center" style="background-image: url('https://raw.githubusercontent.com/Loopple/loopple-public-assets/main/motion-tailwind/img/avatars/avatar-11.jpg')"></div>
          <div class="flex flex-col items-start">
            <h3 class="text-xl font-extrabold leading-normal text-dark-grey-900 font-display">Emily Clarke</h3>
            <p class="text-lg font-bold text-purple-blue-500">Chief Executive Officer (CEO)</p>
          </div>
          <div>
            <p class="text-base font-medium leading-8 text-dark-grey-500">Emily leads our company with a visionary zeal, setting the strategic direction and inspiring our team to achieve greatness.</p>
          </div>
        </div>
      </div>
    </div>
  </div>

Team Section With Large Images

Team Section With Images And Social Links

Team Section With Profile Cards

Teams Section With Big Images And Jobs Card On The Bottom

Teams Section With Text In The Left And Small Circle Images On Right

Teams Section With Text In The Left And Big Profile Images On The Right