Create A Responsive Multipage Personal Portfolio Website Design Using HTML & CSS / SASS Only



how to make a complete responsive multipage personal portfolio website design using pure html css / sass only step by step.
create a complete responsive multi-pages personal portfolio website design template using pure html css css only for beginners from scratch.

the main feature of this website are:
✅ responsive navbar at bottom effect.
✅ responsive home section using flexbox.
✅ responsive about section using flexbox.
✅ responsive skills section using grid.
✅ responsive education section using flexbox.
✅ responsive portfolio image gallery section using grid.
✅ responsive blogs section using grid.
✅ responsive contact section using flexbox.

* SOURCE CODES *

DOWNLOAD THE SOURCE CODE FROM GOOGLE DRIVE ( INCLUDES IMAGES ):

*How To Download*

Step 1 :- click the google drive link ☝☝☝
Step 2 :- click on download link in the google drive.
Step 3 :- extract the zip file into your desired folder.
Step 4 :- open the folder and then rename each coding files.
Step 5 :- convert each coding files example ( index.txt to index.html ) – ( style.txt to style.css ) – ( script.txt to script.js ).
Step 6 :- open the converted index.html file into your browser.
Step 7 :- open your editor and put your converted into it and then edit it as you like.

font awesome cdn link:

google fonts:

Editor : – visual studio code with Laetus: Dark Vibrant Theme
Browser : – google chrome
UI Tool : – Figma
Images / Video / SVG : –
01 –
02 –
03 –
04 –
05 –
06 –
07 –

New To My Channel Subscribe Now And See More Stuff Like This:

Timestamp:
0:00 demo
2:52 file structure
3:51 navbar section
14:48 home section
23:20 about section
34:15 skills section
39:09 education section
47:48 portfolio section
55:22 blogs section
1:02:29 contact section
1:14:31 final demo

#PersonalPortfolio
#FrontEnd
#MultiPages

27 comments

  1. Thanks for your videos and code, excelente content. Do you have a html portfolio for photographers? Thank you

  2. Hello Mr Web Designer, thank you for the work. How can I download the code for this website?

  3. 👍 great job and I hope to find someone to help me with my WordPress website to be almost looks like this profitional work
    Any one ?

  4. I am new subscriber, thanks for awesome contents,I am web designer creating site using html, css using bootstrap, because of some reasons switch it from 2years but currently starting practice to learning javascript,react and also revision of html, css and after that try to making portfolio,so these content help me lot.

  5. Hi, i try to use your method at the home section, but the image and the content cannot align to the center, the image always at the left side
    .home-container{

    display:flex;

    flex-wrap:wrap;

    align-items:center;

    justify-content:center;

    min-height:100vh;

    }

  6. Sir thank you soo much but sir there is a small problem the btn are not working like about me btn in home isnt working how will I make it alive?

  7. I enjoy your channel. Could you add each subpage to your design for me with top and bottom button, please?

Leave a comment

Your email address will not be published.