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 v3.4. It is responsive.

Team

Author Ron Hicks

Tailwind v3.4 12.3k 10

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

Ron Hicks

3 years ago

11.1k
Meet the team section

Sienna

3 years ago

13.4k
Team section with cards

Ron Hicks

3 years ago

11.9k
Our Team section

Ron Hicks

3 years ago

10.5k
Tailwind Team section

Leon Bachmann

3 years ago

10.8k
Timeline
timeline with journey

Abhiraj

1 year ago

1.6k
TRADING COMMODITY
used for buying and selling of raw materials or primary agricultural products. These goods are typically standardized and interchangeable with other goods of the same type, making them suitable for trading on organized exchanges

INGRIDE MUZIRANENGE

1 year ago

842
Team Members

Abdul Baset Bappy

1 year ago

1.2k
Hotel management
dashboard used in hotel management system

Frederick250

1 year ago

3k
Ai clone, chat ui
Chat interface for ai builder, dont toomuch focused on designing responsive

Abhiraj

1 year ago

3k
basichtml
this is basic html

Anonymous

1 year ago

925
Team Showcase

KULDEEP

1 year ago

1.6k