Nightfolio - HTML Personal Portfolio Template Latest Version

Documentation:

• Nightfolio Documentation

Nightfolio is availiable in Next.js:

• Nightfolio – Next.js Personal Portfolio Template

All Features

• Attractive Hero Sections
• Theme Section Variants & Flexibility
• GSAP – Animations While Scrolling
• Real Showcase
• Modern & Sleek Design
• 3 Home Section variants
• home-1
• home-2
• home-3
• 2 Clients/Testimonials variants
• cards
• stacked-sticky-cards
• 6 Projects Section variants
• cards
• 3-cards
• stacked-sticky-cards
• stacked-cards
• list
• side-cards
• 2 Services Section variants
• cards
• list
• 2 Contact Section variants
• contact-1
• contact-2
• Dark & Light mode
• <html class="dark">...</html>
  (dark)
• <html class="">...</html>
  (light)
• Parallax
• Visual hierarchy
• Bold Typography
• Perfect For Developers/Designers/UI&UX
• High Performance Both In Desktop & Mobile
• High Contrast
• Constantly Free Updates & New Variants
• 100% SEO
• Open To Suggestions
• Fancy Preloader
• Form Validation & Feedback
• Quick and free of stuffing
• Easy Customization
• No Jquery dependency
• Well Coded & Clean Script without any errors
• Well Documented
• Structured Folders
• Straightforward
• Modern design & UI/UX
• Fully Responsive
• Contact Form Working
• Css variables for Customization

Why HTML?

• Lightweight and Fast
• SEO-Friendly by Nature
• Perfect for Static Portfolios

Files included:

• html files: index.html, home-1.html, home-2.html, home-3.html
• Placeholder images: .png, .jpg
• svg: .svg
• PDF CV file: .pdf
• Environment Variables: file .env
• CSS files: .css
• JS files: .js
• PHP files: .php

How To Edit:

• public/images folder to add images
• src/js/data folder to add sections data files
• .env file to add contact form data

Technologies:

• HTML
• Javascript with GSAP
• tailwind css
• PHP

Libraries:

• gsap
• lenis

Edit Template:

• You need to have text editor program installed on your system. Just
  open files in code writer and edit them easily.

Notes:

• this template not wordpress theme
• node.js is needed only if you want to add new tailwind css classes or
  modify tailwind styles
• images used in demo preview only
• theme variants panel in demo preview only, in downloadable theme
  folder you can change theme variant in /src/js/data/config.js

Help:

• If you have any problems or confusion, questions or ideas,
  suggestions, Please
  Contact Me
  anytime.

Change Log

• ○ v1.0 (11/7/2025) - initial release

• ○ v1.1 (11/28/2025):
  - optimize ticker slider
  - optimize parallax
  - optimize text animation
  

• ○ v1.2 (12/19/2025):
  - enhance side card animation
  - enhance contact-1 design
            

Credits:

• Free fonts
  google fonts
• Free icons from
  fontawesome
• Free 3D service icons images from
  3dicons
• svg icons from
  svgrepo
• hero & about image from
  unsplash