gitmyhub

awesome-demo-portfolio

JavaScript ★ 28 updated 14d ago

Modern Portfolio & Interactive Dashboard - Built with HTML/CSS/JS

A ready-to-use personal portfolio template built with plain HTML, CSS, and JavaScript, no frameworks needed, featuring animated sections, interactive charts, a task tracker, and one-click deploy to GitHub Pages.

HTMLCSSJavaScriptCanvas APIGitHub Pagessetup: easycomplexity 1/5

Awesome Demo Portfolio is a single-page personal portfolio website built with plain HTML, CSS, and JavaScript, with no frameworks or external libraries. It is designed as a showcase template with a dark color scheme and neon accent colors, and it includes both a traditional portfolio layout and a small interactive dashboard.

The portfolio side covers the sections you would expect: an animated hero with a typing effect, a project gallery with filterable cards, a skills section with animated progress bars that activate as you scroll, and a contact form with client-side validation. A particle animation plays in the background of the hero and responds to mouse movement.

The dashboard section adds several interactive widgets. There is a live clock showing the current time and date, an animated bar chart for weekly activity data, a donut chart for skills distribution, a simulated weather display, a browser and device information panel, and animated counters for key statistics. A task tracker is also included: it supports creating, editing, and deleting tasks, stores them in the browser's localStorage so they survive page refreshes, and lets you filter by priority.

The whole thing runs directly in a browser with no build step. You can clone it and open the HTML file locally, or serve it with any simple static file server. It is deployed automatically to GitHub Pages via a workflow included in the repository.

The project uses the Canvas API for the particle animation and the charts, the IntersectionObserver API to trigger scroll animations, and Google Fonts for typography. It includes accessibility features such as ARIA attributes, keyboard navigation support, and respect for the user's reduced-motion preference. The license is MIT.

Where it fits