Home
Ron Hicks
Team section

Team section

with team member's social accounts

This tailwind example is contributed by Ron Hicks, on 17-Jan-2023. Component is made with Tailwind CSS v3. It is responsive.

Team

Author Ron Hicks

11.9k

Fork Fullscreen

<div class="text-center bg-white">
                <img class="w-100" src="https://images.pexels.com/photos/1587014/pexels-photo-1587014.jpeg?auto=compress&amp;cs=tinysrgb&amp;dpr=1&amp;w=500">
                <div class="p-4">
                    <div class="text-md">
                        <a href="#"
                            class="hover:text-indigo-500 text-gray-900 font-semibold transition duration-500 ease-in-out">Mehdi
                            Mohammadi</a>
                        <p class="text-gray-500 uppercase text-sm">Web developer</p>
                    </div>
                    <div class="my-4 flex justify-center items-center">
                        <a href="#">

</div>
                </div>

</div>
            <div class="text-center bg-white">
                <img class="w-100" src="https://images.pexels.com/photos/2897883/pexels-photo-2897883.jpeg?auto=compress&amp;cs=tinysrgb&amp;dpr=1&amp;w=500">
                <div class="p-4">
                    <div class="text-md">
                        <a href="#"
                            class="hover:text-indigo-500 text-gray-900 font-semibold transition duration-500 ease-in-out">Yahya
                            R. Makarim</a>
                        <p class="text-gray-500 uppercase text-sm">president &amp; CEO</p>
                    </div>
                    <div class="my-4 flex justify-center items-center">
                        <a href="#">

</div>
                </div>

</div>
            <div class="text-center bg-white">
                <img class="w-100" src="https://images.pexels.com/photos/3778680/pexels-photo-3778680.jpeg?auto=compress&amp;cs=tinysrgb&amp;dpr=1&amp;w=500">
                <div class="p-4">
                    <div class="text-md">
                        <a href="#"
                            class="hover:text-indigo-500 text-gray-900 font-semibold transition duration-500 ease-in-out">Ahmad
                            Sultani</a>
                        <p class="text-gray-500 uppercase text-sm">Web designer</p>
                    </div>
                    <div class="my-4 flex justify-center items-center">
                        <a href="#">

</div>
                </div>

</div>

</div>
</div>

Related Examples

Team section
responsive project team section

Author:
Ron Hicks

3 years ago

10.3k
Meet the team section

Author:
Sienna

2 years ago

12.7k
Team section with cards

Author:
Ron Hicks

3 years ago

11.2k
Our Team section

Author:
Ron Hicks

3 years ago

9.9k
Tailwind Team section

Author:
Leon Bachmann

3 years ago

10.2k
Team Showcase

Author:
KULDEEP

8 months ago

849
Team Hero Section with Carousel
A clean and responsive hero section featuring an experts carousel built with Tailwind CSS, Swiper, and Alpine.js. The section highlights key experts with contact details and a clear call-to-action, making it ideal for landing pages and service-focused websites.

Author:
Juraj

1 week ago

19
Tailwind flex Hero
Show Image with flex image gallery

Author:
Riaz Uddin Masum

2 weeks ago

62
Team Members Showcase with Portfolio Backlink
Showcase your team's talent with this beautifully designed and responsive team members grid. Each card includes the member's photo, name, role, and social links. A special portfolio backlink is included to highlight your personal contributions as a developer. Supports light and dark modes.

Author:
Abhiraj

1 year ago

1.7k
hero modern
hero modern

Author:
Omer fils ELENGA

4 weeks ago

64
basichtml
this is basic html

Author:
Anonymous

7 months ago

424
DailyDev Card
Card -based card used in the Dailydev Card, this is created to be modified to taste of each user

Author:
Ameth Galarcio

11 months ago

1.8k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components