Bulma Team Components (48)

Framework

UI Library

7-Day Pass

Full Shuffle Editor access for just $10

Great for quick projects and for testing everything Shuffle can do. One-time payment, not a subscription.

New to Shuffle? Try our tools:

Multi-AI Designer Kick off several design directions at once, then build on your favorite. Visual Editor Build from UI components and templates, then customize every detail.

Components

Team from Flaro

Bulma

Flaro

<section class="has-background-white py-24 is-clipped">
    <div class="container px-8">
        <div class="columns">
            <div class="column is-4">
                <div class="is-flex is-flex-direction-column is-justify-content-end p-10 has-background-link" style="height: 100%; border-radius: 20px;">
                    <h3 class="mb-4 is-size-3 has-text-white has-text-weight-bold">Who We Are</h3>
                    <p class="mb-8 has-text-white has-text-weight-medium">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat enim.</p>
                    <div class="">
                        <a href="#" class="button is-white py-4 px-7 has-text-weight-semibold has-background-white" style="border-radius: 10px;" type="button">Learn about us</a>
                    </div>
                </div>
            </div>
            <div class="column is-4">
                <div class="is-relative">
                    <img class="is-cover" style="width: 100%;" src="flaro-assets/images/team/bg.png" alt="">
                    <div class="p-8 is-absolute is-bottom-0 is-left-0" style="backdrop-filter: blur(3px); background-color: rgba(255, 255, 255, 0.1); width: 100%;">
                        <h3 class="mb-1 is-size-3 has-text-weight-semibold has-text-dark">Leslie Alexander</h3>
                        <p class="has-text-grey has-text-weight-medium">Co-Founder, CEO</p>
                    </div>
                </div>
            </div>
            <div class="column is-4">
                <div class="is-relative">
                    <img class="is-cover" style="width: 100%;" src="flaro-assets/images/team/bg2.png" alt="">

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from Zeus

Bulma

Zeus

<section class="is-relative section py-20">
  <img class="is-absolute is-left-0 is-top-0 mt-20 is-hidden-mobile" src="zeus-assets/icons/dots/blue-dot-left-bars.svg" alt="">
  <img class="is-absolute is-right-0 is-top-0 mt-20 is-hidden-mobile" src="zeus-assets/icons/dots/yellow-dot-right-shield.svg" alt="">
  <div class="container">
    <div class="has-mw-3xl mx-auto mb-12 mb-20-desktop has-text-centered">
      <span class="is-size-7"><small class="has-text-info has-text-weight-semibold">What&apos;s new at Shuffle</small></span>
      <h2 class="mt-8 mb-10 title is-2">Lorem ipsum dolor sit amet consectutar domor at elis</h2>
      <p class="is-size-5 has-text-grey-dark">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh, pulvinar vitae aliquet nec, accumsan aliquet orci.</p>
    </div>
    <div class="columns is-multiline">
      <div class="column is-6">
        <div class="box p-6">
          <div class="columns">
            <div class="column is-4 mb-4 mb-0-desktop">
              <img class="image is-fullwidth is-cover is-rounded" style="height: 208px;" src="https://images.unsplash.com/photo-1544717305-f9c88f2897bc?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=1050&amp;q=80" alt="">
            </div>
            <div class="column is-8">
              <h3 class="is-size-4 has-text-weight-semibold">Esther Howard</h3>
              <p class="mb-6 has-text-grey-dark">CEO &amp; Founder</p>
              <p class="has-text-grey-dark">Amet minim mollit non deserunt ullamco est sit aliqua dolor do amet sint. Velit officia consequat duis enim velit mollit. Exercitation veniam consequat sunt nostrud amet.</p>
            </div>
          </div>
        </div>
      </div>

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from Pstls.

Bulma

Pstls.

