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.

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

SectionPurpose
Partner Logo BarScrolling nonprofit partner logos build immediate community credibility
Hero SplitCinematic handshake photo with headline and dual call-to-action buttons
Testimonial Block OneExecutive director story paired with average placement time stat
Testimonial Block TwoTemp staffer story paired with a community photo
Testimonial Block ThreeProgram director and case manager story paired with a placement region map
Dual Form SectionSide-by-side forms for talent sign-up and nonprofit hiring requests
Split FooterLogo, 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.

  1. 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
  2. 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
  3. 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
Hearth - Missiondriven Tempstaffing Landing Page Template
Hearth - Missiondriven Tempstaffing Landing Page Template
Hearth - Missiondriven Tempstaffing Landing Page Template
Hearth - Missiondriven Tempstaffing Landing Page Template

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?