Pure HTML/CSS/vanilla JavaScript, no frameworks, no build step, no dependencies
HTMLPortfolio
portfolio-website — HTML Portfolio Template
By b2kproedit
A single-page developer portfolio template built with pure HTML, CSS, and vanilla JavaScript, featuring light/dark themes, a typing animation, skill bars, and project filtering.
Explore the design
Compare the page layouts and mobile experience. Open any screenshot for a closer look.
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-13View source
What stands out
A quick read of the recorded project description.
Light/dark theme toggle with the choice saved in localStorage
Typing animation for the role title; skill bars and numeric stats animate when scrolled into view
Project grid filterable by All / Web / Apps / Games
Responsive layout with a hamburger menu on mobile
Contact form with inline validation and feedback messages
Template Details
This is a single-page portfolio template for individual developers, built with HTML5, CSS3, and vanilla JavaScript, with no frameworks, build tools, or third-party libraries. The page structure includes hero, about, skills, projects, and contact sections; you can open index.html directly to view it.
The template includes a light/dark theme toggle that remembers the choice via localStorage, a typing animation for the role title, skill bars and numeric stats that animate when scrolled into view, a project grid filterable by All / Web / Apps / Games, a hamburger menu on mobile, and a contact form with inline validation and feedback messages. The README explains that customization is done by replacing the name, role, skill percentages (data-fill attribute), project cards, and the color variables in :root.
Regarding usage limitations: the README lists the contact form as pending integration with an external service such as Formspree or EmailJS, and the current repository version does not include a real submission endpoint; the blog section and project screenshots remain unfinished items on the roadmap. Third-party assets such as demo images, fonts, and icons must be checked separately under their own licenses; the code's MIT license does not cover these assets.
HTMLPortfolio
Is it right for your project?
Use Cases
- A developer needs a personal portfolio page that can be deployed directly to GitHub Pages
- Someone wants to practice front-end interactions such as theme switching, IntersectionObserver, and form validation using vanilla JavaScript
- As a starting point for a personal homepage, to be used for job applications or freelance showcases after replacing the name, skills, and project cards
Suitable For
- Developers who want to quickly set up a single-page personal portfolio
- Those who prefer a static site approach with no frameworks and no build process
- Showcase pages that need basic interactions such as light/dark themes and scroll animations
Getting started & customization
Use these recorded setup notes alongside the repository instructions for your chosen version.
- 1
After cloning the repository, you can open index.html directly by double-clicking it, or preview locally with python3 -m http.server 8000
- 2
To deploy to GitHub Pages, select the main branch root directory in the repository's Settings → Pages
- 3
The contact form requires you to integrate a service endpoint such as Formspree or EmailJS for real submissions
- 4
To customize, replace the name and role in index.html, adjust the data-fill attributes, swap out the project cards, and modify the color variables in the :root of css/style.css
- 5
Third-party assets such as demo images, fonts, and icons must be checked under their own licenses; the MIT license covers only the code
License & source material
Usage conditions & limitations
Free to use · keep license noticeThis entry covers the free version in the public repository under the MIT license; the free scope applies to that version's code and does not imply that external services or third-party assets are free.
Must comply with when using
- You may use, modify, commercialize, and distribute this version's code for free.
- 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
- The README mentions the Formspree form service; real submissions require configuring a service endpoint, and its usage quotas and fees must be checked separately.
- Demo images, fonts, icons, and other third-party assets must be checked under their own licenses; they cannot be judged solely by the code's MIT license.
- External services such as domains, hosting, databases, payments, or AI may incur additional charges.
- The contact form has not yet been connected to a real submission endpoint and is listed as a to-do in the README roadmap: the form can only actually send messages after you integrate an external service such as Formspree or EmailJS.
- The blog section remains an unfinished item in the README roadmap; the current template does not include usable blog functionality.
- Project screenshots remain an unfinished item in the README roadmap; the template currently does not include project screenshot assets.
View Original Text Basis
Permission is hereby granted, free of charge
Original License Text
- [ ] Wire the contact form to a service (Formspree / EmailJS)
Original README
- [ ] Add a real blog section
Original README
https://github.com/b2kproedit/portfolio-website/blob/main/LICENSEhttps://github.com/b2kproedit/portfolio-website/blob/main/README.md- [ ] Add project screenshots
Original README
Compiled by DeepSeek based on repository license and README ·2026-10-13. 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
- More documented · 83 / 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
- 2026-09-11
- Screenshot last checked
- 2026-10-13
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: 275bf8b690cac4a45638aa4fd3887806d11ea43a5ae090d3cfb360a3392e7048
2026-10-13T07:54:24.630Z
Source file / repository# 💻 Portfolio Website — Day 13 A modern, fully responsive **developer portfolio website** built with pure **HTML, CSS and JavaScript** — no frameworks, no build tools, no dependencies.    ## ✨ Features - 🌗 **Dark / light theme** toggle with `localStorage` persistence - ⌨️ **Typing animation** for role headlines - 📊 **Animated skill bars** and **count-up stats** (IntersectionObserver) - 🗂️ **Filterable project grid** (All / Web / Apps / Games) - 📱 Fully **responsive** with a mobile hamburger menu - ✉️ **Contact form** with inline validation + toast notifications - 🧈 Smooth scrolling, scroll-spy navbar, reveal-on-scroll animations - 🚀 100 dependency-free — open `index.html` and go ## 🛠 Tech Stack | Layer | Technology | |--------|------------| | Markup | HTML5 (semantic, accessible) | | Style | CSS3 — custom properties, grid, flexbox, keyframes | | Logic | Vanilla JavaScript (ES6+) | ## 🚀 Getting Started ```bash # clone it git clone https://github.com/<your-username>/portfolio-website.git cd portfolio-website # open it — no install needed # option 1: double-click index.html # option 2: serve it python3 -m http.server 8000 # → http://localhost:8000 ``` ## 🌍 Deploy on GitHub Pages 1. Push this repo to GitHub 2. **Settings → Pages → Deploy from a branch → main / (root)** 3. Your live site: `https://<your-username>.github.io/portfolio-website/` ## 📁 Project Structure ``` portfolio-website/ ├── index.html # Single-page layout (hero, about, skills, projects, contact) ├── css/ │ └── style.css # Theme variables + all styling ├── js/ │ └── main.js # Theme, typing, reveal, counters, filters, form validation ├── LICENSE └── README.md ``` ## 🎨 Customize It - Replace the name/roles in `index.html` (hero + about sections) - Adjust skill percentages via the `data-fill` attributes - Swap the project cards for your own repositories - Colors live in the `:root` block of `css/style.css` ## 🗺 Roadmap - [ ] Add a real blog section - [ ] Wire the contact form to a service (Formspree / EmailJS) - [ ] Add project screenshots ## 📄 License Distributed under the MIT License. See [`LICENSE`](LICENSE) for details. --- Built with ❤️ as part of a *40-day web development challenge*.
Explore similar templates
Compare previews and descriptions within the same stack and category.
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
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
A single-page resume and CV template from Start Bootstrap, built on Bootstrap with a fixed sidebar and content sections.
HTML · Portfolio
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
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
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