A cinematic, animation-heavy website template for creative studios and design agencies. Pitch-black canvas, single violet accent, oversized editorial typography, GSAP-ready scroll animations.
Pitch black #050505 + single violet accent #7C5CFC. Every Awwwards SOTY in the studio category uses two colors maximum. When you remove colour variety, typography and spacing become the design. The eye has nowhere to hide.
No hero image. No stock photography. The first thing you see is type — Instrument Serif at 120px. This says 'we're confident enough that we don't need imagery to make an impression.' It also loads instantly and scales perfectly.
Most templates cram sections at 40-60px. Studio Noir uses 140px. Premium design breathes. Monocle, Bloomberg, Wallpaper* — they all use generous whitespace. It communicates confidence without saying a word.
Not a card grid — a vertical list. Each project gets a full-width row with hover-triggered image reveal. The pattern used by Dennis Snellenberg (Awwwards SOTD) and Locomotive (7x Agency of the Year). Scannable, dramatic, mobile-perfect.
The massive letter at 500px behind the hero — at 1.5% opacity. Adds depth and atmosphere without clutter. Creates a layered visual hierarchy that makes the page feel designed, not assembled.
Fixed nav with section anchors. Transparent — doesn't compete with content. Users always know where they are.
Every section has GSAP ScrollTrigger hooks. Characters stagger in, lines draw across, content fades up. Studies show scroll reveals increase time-on-page by 20-40%.
Scrolling text strip communicates capabilities at a glance and creates visual rhythm between hero and content sections.
Creative studios, design agencies, freelance designers, photographers, architects — anyone whose work speaks for itself and needs a canvas that doesn't compete with it.
Source code, documentation, and a design that stands apart from every template marketplace. Built by one person who cares about every pixel.
Or hire me to customise it for your brand.
Next.js + Tailwind + TypeScript. Every page, every component, every animation.
Home, About, Services/Work, Contact — and industry-specific pages. Not just a homepage.
Real scroll-triggered animations on every section. Not CSS transitions — choreographed GSAP motion.
Mobile-first design. Same quality on phone, tablet, and desktop. Tested across breakpoints.
Semantic HTML, proper heading hierarchy, metadata structure, Open Graph tags ready to configure.
Step-by-step docs for changing colours, fonts, content, connecting a CMS, deploying to Vercel.
Why every visual choice was made. Typography rationale, colour reasoning, animation philosophy.
Use on unlimited personal and client projects. Modify however you want. You own your build.
Buy once, receive all future updates. Framework upgrades, bug fixes, new features.
One-time purchase. Lifetime updates. No subscription.
If the template doesn't work as described, email us for a full refund. No questions.