Home
Templates
Community & Nonprofit
Gun Violence Prevention Nonprofit
Hearth - Powerful Grassroots Landing Page Template
Hearth is a single-column landing page template built for gun violence prevention grassroots organizations. It opens with full-screen community video, moves through survivor testimonies, a real-time death counter, a neighborhood intervention map, and a legislative win timeline, then closes with a chapter-join call to action. The design feels candlelit, exhausted, and determined.
by Rocket studio
Hearth is a single-column landing page template for neighborhood-level gun violence prevention organizing. It opens in silence with handheld community video, then builds through testimony, evidence, and a timeline of wins, earning the chapter sign-up ask only after the visitor has seen proof that showing up changes something.
This template is built for people doing real, grief-powered organizing work. It speaks the language of community members who need a digital home that matches the weight of what they carry.
Most nonprofit templates feel like brochures. They lead with logos and donation buttons before a visitor knows why any of it matters. For a gun violence prevention grassroots organization, that disconnect can cost real people walking away.
You get a fully structured single-column landing page that moves the visitor through a deliberate emotional and evidential arc. Every section earns the next one.
This template includes the following built-in capabilities, each designed to serve the specific purpose of a gun violence prevention grassroots organization.




Theme
Community Hearth
Creative direction
Movement & Cause
Color system
Slate & Sky
Style
Single Column Flow
Direction
Click-Through
Page Sections
Full-screen Video Hero with Serif Headline
Named Survivor Testimony Section
Real-time Death Counter and Neighborhood Map
Legislative Win Timeline with Pulsing Nodes
Scroll-linked Animation System
Click-through Chapter Join Flow
Can I replace the video footage with my own community clips?
Does this template include a form for collecting sign-ups?
How does the real-time death counter work?
Is the testimony section easy to update with new quotes?
What happens to the animations on devices with motion restrictions?
The header runs handheld community footage on autoplay, slightly slowed, with a single serif headline fading in over it. There is no button here. The moment is given space to breathe before any ask is made.
Large italic first-person quotes are set against dark space with amber accents on each speaker's name. The staggered reveal animation gives each voice room to land individually rather than competing in a grid.
A counter displays local gun deaths for the current year and ticks in real time. It sits alongside a hand-drawn-style neighborhood map SVG marking active intervention zones, pairing urgency with a sense of place.
A scrolling timeline shows community actions and policy wins in chronological order. Each node pulses in clearing blue, making momentum visible and giving new visitors a reason to believe that joining produces results.
The page uses scrollBlur transitions, staggered text reveals, and pulsing node animations throughout. The animation system respects reduced-motion preferences, so the experience adapts without breaking the visual arc.
The primary call to action, "Join Your Block's Chapter", appears first as a quiet text link after the testimonies, then returns as a full-width button after the timeline. A secondary link, "Read the Policy Agenda," serves visitors who need facts before feeling.
| Section | Purpose |
|---|---|
| Full-Screen Hero | Opens with community video and a single unhurried serif headline |
| Survivor Testimony | Presents named, first-person quotes with amber-accented stagger reveals |
| Evidence Counter | Shows a real-time local death count alongside a neighborhood intervention map |
| Legislative Timeline | Displays wins and actions with pulsing blue nodes to show building momentum |
| Chapter Join call to action | Delivers the full-width button ask after the visitor has seen the proof |
| Horizontal Footer | Closes with a clean, horizontally flowing footer pattern |
The visual identity is built around a Community Hearth theme using a Slate and Sky color system. The palette is intentionally narrow and emotionally specific, it evokes the hour when streetlights click off and the sky first turns blue again.
The template is built mobile-first, because community organizers work from phones. Every section reflows cleanly for small screens without sacrificing the emotional weight of the layout.
The landing page is structured as a click-through that earns trust before it asks for anything. Conversion is treated as a relationship, not a transaction.
Hearth uses Fraunces as its serif headline typeface and DM Sans for all body text. This pairing brings warmth and legibility together across both large display headlines and smaller paragraph copy. The footer follows a horizontal flow pattern suited to minimal navigation and a single closing message.