Tailwind CSS & React Team Blocks - Material Tailwind PRO

Having a team block on the website is an effective way to give the business an accessible face and establish that the company is legit. Check out below our stunning examples of team blocks built with Tailwind CSS and React. Build your user's trust!

Simple Team Block

Showcase the company's employees with this free Tailwind CSS team block featuring photos, names, roles, and linked social media icons.

Two Rows Team Block

Use this team block that comes with a left-placed headline and description plus individual cards on the right side representing each team member.

Dark Team Block with Cards

This dark mode example presents the team members using a grid pattern, which is both neat and efficient, making optimal use of space and facilitating a quick visual scan of the team.

Team Cards Block

Use this dark block example that presents three symmetrically arranged team members using a rounded rectangle card that contains their photo, name, and title.

Dark Grid Layout Team Block

In this example, each card includes the team member's name, their title, and a brief personal quote. The cards are arranged in a grid pattern that is easy to navigate visually.

Team Block with Rounded Profile Images

In this example, the individual member profiles are displayed within rounded square cards. Try it now!

Team Block with Tiles

This example includes a left-aligned header and the team members are represented in individual tiles that are arranged in a two-by-two grid.

Team Sections Example 7

Use this block example to showcase the team members; featuring tagline, headline, text description, members' photographs, role, and social media icons.

Centered Team Block

Use this team block example if you want the users to focus on the members'photographs.

Team Block with Profile Images

In this Tailwind CSS block example, each team member is featured within a card-style profile that includes their photo, name, and job title. The rounded corners of the cards offer a modern and friendly aesthetic.

Team Block with Profile Description

Use this team block example with description for each team member to add personality to the profile.

Simple Card Layout Team Block

Add this team section to your project if you want to feature: a representative section icon, header, description, team members' images, role, and description.

Block with Members Contribution Metrics

Use this example if you want to showcase more info about each team member such as the number of projects completed, hours of work, or availability for support, providing a quantitative measure of each individual's input.

Two Team Members Block

Use this example if you want to present briefly the team members.

Team Block with CTA Button

Try this example of team section if you want to add CTA buttons inside the component.

Minimalist Team Block

Use this example if you want to present briefly the team members.

Four Team Members Block

Use this responsive block example to present your team members by displaying their pictures, names, roles, and social media accounts inside a card component with headline and description.

Sign up for our newsletter

Join our newsletter and get news in your inbox every week! We hate spam too, so no worries about this.

By subscribing, you accept Brevo's Terms of Service and Privacy Policy.