Canopy is a modular card grid landing page built for a rainforest protection mutual aid network. It guides visitors from a cinematic video hero through an origin story, named partner communities, and verified impact receipts, before inviting them to join via a stepped sign-up form. The design pairs earthy terracotta tones with a precise new-growth green reserved for every action.
by Rocket studio
Loading preview…
Quick summary
Canopy is a single-page template designed for an Indigenous-led rainforest defense mutual aid network. It opens with a full-screen aerial video descent, then scrolls through a modular card grid that moves from founding story to active partner needs to real disbursement receipts. Visitors earn trust through evidence before they ever see a form.
Who this template is for
This template is built for organizations that move resources directly to frontline communities, not through institutional layers. It suits groups that need to demonstrate accountability visually, before asking for any commitment.
Conservation biologists and technical donors who want to see proof before contributing skills or funds
Diaspora communities with ancestral ties to threatened forests looking for a trustworthy, direct channel
Retired environmental lawyers and climate-concerned individuals seeking transparent, ground-level pro bono or financial pathways
What problem this template solves
Large nonprofit pages often ask for trust before offering any evidence. Visitors who distrust institutional intermediaries leave before converting. Canopy reverses that sequence entirely.
It leads with receipts: real disbursements, named recipients, dates, and arrival photos appear before any form
It replaces vague mission copy with named leaders, satellite imagery, and single-sentence needs per community
It removes friction from the contribution path by letting visitors self-select how they help, whether through funds, legal expertise, technical skills, or storytelling
What you get with this template
You get a fully structured, single-page layout built around modular card rows that deepen in trust as the visitor scrolls. Every section earns the next one.
A full-screen video hero with a timed descent sequence, a warm serif headline, and a dark gradient overlay
Three stacked card grid rows covering origin story, partner communities with satellite imagery, and interactive impact receipts
Theme
Nature-Inspired
Creative direction
Origin Story
Color system
Desert Rose
Style
Card Grid (Modular)
Direction
Lead Generation
Page Sections
Full-screen Video Hero with Descent Sequence
Modular Card Grid with Trust Progression
Floating Call-to-action Button
Three-panel Stepped Modal Form
Partner Community Cards with Direct Funding Path
Scroll-linked Animation and Card Stagger Reveals
Related questions
Can I use this template for a different type of nonprofit or mutual aid organization?
Does the stepped modal form connect to an external email or data tool?
Can I use a static image instead of the video hero?
How do the individual project micro-pages work with the community cards?
Is the layout suitable for both desktop and mobile visitors?
A floating "Join the Network" call-to-action button and a three-panel stepped modal form with role-based contribution checkboxes
Feature list
This section covers the core built-in capabilities of the Canopy template.
Full-Screen Video Hero with Timed Descent
The header opens with aerial drone footage descending from high above the canopy to eye level inside the forest. The descent takes eight seconds. A warm serif headline fades in at the bottom third over a dark gradient, with no other distractions on screen.
Modular Card Grid with Row-Based Trust Progression
Three card rows stack vertically as the visitor scrolls. The first row tells the founding story across three cards. The second row shows current partner communities with satellite images, named leaders, and a single stated need each. The third row presents interactive impact receipts with amounts, dates, and arrival photos.
Floating Call-to-Action Button
A "Join the Network" button in new-growth green pins to the viewport after the first scroll. It remains visible throughout the page without interrupting reading flow, giving visitors a persistent, low-pressure entry point.
Three-Panel Stepped Modal Form
Clicking the primary call-to-action opens a stepped form. The first panel asks only for name and email. The second offers checkboxes for contribution type: funds, legal expertise, technical skills, land or satellite access, and storytelling. The third panel is an optional open field asking how the visitor found the network.
Partner Community Cards with Direct Funding Links
Each partner community card includes a satellite image, the name of the community leader, and a single-sentence resource need. A secondary "Fund This Directly" link routes to individual project micro-pages, creating a parallel conversion path inside the main scroll.
Card Stagger Reveals and Scroll-Linked Animation
Cards animate into view using staggered reveals driven by an Intersection Observer. Scroll-linked opacity and beam border effects add motion without blocking content. A video poster fallback ensures the hero displays correctly when video cannot load.
Page sections overview
Section
Purpose
Video Hero
Opens with aerial descent and a single headline
Origin Story Cards
Three cards trace the founding from failed grant to first wire
Partner Communities
Named leaders, satellite imagery, and stated resource needs
Impact Receipts
Real disbursements with amounts, dates, and arrival photos
Join the Network
Stepped modal form and floating call-to-action
Footer
Horizontal flow layout with navigation and contact context
Design & branding system
The visual language pairs parched desert earth tones with a single thread of living green. The palette creates emotional contrast: the page feels grounded and honest until the green appears, and when it does, it signals that action is possible.
Colors: terracotta (#C2705B) for dividers and icon strokes, dried clay pink (#D4A59A) as a secondary warm tone, deep humus brown (#2C1810) for all body text, new-growth green (#4A7C59) reserved exclusively for calls-to-action and progress indicators, and warm off-white (#F5EDE4) as the handmade-paper background
Typography: Fraunces serif for all headlines, Manrope for body text and interface elements
Backgrounds alternate between humus brown and warm off-white across sections, reinforcing the sense of descent through layers
Mobile & speed optimization
The template is desktop-first in its layout priority, reflecting the primary audience of conservation professionals and legal practitioners working at desks. It also provides a strong mobile experience for diaspora visitors accessing from phones.
The video hero includes a poster fallback image that loads instantly when video is unavailable or the connection is slow
Card grids reflow for smaller screens, keeping named leaders, satellite thumbnails, and funding links accessible on mobile
Intersection Observer drives all card reveal animations, so motion only triggers as elements enter the viewport rather than on page load
How this template helps you convert
Canopy is structured to earn trust incrementally. Visitors move through evidence before reaching any ask, which reduces resistance at the point of conversion.
The scroll sequence moves from "why this exists" to "who it serves" to "proof it works," so by the time a visitor reaches the form, they have already seen exactly where resources went and who received them
The floating call-to-action button and the in-card "Fund This Directly" links create two separate conversion paths, one for network joiners and one for direct project funders, without forcing a single decision on every visitor
Other information about this template
Canopy suits any trust-first nonprofit or mutual aid organization that needs to demonstrate accountability before asking for participation. The template is built as a Nature-Inspired, Desert Rose color system design and is part of the Community and Nonprofit category with a Rainforest Protection Mutual Aid Network niche focus.
The template style is Card Grid (Modular), making individual card rows easy to adapt to different community groupings or funding campaigns
The creative direction follows an Origin Story framework, which works for any organization that wants to walk visitors through how it came to exist before explaining what it needs
Localization defaults to English and United States dollars, with geographic references to the Amazon, Congo Basin, and Borneo built into the content structure
