Profile Card using HTML and CSS | Beginner Friendly Tutorial

In this video I'll show you how to make this simple, yet elegant looking profile card using only HTML and CSS. This is a beginner friendly tutorial showing you how to create this responsive profile card component.
Feel free to comment down below, if you have any questions!

➽ All resources used and the code for this project can be found on my Github: https://github.com/frontendchef/profile-card

➽ Resources:
VS Code: https://code.visualstudio.com/
Google Font: https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;600;700&display=swap
Font Awesome Brand Icons: https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/brands.min.css
Photo by Michael Dam on Unsplash: https://unsplash.com/@michaeldam
Waveform created with: https://www.shapedivider.app/

Music from Ras-Hop: https://www.youtube.com/c/McRasHop

➽ Timestamps:
00:00 Final Product
00:06 HTML Structure
00:57 CSS Styling
02:49 Outro

#profilecard #html #css

tags:
profile card html css profile card html css responsive profile card design html css profile card html how to make profile card in html and css profile card using html and css profile card how to create a simple profile card