<section class="section py-24 has-background-white is-clipped">
  <div class="container is-relative">
    <img class="-mt-44 -ml-60 is-absolute is-top-0 is-left-0 image" src="pstls-assets/images/teams/team-1-shadow.png" alt="">
    <div class="is-relative">
      <div class="columns is-multiline is-vcentered">
        <div class="column is-5-tablet">
          <h1 class="title is-size-2-mobile is-size-1-tablet">Team</h1>
        </div>
        <div class="column is-7-tablet">
          <p class="subtitle">If you have ever wondered how to develop your brand, this is the place for you. Take a big step forward in growing your business with this great tool.</p>
        </div>
      </div>
      <div class="mt-20 columns is-multiline">
        <div class="column is-4-desktop is-6-tablet mb-14">
          <div class="has-mw-xs mx-auto px-7">
            <div class="mb-12 is-relative">
              <img class="is-relative image is-fullwidth" src="pstls-assets/images/teams/team-1-photo.jpg" style="z-index: 1" alt="">
              <div class="mt-6 -ml-6 is-absolute is-top-0 is-left-0 has-background-primary-light" style="height: 100%; width: 100%;"></div>
            </div>
            <h5 class="is-size-4 has-text-weight-bold mb-2">Sophie Kowalsky</h5>
            <span class="has-text-grey-light is-size-6">CTO at Shuffle</span>
          </div>
        </div>
        <div class="column is-4-desktop is-6-tablet mb-14">

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from Acros

Bulma

Acros

<section class="section py-16 has-background-white-ter">
  <div class="container">
    <div class="columns">
      <div class="column mb-12">
        <small class="mb-2 is-block is-uppercase has-text-weight-semibold">
          <span>Our</span>
          <span class="has-text-primary">team</span>
        </small>
        <h2 class="title has-mw-md">Lorem ipsum dolor sit amet consectutar domor at elis</h2>
        <p class="subtitle is-size-6 has-mw-md">Contrary to popular belief, Lorem Ipsum is not simply random text. It has roots in a piece of classical Latin</p>
      </div>
      <div class="column is-narrow">
        <div class="columns mb-6 mb-10-tablet">
          <div class="column mb-6 mb-0-tablet">
            <img class="mb-4" src="acros-assets/images/teams/man-small.jpg" style="width: 100%;" alt="">
            <h5 class="title is-size-5 has-leading-3 has-text-weight-medium mb-0">Steven Johson</h5>
            <p class="has-text-grey-light mb-2">CEO &amp; Founder</p>
            <ul class="is-flex">
              <li>
                <a href="#">
                  <img src="acros-assets/icons/teams/twitter.svg" alt="">
                </a>
              </li>
              <li class="mx-2">

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from Bendis

Bulma

Bendis

<section class="is-relative section py-24 has-background-light">
  <img class="is-absolute is-top-0 mt-20" style="left: 50%; transform: translateX(-50%);" src="bendis-assets/images/line-triangle-background.svg" alt="">
  <div class="container">
    <div class="has-mw-2xl mx-auto has-text-centered mb-14">
      <span class="is-block has-text-info has-text-weight-semibold is-uppercase has-letter-space mb-4">Lorem ipsum</span>
      <h1 class="title is-size-3 has-leading-3 has-text-primary">Take quick action that increases your brand&apos;s regular profit.</h1>
      <p class="subtitle is-size-5 has-leading-4 mt-6">If you have ever wondered how to develop your brand, this is the place for you. Take a big step forward in growing your business with this great tool.</p>
    </div>
    <div class="has-mw-lg mx-auto has-mw-none-widescreen">
      <div class="columns is-mobile is-multiline -mb-14">
        <div class="column is-12-mobile is-12-tablet is-6-widescreen mb-14">
          <div class="pr-8-desktop">
            <div class="is-relative has-background-white">
              <div class="has-mw-sm py-12 px-8 px-14-tablet">
                <h3 class="title is-size-4 has-text-weight-semibold has-text-primary mb-2">Peter Prada</h3>
                <span class="is-size-7 is-uppercase has-text-weight-medium has-text-info">CEO &amp; Founder</span>
                <p class="has-text-grey has-leading-6 mt-2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh.</p>
              </div>
              <img class="is-hidden-mobile is-absolute is-top-0 is-right-0 mt-8 -mr-8 image clip-path-left-top" style="width: 260px; height: 235px; object-fit: cover;" src="https://images.unsplash.com/photo-1529068755536-a5ade0dcb4e8?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=801&amp;q=80" alt="">
              <img class="is-hidden-tablet image ml-auto clip-path-left-top" style="width: 260px; height: 235px; object-fit: cover;" src="https://images.unsplash.com/photo-1529068755536-a5ade0dcb4e8?ixlib=rb-1.2.1&amp;ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&amp;auto=format&amp;fit=crop&amp;w=801&amp;q=80" alt="">
            </div>
          </div>
        </div>
        <div class="column is-12-mobile is-12-tablet is-6-widescreen mb-14">

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from Metis

