Hearth - Missiondriven Tempstaffing Landing Page Template
Hearth is a warm, editorial landing page template built for mission-driven temp staffing agencies serving nonprofits. It features a dual conversion path for both temp talent and hiring managers, a scrolling partner logo bar, three zigzag testimonial blocks, and a Soft Mist color system that feels trustworthy and unhurried from the first scroll to the final form.
by Rocket studio
Quick summary
Hearth is a single-page staffing template designed for nonprofit temp placement agencies. It pairs a cinematic hero section with three alternating testimonial blocks, a dual call-to-action form section, and a footer. The Soft Mist palette and editorial typography create a calm, community-center feel that earns trust before it asks for anything.
Who this template is for
This template is built for staffing agencies that work exclusively with nonprofits and need to speak to two very different audiences at once. It suits agencies whose placements happen fast and whose clients run lean.
- Nonprofit temp staffing agencies building dual pipelines of talent and clients
- Executive directors, program managers, and development officers at small or mid-size nonprofits facing urgent coverage gaps
- Experienced nonprofit professionals looking for flexible, mission-aligned temp work
What problem this template solves
Nonprofit hiring managers do not have time for a slow sales process. They need someone by Monday. At the same time, skilled temp workers want to know the agency understands their values before they submit a résumé. A generic staffing template serves neither group well.
- No clear split between the talent path and the hiring manager path, which confuses visitors and loses conversions
- Generic agency designs that feel transactional instead of community-led, which breaks trust with mission-driven audiences
- Lack of social proof specific to nonprofit contexts, leaving both talent and clients uncertain about fit
What you get with this template
The template delivers a complete, section-led landing page ready to customize. Every section serves a specific job in the conversion journey, and no section wastes a visitor's attention.
- A hero section with a scrolling nonprofit partner logo bar, a cinematic split layout, a headline, and a dual call-to-action setup
- Three zigzag testimonial blocks pairing real stories with supporting visuals or data points
- A dual form section with a "Join Our Bench" talent form and a "Request a Temp" hiring manager form, placed side by side
- A footer in a split layout with logo, tagline, and navigation links
Feature list
This template is built around specific components that make it work for nonprofit temp staffing. Each feature is grounded in the source brief.
Scrolling Partner Logo Bar
A horizontal marquee of nonprofit partner logos opens the page. It runs as a gentle, continuous scroll across the top of the viewport, giving visitors immediate proof of community membership before they read a single word of copy.
Dual Conversion Path Forms
Two distinct forms sit side by side in the conversion section. The "Join Our Bench" form collects name, skill area via a dropdown, availability window, and an optional résumé upload. The "Request a Temp" form asks for organization name, role needed, and start date. Each path speaks directly to its audience without confusion.
Zigzag Testimonial Mosaic
Three alternating blocks each pair a named story on one side with a visual or data point on the other. The layout builds trust by accumulating proof gradually, so by the time a visitor reaches the forms they already feel a sense of familiarity with the agency.
Persistent Secondary Call to Action
A "Request a Temp" button sits in the top-right corner throughout the scroll. It stays visible but unobtrusive, giving hiring managers a direct path to the intake form at any point without interrupting the storytelling flow for talent visitors.
Cinematic Hero Split
Below the logo bar, the hero uses a soft-focus photograph of a handshake moment paired with a deep-charcoal headline. The layout communicates the emotional relief of a placement before any explanatory copy appears.
Arc Browser Split Footer
The footer uses a split layout with the agency logo and tagline on the left and navigation links on the right. It closes the page cleanly without clutter and reinforces brand identity at the final scroll position.
Page sections overview
| Section | Purpose |
|---|---|
| Partner Logo Bar | Scrolling nonprofit partner logos build immediate community credibility |
| Hero Split | Cinematic handshake photo with headline and dual call-to-action buttons |
| Testimonial Block One | Executive director story paired with average placement time stat |
| Testimonial Block Two | Temp staffer story paired with a community photo |
| Testimonial Block Three | Program director and case manager story paired with a placement region map |
| Dual Form Section | Side-by-side forms for talent sign-up and nonprofit hiring requests |
| Split Footer | Logo, tagline, and navigation links in a two-column layout |
Design & branding system
The Soft Mist color system was chosen to feel like a wool blanket in a community center lobby. Nothing shouts. Everything breathes steadiness and trust.
- Colors: morning fog gray (#E8E4DF) and clean white alternate as section backgrounds; hearthstone warm beige (#C7B9A1) adds depth; deep charcoal (#3B3735) carries all body text; muted terracotta (#C4785B) appears only on buttons and pull-quote borders to guide the eye without competing
- Typography: Fraunces serif for headlines and Dekko Modern Sans (DM Sans) for body copy, a pairing that feels warm and readable without being decorative
- Visual style: warm editorial with gentle scroll reveals, a logo marquee animation, and staggered text entries; no heavy motion or high-contrast surprises
Mobile & speed optimization
The template is built desktop-first with full mobile parity. Nonprofit executive directors often check messages on a phone between meetings, so the layout must hold its intent on small screens.
- The zigzag blocks restack cleanly on mobile so story and visual remain paired without crowding
- The persistent secondary call-to-action button and dual forms remain accessible and usable at all viewport sizes
- Static sections use Server Components and interactive elements such as forms and the logo marquee use Client Components to keep the experience responsive
How this template helps you convert
The page earns the conversion before it asks for it. Every section adds a layer of trust so that reaching the form feels natural, not pressured.
- The scrolling logo bar and hero photograph establish credibility and emotional resonance in the first few seconds, reducing bounce before a visitor reads the headline
- The three testimonial blocks each add a new dimension of proof, moving visitors from curious to confident by the time they reach the form section
- The dual form layout removes friction by giving each visitor exactly the path they need, whether they are looking for work or looking to hire, without making either audience feel like an afterthought
Other information about this template
This template is part of the Community Hearth theme family and uses the Soft Mist color system as its visual foundation. A few additional details worth knowing before you customize it.
- Localization is set for the United States market, using USD currency format and MM/DD/YYYY date formatting throughout
- The template is designed for the HR and Hiring category with a specific focus on nonprofit temp staffing and nonprofit HR workflows
- Animation intensity is low to medium, using gentle scroll reveals and a logo marquee rather than heavy transitions, which keeps the editorial tone intact
- The footer follows a split layout pattern with the logo and tagline anchored left and navigation links aligned right, consistent with the Arc Browser Split style referenced in the brief




Theme
Community Hearth
Creative direction
Testimonial Mosaic
Color system
Soft Mist
Style
Zigzag/Alternating
Direction
Recruitment/Hiring
Page Sections
Scrolling Partner Logo Bar
Dual Conversion Path Forms
Zigzag Testimonial Mosaic
Persistent Secondary Call to Action
Cinematic Hero Split
Arc Browser Split Footer
Related questions
Can I use this template for a general staffing agency, not just nonprofits?
How does the dual form section work?
What makes the testimonial blocks different from a standard review section?
Is the template customizable for different nonprofit service areas?