Showcase — Curated Interior Design Landing Page Template

Folio is a single-page interior design portfolio landing page built on an asymmetric 60/40 grid. It pairs editorial case study storytelling with a lead-generation flow, guiding potential clients from a manifesto opening through three detailed project narratives to a layered inquiry form. The Ink and Paper visual identity makes every scroll feel intentional and craft-driven.

by Rocket studio

Quick summary

Folio is a curated interior designer case study portfolio landing page template built for designers who treat every project as an argument worth making. Three signature case studies unfold across an asymmetric 60/40 grid, pairing full-bleed project photography with layered narrative copy. The Obsidian and Gold color system, collage-style header, and GSAP-powered scroll animations turn a portfolio into an immersive experience.

Who this template is for

Interior designers need a portfolio that does more than display images. It needs to persuade. Folio is built for practitioners whose design work carries a strong point of view and whose clients expect that confidence before they ever send a brief.

  • Independent interior designers and small interior design studios handling residential, hospitality, or commercial commissions
  • Designers who want to showcase detailed case studies rather than a simple project gallery
  • Creative directors and design-forward professionals looking to highlight their design philosophy through narrative-led project showcases

What problem this template solves

Most portfolio templates for interior designers treat projects as a grid of thumbnails. Potential clients scroll past images without understanding the problem solved, the constraints navigated, or the breakthrough achieved. A visually stunning portfolio that is difficult to navigate is ultimately a failure, and a beautiful portfolio without a conversion path is just an archive.

Folio addresses this directly:

  • It structures each case study to walk clients through the original brief, the design process, and the finished outcome, so potential clients understand your thinking, not just your taste
  • It embeds a lead-generation path inside the portfolio flow, capturing inquiries at the moment a visitor is most persuaded, without interrupting the editorial experience
  • It gives designers a professional layout that positions design work at center stage while making easy navigation the default, not an afterthought

What you get with this template

Folio ships as a fully built single-page layout with every section, interaction, and typography choice resolved. You bring your own images and project copy. The template handles structure, style, and conversion logic.

  • A complete asymmetric landing page layout with a collage hero, three 60/40 case study sections, a typographic manifesto block, and a minimal footer
  • GSAP scroll-reveal animations, parallax image behavior, a cursor follower, and a fixed navigation call to action that activates after fifty percent scroll depth
  • An overlay inquiry form and a secondary email-gate modal for portfolio download, both built directly into the page

Feature list

The key features of Folio are purpose-built for interior designers who need their portfolio to present, persuade, and convert. Each design element below reflects a deliberate structural and visual decision.

Asymmetric 60/40 Case Study Layout

Each case study section uses a 60-column image side and a 40-column narrative side. The full-bleed project image gives high quality images the space they need. The narrative column carries the client brief, constraints, breakthrough moment, and outcome. Projects do not just display, they argue a point of view.

Collage Scrapbook Hero Header

The header is a layered composition of overlapping interior photographs at varied scales and rotations, torn-edge material swatches, handwritten serif italic annotations, and an angled Polaroid-style before shot. A single gold ruling line cuts diagonally across the composition. The designer name is set in uppercase with wide tracking. The effect is curated chaos with precise editorial intent.

Typographic Manifesto Section

Before the case studies begin, a full-width parchment block presents the designer's design philosophy sentence by sentence. Each line is set in oversized serif display type and staggered into view via GSAP scroll triggers. This section establishes a strong personal brand and sets the tone for everything that follows.

Lead Generation Overlay Form

The primary call to action reads "Start Your Story" and appears after the second case study, then locks into the navigation once scroll depth passes fifty percent. Clicking it opens a parchment-background overlay with three sequential fields: project type selector, a textarea labeled "Describe the space you're imagining," and an email field. No phone number, no budget dropdown. The form feels like writing a letter.

Email-Gated Portfolio Download

A secondary conversion path offers visitors the option to download the full portfolio behind an email gate. This modal captures undecided visitors who are not yet ready to submit an inquiry. It gives designers a second list-building channel without adding visual noise to the main page.

GSAP Animation and Scroll Interactivity

The page uses GSAP for scroll-reveal entrance animations, staggered manifesto sentence reveals, and parallax image movement. A cursor follower adds a tactile layer on desktop. Subtle transitions between sections keep the reading pace smooth and thoughtful. All motion is GPU-accelerated to maintain visual fluidity.

Page sections overview

SectionPurpose
Collage Hero HeaderEstablish designer identity with layered editorial composition and gold ruling line
Typographic Manifesto BlockOpen with design philosophy in oversized serif type, staggered sentence reveals
Case Study One (60/40)Brownstone gut renovation with full-bleed image and detailed narrative column
Case Study Two (60/40)Boutique hotel rebrand with image, narrative, and first "Start Your Story" call to action
Case Study Three (40/60)Editorial residential set with reversed layout, narrative leading image
Lead Generation OverlayParchment overlay form with project type, space description textarea, and email field
Email Gate ModalSecondary path offering portfolio download behind an email capture
Minimal Arc FooterClean footer with contact info, secondary links, and brand close

Design & branding system

