Kindred — Free Nonprofit Website Template
Kindred gives a neighborhood food pantry a warm, plain-spoken website in tomato, butter yellow and leaf green on kraft paper, with Young Serif headings and Lexend body text. The copy puts dignity first: what a visit is like, what you will never be asked and what to bring if you have nothing. Opening hours drive a live open or closed status across the site, volunteers can filter a weekly shift calendar and book a spot, and donors can price a gift, switch to monthly or build a food shopping list.
Key features
- Get help / give help split hero with a next-pantry-day note that reads the opening hours
- Live open, opening soon or closed status in the top bar, on the weekly hours card and for each location, from one hours setting
- Shelves running low list with stock meters and a copy-as-shopping-list button
- How a visit works steps and a list of things the pantry will never ask
- Weekly volunteer shift calendar with role filters, an only-open-shifts switch, spots-left dots and full shifts
- Shift sign-up form that preselects the picked shift and role and updates the spots left when booked
- Donate page with money and food tabs, a monthly switch, preset or custom amounts and a live meals impact line
- Food wishlist with checkboxes saved in localStorage, copy and print, plus four drop-off points and a can’t-accept list
- Events page with type filters and add-to-calendar .ics downloads
- About page with a timeline, an SVG households chart, spending and income breakdowns, and staff and board shown with initials avatars
Best for
- Food banks and community pantries
- Local nonprofits and mutual aid groups
- Soup kitchens, community fridges and meal programs
- Neighborhood charities that run volunteers and events
At a glance
- Bootstrap 5.3.8 with vanilla JavaScript, no jQuery
- 6 pages: index.html, get-help.html, volunteer.html, donate.html, events.html, about.html
- Palette and fonts set as CSS custom properties in css/style.css
- Young Serif headings with Lexend body text
- Inline SVG icons and hand-built SVG charts; no icon fonts or chart libraries
- Free for personal and commercial use; attribution optional but welcome. Full terms: uicookies.com/license
How to use it
Unzip the folder and open index.html in a browser. Edit the copy in the six HTML files and swap the photos in img/ for your own. Colours and fonts are CSS custom properties at the top of css/style.css, and the main pantry hours and meals-per-dollar figure sit at the top of js/main.js. Forms are front-end only, so connect a form service or payment provider, then upload the folder to any static host.
Frequently asked questions
Is Kindred free for a real nonprofit or a client project?
Yes. Kindred is free for personal and commercial use, including a live charity website or a site you build for a client. Attribution to uiCookies is optional but always welcome, and the full terms are on the uiCookies license page.
What is Kindred built with?
Kindred uses Bootstrap 5.3.8, self-hosted, and one vanilla JavaScript file with no jQuery or other libraries. Icons and charts are inline SVG, and every section stays readable with JavaScript turned off.
Which pages are included?
There are six pages: a home page, get help, volunteer, donate, events and about. Together they cover opening hours, eligibility, locations, languages, a delivery referral form, a shift calendar and sign-up, money and food giving, events and the organization’s people and finances.
Do the forms and donations work out of the box?
The referral, volunteer, donation and newsletter forms validate in the browser and show a success message, but nothing is sent and no payment is taken. Point them at a form service, your CRM or a payment provider before going live.
How do I change the opening hours and the open-now status?
The main pantry hours are one line at the top of js/main.js, and each location row on the get help page carries its own hours in a data-hours attribute. Edit those and the top bar status, the next pantry day note and the location pills all follow. The printed hours in the page copy are plain text you edit alongside them.
