Trending Users

Tailwind Flex Trending Users Card Design

This tailwind example is contributed by $@(\/)(\/)¥, on 22-May-2024. Component is made with Tailwind v3.4. It is responsive. It supports dark mode. similar terms for this example is copy

Card Clone

$$@(\/)(\/)¥ profile image$

Author $@(\/)(\/)¥

Tailwind v3.4 4.7k 5

Fork Fullscreen

<div class="flex flex-col justify-between flex-grow gap-3 px-2">
            <div class="w-full">
                <a href="https://tailwindflex.com/@sammytg7" class="font-semibold md:text-xl text-gray-200 dark:text-black">
                    Samuel Abera
                </a>
                <p class="pt-1 text-sm dark:text-gray-700 two-lines text-gray-300">
                    Bringing web ideas to life! Full-stack developer with 4 years of experience.
                </p>
            </div>

<div class="flex items-center justify-between gap-1">
                <div class="text-sm dark:text-gray-700 text-gray-400">
                    21 components
                </div>
                <div title="Total points this month"
                    class="flex items-center gap-1 px-2 py-1 text-xs dark:text-gray-700 rounded cursor-pointer dark:bg-gray-300/30 bg-gray-700/90 text-gray-300">
                    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                        stroke="currentColor" class="w-4 h-4">
                        <path stroke-linecap="round" stroke-linejoin="round"
                            d="m3.75 13.5 10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75Z"></path>
                    </svg>
                    <span>
                    7.7k
                </span>
                </div>
            </div>

</div>
    </div>
</div>

Related Examples

Twitter tweet clone
Replica of twitter tweet card

Sophia Baker

3 years ago

10.4k
Clone of LinkedIn Questionnaire Card
Clone of LinkedIn Questionnaire Card

$$@(\/)(\/)¥$ $@(\/)(\/)¥

2 years ago

4.1k
Linkedin Add to your feed Clone
Linkedin Add to your feed Clone

$$@(\/)(\/)¥$ $@(\/)(\/)¥

2 years ago

3.8k
Kids E-learning Platform Card
Kids E-learning Platform Card Clone

$$@(\/)(\/)¥$ $@(\/)(\/)¥

1 year ago

2.5k
GitHub For you Feed
GitHub For you Feed Clone

$$@(\/)(\/)¥$ $@(\/)(\/)¥

1 year ago

2.8k
Responsive Tailind css card
the best Responsive Card with image

irahoza daniel

1 year ago

1.2k
Play Music - Reproductor
Multimedia music player, with its respective dark mode

Ameth Galarcio

2 years ago

3.1k
Frontend Template Open Source Code Website
This frontend template is designed for a website that provides software services and open-source code to users. It serves as a clean, modern UI for browsing, searching, and downloading open-source projects. Building with HTML, tailwindcss for CSS ,

Rathanak Phan

1 year ago

2.1k
Website Pricing List Card Component
Website Pricing List Card Component with Package Names: Basic Package → Starter Website Premium Package → Business Website Professional Package → E-Commerce Solution Pricing Structure: Increased prices significantly to reflect web development services one-time payment model FAQ Content.

Ayyamperumal S

1 year ago

1.7k
Floating capsule

Amazing Engineer

1 year ago

1.4k
split bg 2

Anonymous

1 year ago

1k
Ripple Animation
Component is made with Tailwind CSS v3. It is responsive. It supports dark mode. similar terms for this example are loading, loader,Author box, User information,Transitions

Tofayel Islam

10 months ago

794