Folio uses an Ink and Paper visual identity built around the Obsidian and Gold color system. The palette feels like a hand-bound portfolio with gold-foil debossing. Typography pairs Fraunces as the serif display face with DM Sans for body text, creating a clear hierarchy between bold headlines and readable prose.

  • Colors: deep charcoal black (#1A1A1A) as the dominant ground, warm parchment (#F0E6D3) for content panels, muted graphite (#4A4A4A) for body text, and brushed gold (#C9A84C) reserved for hover states, pull quotes, and thin ruling lines
  • Typography: Fraunces handles display headings, manifesto sentences, and pull quotes; DM Sans handles all body copy, form labels, and navigation items, keeping the site legible and user friendly at every scale
  • Layout and graphics: the asymmetric 60/40 grid, diagonal gold ruling lines, torn-edge material swatches, and layered collage graphics reinforce a consistent brand identity across every section

Mobile & speed optimization

Folio is built desktop-first because editorial photography and the asymmetric grid layout require horizontal space to work beautifully. The layout is fully responsive and adapts gracefully to smaller screens, ensuring the portfolio looks professional on mobile and tablet without sacrificing the visual weight of the design elements.

  • The asymmetric grid collapses to a single-column stacked layout on mobile, keeping project images above narrative copy for logical reading order
  • All images use lazy loading to reduce initial page load, and all animations rely on GPU-accelerated transforms only, keeping motion smooth across devices
  • The fixed navigation call to action and overlay form are both touch-friendly and accessible at mobile viewport sizes, so the conversion path works on every screen

How this template helps you convert

A design portfolio template that only showcases work leaves money on the table. Folio treats the portfolio as a curated, strategic sales tool. Every scroll decision, layout choice, and typographic beat moves potential clients from curiosity to inquiry.

  1. The manifesto section establishes design philosophy and personal brand before a single project image appears, so visitors are primed to see the work through the designer's own lens rather than forming an unshaped first impression
  2. The "Start Your Story" call to action is timed to appear after the second case study, when a visitor has already read two full project narratives and is most likely persuaded, then persists in the fixed navigation for the remainder of the scroll
  3. The three-field overlay form is designed to feel like correspondence rather than a lead form, reducing friction and encouraging potential clients to describe their space in their own words before an email address is ever requested

Other information about this template

Folio is a strong choice for interior designers who want their portfolio to function as more than an archive. A compelling portfolio communicates the designer's style and convinces potential clients to trust them with their space. A strong portfolio should reflect the designer's personal style while remaining functional and user friendly. The layout you pick can guide visitors, highlight your standout projects, and show your creative process with ease.

  • This design portfolio template is suited to residential, hospitality, and commercial project types; the case study framework can accommodate personal projects, group projects, and interior design projects across all three categories
  • The template provides a perfect foundation for interior designers who want to organize projects by type and present each one with detailed case study depth, including before-and-after photos and project context such as the original brief and constraints
  • Designers with limited coding skills can customize the template by replacing own images, updating copy blocks, and adjusting color palettes and typography settings; no advanced technical skills or web design background is required to launch a professional site
  • The structured layout gives each project its own dedicated section, so the portfolio can comfortably feature the six to ten signature projects that best represent a designer's capabilities without the page feeling cluttered
  • Platforms such as Wix, Squarespace, and TemplateMonster offer curated templates and flexible purchasing options for interior design studios of all sizes; Squarespace templates are designed to highlight work beautifully, whether through minimal elegance or bold editorial layouts, and Squarespace allows users to adjust colors, fonts, imagery, and layouts to fit their unique style
  • Wix offers customizable templates and easy-to-use tools for presenting skills confidently, and Wix's AI site builder can generate a custom portfolio website in minutes; TemplateMonster offers a flexible purchasing model, allowing users to buy templates individually or access a wider library through a subscription service
  • For designers considering additional formats, Adobe Stock provides premium templates that integrate into the Creative Cloud ecosystem, and Canva's drag-and-drop editor enables users to produce a stunning interior design portfolio template in minutes without specialized software
  • Including client testimonials near related case studies adds credibility and helps potential clients understand what working with you feels like, not just what your finished rooms look like
  • Contact details and contact info are handled through both the overlay form and the minimal Arc footer, keeping the site clean while ensuring visitors always have a path to reach you
  • Your portfolio is more than a collection of projects; it is your professional handshake, your brand identity, and your most powerful marketing tool
Showcase — Curated Interior Design Landing Page Template
Showcase — Curated Interior Design Landing Page Template
Showcase — Curated Interior Design Landing Page Template
Showcase — Curated Interior Design Landing Page Template

Theme

Ink & Paper

Creative direction

Manifesto

Color system

Obsidian & Gold

Style

Asymmetric Grid (60/40)

Direction

Lead Generation

Page Sections

Asymmetric 60/40 Case Study Grid

Collage Scrapbook Hero Header

Typographic Manifesto Block

Lead Generation Overlay and Email Gate

GSAP Scroll Animations and Cursor Follower

Obsidian and Gold Branding System

Related questions

Can I use my own images in this template?

Do I need coding skills to customize Folio?

How many case studies does this template include?

What does the lead generation form collect from visitors?

Is Folio suitable for hospitality and commercial interior designers?