Lumen — Minimal Agency & Portfolio HTML Template

Lumen is a clean, editorial 12-page template for creative studios, agencies, freelancers, and designers who value clarity over noise. Built from scratch with semantic HTML5, a modular SCSS architecture, and dependency-free vanilla JavaScript — no jQuery, no bloat, just fast, elegant code that's a joy to customize.

Whether you're launching a design studio, building a personal portfolio, or showcasing client work, Lumen gives you a complete, refined foundation that loads fast and looks expensive — from homepage to case studies to a working contact form.

Key Features

• 12 fully built pages — not just a homepage, a complete site structure
• Modular SCSS (7-1 architecture) — clean, scalable, well-commented source
• Zero dependencies — pure vanilla JavaScript, no jQuery or frameworks
• Fully responsive — looks great on mobile, tablet, and desktop
• One-click Dark Mode switch — an actual working toggle in the header, not just a CSS class. Preference is remembered across visits
• Fluid typography — scales seamlessly across screen sizes using clamp()
• Easy re-theming — all colors and fonts controlled by CSS custom properties
• Tasteful animations — scroll reveals, animated counters, infinite marquee
• Animated mobile menu — full-screen overlay navigation
• Working FAQ accordions — used on Services and Pricing pages
• Functional contact form UI — front-end validation and submit feedback, ready to wire up to your backend or form service of choice
• Accessibility minded — semantic markup, focus states, respects reduced-motion
• SEO friendly — clean structure plus Open Graph meta tags on every page
• Cross-browser — works in all modern evergreen browsers
• Detailed HTML documentation included
• Deploy-ready — includes a vercel.json for one-click static hosting on Vercel; works identically on Netlify, GitHub Pages, or any static host

Pages Included

What's Included

• Fully commented HTML, SCSS, and JS source files across all 12 pages
• Compiled CSS — expanded and minified versions
• Complete SCSS source (7-1 folder structure)
• npm build scripts for easy recompiling
• Demo imagery
• Detailed HTML documentation
• vercel.json for instant static deployment

Technical Details

• HTML5 and modern CSS (CSS custom properties, clamp, color-mix, backdrop-filter)
• SCSS compiled with Dart Sass using the modern module system
• Vanilla JavaScript with IntersectionObserver for performant scroll effects, plus a dark-mode toggle with localStorage persistence
• No build step required to run — fully static and ready to deploy anywhere

Credits

• Fonts: Fraunces and Manrope (Google Fonts, SIL Open Font License)
• Icons: hand-coded inline SVG

Thank you for checking out Lumen. If you have any questions before purchasing, feel free to reach out — and if you enjoy the template, a rating is always appreciated!