HTMLPortfolio

My-portfolio-website — HTML Portfolio Template

By shuhad786

A personal portfolio page recreated from a Figma template using HTML, CSS, and JavaScript, hosted on GitHub Pages under the MIT license.

Explore the design

Compare the page layouts and mobile experience. Open any screenshot for a closer look.

2 previews
Desktop homepage1 / 2
Desktop captureTop of page

Actual screenshot captured by the server browser.

All pages & views 2

Screenshots show visual appearance; interactive behavior may differ.

Recorded 2026-10-11View source

What stands out

A quick read of the recorded project description.

01

Static personal portfolio page recreated from a Figma template

02

Written with HTML, CSS, and JavaScript

03

Online demo provided via GitHub Pages

04

Repository includes a standard MIT license file

05

README documents the basic process of cloning locally and opening in VS Code

Template Details

This repository is a portfolio project completed by the author during their studies at Microverse. The task was to choose a design from a given Figma template (referred to in the README as figma template 2) and reimplement it using HTML, CSS, and JavaScript. The page is published via GitHub Pages and can be accessed directly in a browser.

Based on the README and repository information, the project itself is a static front-end page with no backend or database dependencies. The author lists tools such as Node.js, npm, GitHub, and Visual Studio Code in the README, and mentions using linters on GitHub for code checking, but the repository description and dependency list do not provide a more specific build process or framework versions.

Regarding licensing, the repository contains a standard MIT license file, which permits use, modification, commercial use, and distribution of this version of the code. However, third-party assets such as demo images, fonts, and icons require separate verification of their licenses. The Google Chrome Lighthouse extension mentioned in the README is a local checking tool, not a runtime dependency of the project.

HTMLPortfolio

Is it right for your project?

Use Cases

  • Use as a starter template for a personal portfolio page, replacing text and images
  • Learn how to recreate a static page from a Figma design
  • Reference as an HTML/CSS/JavaScript practice project
  • Deploy to GitHub Pages to showcase personal projects

Suitable For

  • Developers learning front-end fundamentals who need practice with design mockups
  • Anyone needing a simple static portfolio page structure
  • Beginners wanting to understand the GitHub Pages deployment process

Getting started & customization

Use these recorded setup notes alongside the repository instructions for your chosen version.

  1. 1

    Clone the repository locally and open it in VS Code to view and modify the source code.

  2. 2

    The README mentions requirements such as a GitHub account, Node.js, npm, and Git Bash.

  3. 3

    Code checking relies on linter configurations on GitHub; the README does not provide specific commands.

  4. 4

    Third-party assets such as demo images, fonts, and icons must be verified separately under their respective licenses.

Read repository instructions

License & source material

Usage conditions & limitations

Free to use · keep license notice

This entry covers the free version of the public repository under the MIT license; the free scope applies to this version of the code and does not imply that external services or third-party assets are free.

Must comply with when using

  • Permits free use, modification, commercial use, and distribution of this version of the code.
  • When distributing copies or substantial portions of the code, retain the original author's copyright notice and the full MIT license notice.
  • The code is provided as is; warranties and limitations of liability are governed by the original license and applicable law.

Additional costs & items to verify

  • Demo images, fonts, icons, and other third-party assets must be verified under their respective licenses and cannot be judged solely by the code's MIT license.
  • External services such as domains, hosting, databases, payments, or AI may incur additional charges.
View Original Text Basis

Compiled by DeepSeek based on repository license and README ·2026-10-11. Results only cover the materials read; dependencies, images, fonts, and subsequent term changes are subject to their respective original texts.

Project checks & description sources

Template Information

Source platforms
GitHub
Documentation and maintenance reference score
Partly documented · 68 / 100
Technologies
HTML
Website type
Portfolio
How this score is calculated

Our heuristic uses license records (up to 30), a demo link (12), a preview (10), stars (15), recorded maintenance (15), description completeness (8), feature records (5) and classification data (5). It is not a code, security or performance test, or a Google score. A link does not establish tested functionality.

What to verify for this project

Repository update recorded
2022-09-09
Screenshot last checked
2026-10-11

A demo link is listed. Check it with your own content and viewport sizes; its presence does not confirm that forms, authentication or payments work.

The catalog identifies HTML as the primary stack. Check the actual dependency manifest and lockfile for versions and hosting requirements. These notes use recorded metadata, not a code audit or a deployment test.

Use a selection guide →

How this description was prepared

AI-assisted description based on catalog records and repository material. Repository authors are not automatically the reviewers of this description.

Review declaration: [email protected] · 2026-10-13

Inspect the recorded source material

SHA-256: dd962e3b9d5e2ff01f0b014dedd5ad8cee5a0a17a1739058eff9c1c444f348f8

2026-10-11T20:05:27.194Z

Source file / repository
![](https://img.shields.io/badge/Microverse-blueviolet)

# Project Name
My Portfolio

> Description the project.

Created a new project for my portfolio, which is derived from the figma template 2.

## Built With

- Major languages
Html and css and javascript
- Frameworks
NodeJs, Npm
- Technologies used
Github
Visual Studio Code

## Live Demo (if available)

[Live Demo Link](https://shuhad786.github.io/My-portfolio-website/)


## Getting Started

The project is available on github however if you wish to contribute to the project please clone to your local repository.

To get a local copy up and running follow these simple example steps.

Go in the project repository and clone to your local repository in VSCode.

### Prerequisites
Require github account, Google chrome lighthouse extention
### Setup
gitbash, npm framework
### Install
gitbash, nodeJS Frameworks, npm framework, VSCode
### Usage
VSCode and gitbash
### Run tests
linters on github

## Author

👤 **Shuhad Loofer**

- GitHub: [@Shuhad786](https://github.com/Shuhad786) 
- LinkedIn: [shuhad-loofer](www.linkedin.com/in/shuhad-loofer)

## 📝 License

This project is [MIT](./MIT.md) licensed.
Report a correction

Explore similar templates

Compare previews and descriptions within the same stack and category.

simplefolio

simplefolio

Simplefolio is a minimal single-page portfolio template for developers, built with HTML, Bootstrap, SCSS, and Parcel under the MIT license. It includes Hero, About, Projects, Contact, and Footer sections, with content edited in /src/index.html and theme colors controlled by two SCSS variables.

HTML · Portfolio

Freelancer

Freelancer

A bright, single-page Bootstrap portfolio template for freelancers, designers, and small studios. It includes a responsive portfolio grid with modal detail windows and an SB Forms contact form that requires an API token.

HTML · Portfolio

Resume

Resume

A single-page resume and CV template from Start Bootstrap, built on Bootstrap with a fixed sidebar and content sections.

HTML · Portfolio

Creative

Creative

A single-page marketing template by Start Bootstrap for creative agencies and product services, built on Bootstrap with SCSS, featuring a portfolio grid and call-to-action sections. It includes pre-set SB Forms markers for form integration and npm build scripts for source customization.

HTML · Corporate Website

Grayscale

Grayscale

A dark single-page Bootstrap template from Start Bootstrap for photography, events and brand storytelling, with a large hero and clearly separated sections.

HTML · Corporate Website

startbootstrap-stylish-portfolio

startbootstrap-stylish-portfolio

A one-page Bootstrap portfolio theme from Start Bootstrap with multiple content sections and an off-canvas navigation menu. Basic use means editing HTML/CSS under dist and opening index.html; advanced use relies on npm with Pug and SCSS build scripts.

HTML · Portfolio