Shelter - Rooted Housing Landing Page Template

Quick summary

Shelter is a single-page editorial template for tenant advocacy collectives. It opens with a full-viewport serif manifesto, then unfolds like a printed magazine, alternating household narratives with downloadable legal toolkits. The primary conversion goal is a slim, low-friction form to download the Tenant Defense Kit. Every design choice serves renters in crisis and the organizers who support them.

Who this template is for

This template is built for organizations that sit at the intersection of community care and legal action. It works best when the audience arrives with urgency and needs both emotional grounding and practical tools before they take the next step.

• Tenant advocacy collectives and housing rights nonprofits
• Community organizers mapping displacement and coordinating local response
• Pro bono attorneys and policy researchers who need a credible, resource-rich web presence

What problem this template solves

Many housing advocacy pages feel either too clinical or too vague. They lose renters in crisis before a single resource is downloaded. Shelter solves this by earning trust story by story, then delivering tools at the exact moment a visitor is ready to act.

• Renters facing midnight lockouts need immediate reassurance and a clear path to resources
• Organizers need a page that communicates legitimacy to both community members and legal partners
• Most nonprofit templates lack the editorial rhythm that makes resource-heavy pages feel welcoming rather than overwhelming

What you get with this template

Shelter gives you a fully structured, editorial-style landing page that balances human narrative with actionable legal content. Every section is purposefully sequenced to move a visitor from first impression to download without friction.

• A full-viewport manifesto hero with serif typography and a thin green rule divider
• Two community story sections with portrait placeholders and large italic pull-quotes
• Downloadable toolkit bands, a modal download form, and expandable long-form resource links

Feature list

This template ships with a deliberate set of components drawn directly from the brief. Each one serves the advocacy mission and the visitor's practical needs.

Full-Viewport Manifesto Hero

The hero fills the entire screen with a single serif sentence set in large, unhurried type. A thin shoot-green rule separates it from the collective's name and founding year. No image competes with the typography.

Community Story Sections

Two intimate household narrative sections sit between toolkit bands. Each includes a portrait placeholder, a large italic pull-quote, and body copy space for a specific fight and its outcome. The layout mirrors a printed magazine spread.

Downloadable Toolkit Bands

Full-width bands in tender shoot green hold illustrated icons and links to downloadable resources. Included resource types cover eviction defense checklists, know-your-rights one-pagers, and rent strike planning guides.

Tenant Defense Kit Download Form

A modal form opens from the primary terracotta call-to-action button. It collects only a first name, zip code, and a single checkbox for active housing issues, keeping the barrier to download as low as possible.

Expandable Long-Form Resource Links

Every toolkit band includes a secondary "Read the Full Guide" link. These open long-form resources without requiring any visitor information, giving a no-friction path for organizers and attorneys.

Asymmetric Footer Layout

The footer follows an arc pattern with the logo and tagline anchored left and navigation links aligned right. It closes the page with the same editorial calm as the rest of the layout.

Page sections overview

Design & branding system

The visual identity follows a Nature-Inspired theme built around a Soft Mist color system. Every color choice was made to feel like a community garden in the early morning, alive, unhurried, and quietly purposeful.

• Backgrounds breathe in morning fog gray (#E8E4E1) and cream; body text is anchored in deep loam (#3B3228); tender shoot green (#7A9E7E) marks every section divider
• Terracotta (#C4846C) is reserved exclusively for links and call-to-action elements, giving every clickable surface a warm, unmistakable signal
• Headlines use Fraunces, a display serif that reads like broadside type; body copy and interface elements use DM Sans for clean legibility

Mobile & speed optimization

Shelter was built mobile-first because renters in crisis are most often reaching for a phone, not a laptop. The layout prioritizes fast comprehension on small screens without sacrificing the editorial quality of the full desktop experience.

• Single-column stacking keeps community stories and toolkit bands readable at any screen width
• Animations are intentionally low to medium intensity, using gentle fade-in reveals rather than kinetic effects that would slow or distract
• The template follows a static-first build approach with optimized images and minimal JavaScript to keep the page light and responsive

How this template helps you convert

The conversion path in Shelter is carefully sequenced. The page earns the download before asking for it, using a story-by-story structure that proves the tools have already worked for someone.

1. The manifesto hero establishes mission and emotional resonance immediately, so visitors know within seconds that this page was made for them.
2. Alternating community stories and toolkit bands build both emotional trust and practical credibility before the Tenant Defense Kit form appears.
3. The slim download form asks only for a first name, zip code, and one checkbox, removing every unnecessary barrier between a visitor in crisis and the resource they need.

Other information about this template

Shelter is part of a template family designed for editorial and community-driven nonprofit use cases. A few additional details are worth noting for teams evaluating it.

• The page is localized for United States audiences, with English copy, American address conventions, and USD pricing context where applicable
• The Community Gallery creative direction means the scroll rhythm alternates between narrative and tools, giving the page a publication feel that distinguishes it from standard nonprofit templates
• This template fits naturally within the Housing and Homelessness subcategory of Community and Nonprofit work, and it scales well for collectives adding new stories or resources over time

Show more