Home
KULDEEP
Profile Card

Profile Card

Simple and Attractive Profile card in tailwind css

This tailwind example is contributed by KULDEEP, on 26-Jun-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are Author box, User information

Card Profile

Author KULDEEP

834

Fork Fullscreen

<section class="flex justify-center items-center min-h-screen bg-gray-100 p-4">
  
  <div class="max-w-sm w-full bg-white rounded-xl shadow-lg hover:shadow-2xl transition-shadow duration-300 p-6 relative">
    
    <div class="flex justify-center -mt-16 mb-4">
      <img class="w-32 h-32 object-cover rounded-full border-4 border-white shadow-md hover:scale-105 transform transition-transform duration-300" src="https://avatars.githubusercontent.com/u/124576166?v=4" alt="Profile Image">
    </div>
    
    <div class="text-center mb-4">
      <h2 class="text-2xl font-semibold text-gray-800">Kuldeep Prajapati</h2>
      <p class="text-gray-500">Creative Designer</p>
    </div>
    
    <p class="text-center text-gray-600 mb-6 px-4">
      Passionate about crafting beautiful and functional user experiences. Let's build something amazing together.
    </p>

Related Examples

Custom Success Page
This code provides a clean, modern and informative look.

Author:
Alif Bima Pradana

1 month ago

67
User Profile Card
The card features a user's profile picture, name, location, and options for interactions. It has a clean and modern design with rounded edges and icons for user engagement. It also has support for dark mod:

Author:
Prashant

3 years ago

64.5k
Team section
beautiful responsive our team section

Author:
Rajesh Maheshwari

1 year ago

1.5k
Animated Ripple Avatar
Ripple Effect Avatar (Tailwind CSS Component) A visually striking animated component that displays a centered avatar or image surrounded by expanding ripple circles. Built with Tailwind CSS and custom animations, this effect simulates a pulsing or water ripple reaction, drawing attention to the central image. Ideal for user profile sections, hero banners, landing pages, or highlighted features in modern web interfaces. The ripples gradually fade and expand, creating a soft, calming motion that enhances interactivity and depth.

Author:
Code Master(Mfuranziza Dusabe Hamza)

10 months ago

1.3k
sidebar dash
sidebar dash

Author:
Omer fils ELENGA

2 months ago

343
Products Layout
An ecommerce store front product list layout

Author:
Developer Kwame

6 months ago

567
Thankyou Card

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

1 year ago

6k
Product card
sleek and modern product card

Author:
OmKar Mehta

1 year ago

6.6k
grid card

Author:
Md. Tofayel islam

1 year ago

1.9k
Cards
the best tailwind cards with responsive

Author:
irahoza daniel

10 months ago

970
Personal card
A card to show minimal info for staff member

Author:
farid

1 year ago

1.3k
Fancy blog post card

Author:
Mr Robot

3 years ago

12.7k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components