Bulma

Metis

<section class="section">
  <div class="container">
    <div class="columns is-centered">
      <div class="column is-3-desktop">
        <span class="tag is-info is-rounded">Our Team</span>
        <h2 class="mt-4 title is-spaced">Lorem ipsum dolor sit amet consectetur adipisicing</h2>
        <p class="subtitle">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Veritatis quisquam cum aliquam rem.</p>
      </div>
      <div class="column is-6-desktop is-offset-1">
        <div class="p-3 columns is-multiline is-mobile">
          <div class="p-5 column is-6">
            <figure class="mb-4 is-64x64">
              <img class="is-rounded is-fullwidth is-fullheight is-object-cover" src="https://images.unsplash.com/photo-1438761681033-6461ffad8d80?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=500&amp;q=60" alt="">
            </figure>
            <h3 class="title is-size-5">Anne Bailey</h3>
            <p class="subtitle">CEO</p>
          </div>
          <div class="p-5 column is-6">
            <figure class="mb-4 is-64x64">
              <img class="is-rounded is-fullwidth is-fullheight is-object-cover" src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixlib=rb-1.2.1&amp;ixid=eyJhcHBfaWQiOjEyMDd9&amp;auto=format&amp;fit=crop&amp;w=500&amp;q=60" alt="">
            </figure>
            <h3 class="title is-size-5">Julie Brown</h3>
            <p class="subtitle">Head of Development</p>
          </div>

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from Cronos

Bulma

Cronos

<section class="section">
  <div class="container">
    <div class="has-mw-3xl mx-auto mb-12 has-text-centered">
      <span class="tag is-warning is-light">Lorem Ipsum</span>
      <h2 class="mt-6 mb-4 title is-size-2 is-spaced">Lorem ipsum dolor sit amet consectutar</h2>
      <p class="has-mw-2xl subtitle mx-auto">If you have ever wondered how to develop your brand, this is the place for you. Take a big step forward in growing your business with this great tool.</p>
    </div>
    <div class="columns is-multiline">
      <div class="column is-12 is-10-desktop mx-auto">
        <div class="columns is-multiline">
          <div class="column is-12 is-6-desktop mb-8">
            <div>
              <div class="is-vcentered columns is-multiline">
                <div class="column is-12 is-5-desktop mb-4 mb-0-desktop">
                  <img class="image is-fullwidth is-cover" style="height: 223px;" src="https://images.unsplash.com/photo-1450297350677-623de575f31c?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&amp;ixlib=rb-1.2.1&amp;auto=format&amp;fit=crop&amp;w=334&amp;q=80" alt="">
                </div>
                <div class="column is-12 is-7-desktop">
                  <h6 class="title is-size-4 has-text-primary mb-2">Sophie Baialey</h6>
                  <p class="mb-2 has-text-weight-bold">CEO & Founder</p>
                  <p class="subtitle">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh.</p>
                </div>
              </div>
            </div>
          </div>

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from Plain

Bulma

Plain

<section class="section">
  <div class="container">
    <div class="columns mb-6 is-multiline is-centered">
      <div class="column is-8 has-text-centered">
        <span class="has-text-grey-dark">Lorem Ipsum</span>
        <h2 class="mt-2 mb-3 is-size-1 is-size-3-mobile has-text-weight-bold">Lorem ipsum dolor sit amet consectutar domor at elis</h2>
        <p class="subtitle has-text-grey">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh, pulvinar vitae aliquet nec, accumsan aliquet orci.</p>
      </div>
    </div>
    <div class="columns is-multiline is-centered">
      <div class="column is-12 is-10-desktop">
        <div class="columns is-multiline">
          <div class="column is-6 mb-4">
            <div class="box has-background-light">
              <div class="is-vcentered columns is-multiline">
                <div class="column is-5">
                  <img class="image is-fullwidth" style="height: 208px; object-fit: cover;" src="bulma-plain-assets/images/green-400-square.png" alt="">
                </div>
                <div class="column is-7">
                  <h4 class="mb-2 is-size-4 has-text-weight-bold">Danny Bailey</h4>
                  <p class="mb-4 has-text-grey">CEO & Founder</p>
                  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque massa nibh.</p>
                </div>
              </div>

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Team from asitrastudio

