Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

An enhanced, mobile-friendly profile card component

@Hackerbot24

Desktop design screenshot for the Profile card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

Completing this challenge i also enhance it by: Dark Mode Toggle: A floating button in the top-right corner allows users to switch between light and dark modes. The color scheme adjusts dynamically using CSS variables. Interactive Elements: The stat items (Followers, Likes, Photos) now have hover effects and display additional information when interacted with. The information appears in a small popup using GSAP for smooth animations. Background Pattern/Animation: A subtle background animation has been added using GSAP. Small particles float around the background, creating a dynamic and interesting visual effect. Social Media Icons: Social media icons for Twitter, Instagram, and LinkedIn have been added below the stats.

What challenges did you encounter, and how did you overcome them?

Many but i was persistent cause i wanted to make it different.

What specific areas of your project would you like help with?

I am open to learning

Community feedback

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord