A design system you can read, run, and rebrand.
Givehearth documents itself the way a serious operator briefs a serious counterpart: large, declarative, and editable. Every page is real code, every token lives in one CSS file, and every component is composed from the same primitives.
Two reference pages, one set of tokens.
The Examples page shows what you can build. The Design System page shows the rules that make it work. The /styles/app.css file lets you swap the brand without touching either.
Design System (/design-system)
Color, typography, buttons, cards, forms, spacing, radius, elevation, responsive. Open this when you need to know what a token is named or how a primitive is supposed to look.
Examples (/)
Pricing tiers, product selector, shopping cart drawer, app shell, data table, auth forms, modal, empty state, toasts. Open this when you need a pattern to drop into your own app.
Rebrand in one file
Every color, font, radius, and spacing value is a CSS variable in app/styles/app.css. Replace the hex values, leave the token names, and every page in the kit retags to the new brand.
Where changemakers raise more, with less friction.
Local shelters raised $480k in 90 days
A coalition of seven shelters ran a peer-to-peer campaign with branded donation pages, recurring giving tiers, and DAF support.
Read the story →Scholarship fund tripled donor retention
Quarterly impact reports + branded thank-you sequences turned one-time gifts into year-round support. CRM and email worked from a single timeline.
Read the story →14,000 members on recurring giving
Replaced three legacy tools with a single workspace. Pledge campaigns, text-to-give, and event ticketing now share donor records.
Read the story →Givehearth leads the pack in user satisfaction
Highest ratings for ease of use, quality of support, and fit for small-to-mid nonprofits — across 1,200+ verified reviews from team leads, development directors, and volunteer coordinators.
Monthly playbook for fundraisers who don't have a fundraising department.
One short note a month — campaign teardowns, donor-retention experiments, and template snippets you can paste into your next appeal.
Working journal
Loose notes on how the kit was put together — what's intentional, what's still open, and where the seams are.