Bulma

asitrastudio

<section class="section has-background-white-ter">
  <div class="container">
    <div class="columns is-multiline">
      <div class="column is-4-widescreen is-5-desktop mb-20 mb-0-desktop">
        <div class="has-mw-xs">
          <h1 class="title is-size-2-mobile is-size-1-tablet mb-10" style="letter-spacing: -0.04em;">Meet the team</h1>
          <a class="button is-ghost px-0" href="#" style="height: 38px;">
            <span class="mr-3">See more people</span>
            <svg class="is-rotate-45" width="10" height="11" viewbox="0 0 10 11" fill="none" xmlns="http://www.w3.org/2000/svg">
              <path d="M9 1.5L1 9.5" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
              <path d="M9 8.83571V1.5H1.66429" stroke="black" stroke-width="1.3" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"></path>
            </svg>
          </a>
        </div>
      </div>
      <div class="column is-8-widescreen is-7-desktop">
        <div class="columns is-mobile is-multiline">
          <div class="column is-6-mobile is-6-tablet is-4-desktop mb-12">
            <div>
              <figure class="image is-96x96 mb-6">
                <img class="image" src="asitrastudio-assets/team/team-avatar1.png" alt="">
              </figure>
              <span class="is-block has-text-grey is-size-7 has-text-weight-medium">Executive Chairman</span>
              <span class="title is-size-5-mobile is-size-4-tablet">Jacob Jones</span>

Get the code for 13,400+ components

Create a free account to copy production-ready code from every component in the library.

Free account · No credit card · No password needed

Already have an account? Sign in

Show team members in an attractive and interesting way. Our UI libraries contain many variations of Bulma teams components. Showing the entire team or its key figures builds credibility and attests to the professionalism of the company. It is easier to trust a specific person than a little-known and impersonal organization.

In this mode, you will see versions of the Bulma teams components that are available within our UI libraries. You will also find many other types of components that will be in the same theme. Our UI libraries are prepared by experienced designers and the code underneath them is created by an in-house team of developers.

Get access to all Bulma teams components, code and our editor. Try the demo for free.

Try for Free →

Redirecting to PayPal

Supporting tools

Plans

Bulma Team Components

Framework

UI Library

Components

Team from Flaro

Get the code for 13,400+ components

Team from Zeus

Get the code for 13,400+ components

Team from Pstls.

Get the code for 13,400+ components

Team from Acros

Get the code for 13,400+ components

Team from Bendis

Get the code for 13,400+ components

Team from Metis

Get the code for 13,400+ components

Team from Cronos

Get the code for 13,400+ components

Team from Plain

Get the code for 13,400+ components

Team from asitrastudio

Get the code for 13,400+ components

The easiest way to create beautiful websites

monthly

annual

lifetime

monthly

annual

Create an account

From idea to beautiful design in minutes.

Products

Extensions

UI Components

Company

Support

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

Bulma Team Components

Framework

UI Library

Components

Team from Flaro

Get the code for 13,400+ components

Team from Zeus

Get the code for 13,400+ components

Team from Pstls.

Get the code for 13,400+ components

Team from Acros

Get the code for 13,400+ components

Team from Bendis

Get the code for 13,400+ components

Team from Metis

Get the code for 13,400+ components

Team from Cronos

Get the code for 13,400+ components

Team from Plain

Get the code for 13,400+ components

Team from asitrastudio

Get the code for 13,400+ components

The easiest way to create beautiful websites

monthly

annual

lifetime

monthly

annual

Create an account

From idea to beautiful design in minutes.

Products

Extensions

UI Components

Company

Support