Home
Works
Services
Resources
Contact
Responsive Design
Evergreen Custom Homes mobile

Mobile

375px viewport

Evergreen Custom Homes

Seattle's Premier Home Builder

Location

Seattle, WA

Timeline

1-2 Weeks

Year

2025

View Live Site

Multi-page luxury homebuilder site with a vertical scroll-snap hero carousel, word-by-word scroll animations, touch-friendly project gallery, scroll-triggered navbar, and an Instagram-style social feed — built with zero UI libraries.

Full-screen hero carousel

Vertical scroll-snap between hero slides with smooth transitions — no carousel library

Scroll-triggered sticky nav

Navbar hides on scroll-down, reappears on scroll-up with a sleek opacity transition

Horizontal drag carousel

Touch-friendly project gallery you can swipe through natively on any device

Optimized for mobile-first

Fast load times with Next.js image optimization and responsive layouts at every breakpoint

About

Evergreen Custom Homes is a Seattle-based construction company specializing in custom home builds and remodels. With 150+ completed projects, they are known for precision craftsmanship and delivering homes that feel timeless from day one.

Highlights
  • Scroll-Snap Hero Carousel

    Full-viewport vertical scroll-snap between hero slides — each section locks into place with smooth native CSS transitions, no Swiper or Slick needed.

  • Word-by-Word Scroll Animations

    Headlines animate in one word at a time as they enter the viewport, powered by IntersectionObserver — cinematic feel with zero animation libraries.

  • Horizontal Swipe Gallery

    Touch-and-drag project carousel lets visitors swipe through completed homes on any device — built with pointer events and CSS scroll-snap, no Embla or Flickity.

  • Scroll-Triggered Sticky Navbar

    The navigation bar hides on scroll-down and reappears on scroll-up with a smooth opacity transition, keeping the hero content uninterrupted.

  • Instagram-Style Social Grid

    A masonry-style social feed pulls followers into the brand story — with hover overlays and a clean grid that adapts from 1 to 3 columns responsively.

  • Category Filter System

    Clients can filter projects by type — New Construction, Remodels, ADUs — with animated tab transitions that swap content without a full page reload.

Tags
Home BuilderConstructionPortfolioNext.jsReactTypeScriptTailwind CSSSeattle, WA
Let's build something great together

Not sure where to start?