Gather is a compassionate fundraising landing page template built for people navigating real crisis. Its single-column flow guides emotionally vulnerable visitors from a hand-drawn hero illustration through live campaign cards, a three-step progressive form, and a human-first team section. The design feels quiet and warm, making it easy for anyone to start a fundraiser or become a donor.
by Rocket studio
Loading preview…
Quick summary
Gather is a single-column fundraising landing page template designed around human stories. It pairs a watercolor-style illustration with a low-friction three-step form, live campaign progress bars, and trust-building team photography. The Slate and Sky color system keeps the experience calm and open. Whether someone is starting a campaign or considering a donation, every scroll feels personal.
Who this template is for
This template is built for people who need to raise money quickly and for the communities that rally around them. It is equally useful for organizations running ongoing charitable campaigns.
Individuals or advocates launching a personal fundraiser for medical bills, disaster recovery, or family hardship
Nonprofit organizers and community groups coordinating cause-based funding drives
Platform builders creating a charity or fundraising product that needs an emotionally resonant first impression
What problem this template solves
Most fundraising pages feel transactional. They ask for a dollar goal before they ask for a story. People in crisis often freeze at that barrier and abandon the process entirely.
Visitors arrive in a vulnerable state and need a frictionless, emotionally safe entry point
Potential donors need trust signals, real faces, and visible proof that campaigns actually succeed
Platform owners need a page that converts both fundraiser creators and donors without feeling cold or corporate
What you get with this template
You get a fully structured, single-column landing page with every section pre-built and ready to customize. The layout moves visitors through an intentional emotional arc from arrival to action.
A hero section with a custom watercolor-style illustration, a headline that opens the conversation, and a primary call-to-action button
A three-step progressive form modal that collects story context and contact details before asking for any financial information
Live campaign cards with animated progress bars, a testimonial grid, a donor portrait wall with a live counter, and a mid-conversation team photography section
Theme
Healing Space
Creative direction
Team & People
Color system
Slate & Sky
Style
Single Column Flow
Direction
Lead Generation
Page Sections
Three-step Progressive Form Modal
Animated Campaign Progress Bars
Persistent Bottom Call-to-action Bar
Live Donor Counter with Portrait Wall
Watercolor Hero Illustration
Mid-conversation Team Photography Grid
Related questions
What makes this template different from a standard donation page?
Can I use this template if I am not a designer?
How does the three-step form work?
Is this template suitable for a nonprofit organization?
What sections are included in this template?
Feature list
A quick paragraph on what makes this template functionally distinct: every component was chosen to reduce friction for emotionally vulnerable visitors while building layered trust for skeptical donors.
Three-Step Progressive Form Modal
The primary conversion path opens a modal with three gentle steps. Visitors choose who the fundraiser is for, write one sentence about what happened, then provide a name and email. No dollar goal and no bank details are required upfront.
Animated Campaign Progress Bars
Three live campaign cards display animated progress bars that fill on scroll reveal. They answer the silent question every new visitor asks: does this actually work for real people?
Persistent Bottom Call-to-Action Bar
After the second scroll, a fixed bottom bar keeps the "Start a Fundraiser" button in view. Visitors can act at any moment without scrolling back to the top.
Live Donor Counter
A circular portrait wall sits above a counter that ticks upward in real time. This section converts passive browsers into believers by making the donor community visible and active.
Watercolor Hero Illustration
The header features a hand-drawn scene of diverse figures reaching toward each other, rendered in soft watercolor-style lines. It communicates warmth and humanity before a single word is read.
Team Photography Grid
Engineers and support staff are shown mid-conversation, not posed. This section puts real faces behind the platform and answers the trust question that donors and fundraisers both carry silently.
Page sections overview
Section
Purpose
Hero Illustration
Opens with humanity and the primary call-to-action
Live Campaign Cards
Shows real campaigns succeeding with progress bars
How It Works
Displays the three-step form in an asymmetric bento layout
Voices and Donors
Builds trust through testimonials and a live donor counter
Team Photography
Introduces the people behind the platform
Footer
Single-row linear footer with navigation and links
Design & branding system
The visual identity follows a Healing Space theme. Every color and typographic choice was made to feel like a calm, safe environment where a difficult conversation can begin.
Color system uses deep slate (#3B4856) for text, soft cloud gray (#E8ECF1) for backgrounds, sky-wash blue (#7BAFDE) on buttons and progress indicators, and dawn rose (#D4A0A0) for testimonial highlights and emotional accents
Typography pairs Fraunces serif headlines with DM Sans body text, creating a warm contrast between editorial feeling and readable clarity
The hand-drawn illustration style is intentionally imperfect, signaling human presence over polished software
Mobile & speed optimization
Crisis moments happen on phones. This template is built mobile-first, with a layout that flows naturally on small screens from the very first section.
Single-column flow eliminates horizontal complexity and keeps the reading path linear on any screen size
Scroll-reveal animations, counter tick-up, and progress bar fills use client-side rendering only where interactivity is required, keeping static sections light
The persistent call-to-action bar is designed to stay accessible and unobtrusive on mobile viewports throughout the scroll
How this template helps you convert
The page is structured as an emotional journey, not a product tour. Every section moves a visitor one step closer to action.
The hero illustration and headline create an immediate sense of safety, lowering emotional resistance before any ask is made
Live campaign cards and the donor counter provide visible social proof that real people trust and use the platform
The three-step form removes the biggest barrier to starting a fundraiser by asking for a story before it asks for money
Other information about this template
This template sits at the intersection of community-driven design and practical conversion architecture. It was built for the online fundraising platform niche within the broader charity and fundraising space.
Template style is Single Column Flow, keeping the narrative focused and distraction-free from top to bottom
The secondary call-to-action, "See How It Works," links to a sixty-second animated walkthrough for visitors who are not yet ready to start a fundraiser
Localization is set for English, United States Dollar currency, and United States date formatting
Animation intensity is set to medium: scroll reveals, counter animations, and progress bar fills are present but never distracting
The footer follows Pattern 1, a linear single-row layout, keeping the bottom of the page clean and uncluttered
