Social Proof

Composant de preuve sociale👌

This tailwind example is contributed by Ousmane CISSE, on 23-Oct-2025. Component is made with Tailwind v3.4. It is responsive. similar terms for this example is about me

Progress Bar About us

Author Ousmane CISSE

Tailwind v3.4 807 1

Fork Fullscreen

<div class="md:w-1/2 lg:w-5/12 text-center md:text-left">
                
                <h2 class="text-4xl sm:text-5xl font-extrabold mb-4">
                    Stats that matter
                </h2>
                <p class="text-gray-400 mb-10 text-lg">
                    Our rigorous security and compliance standards are at the heart of all we do. We work tirelessly to protect you and your customers.
                </p>

<div class="space-y-8">
                    
                    <div class="flex items-start md:items-center text-left">
                        <div class="text-indigo-400 mr-4 mt-1 md:mt-0">
                            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8v8m0-8h.01M12 4v.01M12 20v.01M16 12h.01M8 12h.01"></path></svg>
                        </div>
                        <div>
                            <p class="text-3xl font-bold">$76 billion</p>
                            <p class="text-gray-400">24h trading volume on Flowbite exchange</p>
                        </div>
                    </div>

<div class="flex items-start md:items-center text-left">
                        <div class="text-indigo-400 mr-4 mt-1 md:mt-0">
                            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path></svg>
                        </div>
                        <div>
                            <p class="text-3xl font-bold">90%</p>
                            <p class="text-gray-400">of U.S adults have bought from businesses using Flowbite</p>
                        </div>
                    </div>
                    
                    <div class="flex items-start md:items-center text-left">
                        <div class="text-indigo-400 mr-4 mt-1 md:mt-0">
                            <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5s3.332.477 4.5 1.253v13C19.832 18.477 18.246 18 16.5 18s-3.332.477-4.5 1.253"></path></svg>
                        </div>
                        <div>
                            <p class="text-3xl font-bold">135+</p>
                            <p class="text-gray-400">currencies and payment methods supported</p>
                        </div>
                    </div>

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

Related Examples

Portfolio About & Skills

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

1 year ago

2.7k
The Free AI Tools Grid Section (210+ Tools, No Signup)
A responsive and SEO-optimized grid section showcasing over 210 free AI tools. Designed with Tailwind CSS, fully responsive, fast-loading, and built for high user engagement. No sign-up required, privacy-friendly, and optimized for performance and discoverability.https://www.thefreeaitools.com/

Achraf Testq

6 months ago

633
The Free AI Tools Grid Section (210+ Tools, No Signup)
A responsive and SEO-optimized grid section showcasing over 210 free AI tools. Designed with Tailwind CSS, fully responsive, fast-loading, and built for high user engagement. No sign-up required, privacy-friendly, and optimized for performance and discoverability.https://www.thefreeaitools.com/

Hasan AlDoy (McDoy)

6 months ago

489
Progress Bar
A progress bar is a UI element that visually represents the completion status of a task or process. It helps users understand how much of a task has been completed and how much remains. Commonly used in forms, file uploads, loading screens, or multi-step processes, it enhances the user experience by providing clear feedback.

Abhiraj

1 year ago

1.5k
About Us

KULDEEP

1 year ago

1.7k
canvas fully covers
canvas fully covers

ABDESLAMI ACHRAF

1 year ago

5.2k
Responsive About Section with Tailwind CSS
Built a sleek and fully responsive About Section for my portfolio using Tailwind CSS! 🚀 Designed for smooth adaptability across all screen sizes with a modern and minimal aesthetic. Perfect for showcasing skills, experience, and a personal touch!

Abdul Baset Bappy

1 year ago

2k
why choose us (features showcase) example

Erik Hyatt

3 years ago

17.9k
Simple progress bar component

Prajwal Hallale

3 years ago

7.9k
Progress bar - Htmlwind
Simple progress bar

Htmlwind

1 year ago

831
Personal Portfolio Website
Nziza HAMZY 😎! Reka dukore full TailwindCSS Portfolio yuzuye na: Hero Section About Section Projects Section (cards) Contact Form Animations & hover effects Fully responsive for mobile

Code Master(Mfuranziza Dusabe Hamza)

1 year ago

1.6k
Gradient progress bar

Kofi Osei

3 years ago

15.8k