Charity_responsive Template is a free, MIT-licensed responsive website template for charity organizations, built on a Pug + Stylus + Grunt toolchain that compiles into a static HTML site. Designed by cssauthor and coded by Maxim Orlov, this archived GitHub repository provides a colorful, fluid one-page layout that can be customized through a JSON config file and built with Grunt tasks.
What is the Charity_responsive Template?
Charity_responsive Template is a free, responsive website template designed specifically for charity and non-profit sites. It takes Pug templates, Stylus stylesheets, and JSON data as source inputs, and produces a static build directory containing index.html, page.html, minified CSS, images, and fonts. The template runs on a Node.js and Grunt build system, with BrowserSync providing live reload during development. The repository is marked ARCHIVED, meaning it is no longer actively maintained, but the source and demo remain available for use.
Key Features
- Fluid responsive layout — Described as a "nice fluid website template" and a "colorful" design, ideal for one-page charity sites.
- Pug templating — Page templates live in dev/pug/pages with layouts, blocks, and helper mixins, and are compiled into static HTML.
- Stylus preprocessing — Styles are written in Stylus with custom mixins, variables, and vendor code, then compiled, vendor-prefixed, and media-query combined into screen.css.
- Grunt task automation — Built-in tasks include cleanup, dev, build, rebuild, and server, enabling one-command compilation, minification, and asset syncing.
- BrowserSync live reload — The dev and server tasks run a static server with live reload, so changes to templates or styles appear instantly in the browser.
- Production build optimizations — The build task minifies images, stylesheets, and HTML, outputting everything under build/static.
- JSON site configuration — General settings are stored in dev/data/config.json and exposed to templates as config.key-name, allowing site name, links, and contacts to be edited without touching markup.
- MIT license — Free to use and modify for personal or commercial projects.
Who is it for?
- Charity organizations — Launch a colorful, responsive one-page website to present missions, campaigns, and calls to action without hiring a web designer.
- Front-end developers — Use the repo as a boilerplate for a static site with Pug and Stylus, and adapt the charity theme to any client's brand.
- Designers — Explore cssauthor's design and use the Grunt workflow to preview changes instantly with BrowserSync live reload.
What can you do with it?
- Fundraising campaigns: Build a one-page landing site that tells a charity's story and directs visitors to donate or volunteer, using the included index template.
- Organization pages: Use page.html as an inner page template for about, contact, or news content, keeping the same visual style.
- Rapid prototyping: Start a new project by copying the dev/ folder, editing config.json with organization name and links, and running
grunt devto see changes live.
How does it work?
- Install Node.js and run
npm installto fetch dependencies from package.json. - Optionally install Grunt, Ruby, and Ruby Sass globally to run the build tasks.
- Edit general settings in dev/data/config.json.
- Run
grunt devto compile Stylus and Pug, start a BrowserSync server, and watch for changes. - Run
grunt buildto produce minified output in build/ for deployment.
Pricing
Free and open source under the MIT license; no pricing tiers are listed.
FAQ
Is the Charity_responsive Template free?
Yes, it is released under the MIT license, so you can use, modify, and redistribute it for personal and commercial projects free of charge.
What technology stack does it use?
The template is built with Pug for HTML templating, Stylus for CSS preprocessing, and Grunt for task automation. It also uses BrowserSync for live reload and supports Ruby Sass optionally.
How do I customize the site content?
Edit the JSON configuration file at dev/data/config.json. All settings listed there are available in templates as config.key-name, so changing the site name, links, or contact details is done without touching the Pug files.
Why is the repository marked ARCHIVED?
The repository is archived, meaning the original maintainer no longer updates it. The source code and demo remain accessible, but you should expect no future bug fixes or feature additions.
Is Grunt the only build system I can use?
The README mentions that Gulp is an alternative build system, but all provided tasks and configuration are written for Grunt. To use Gulp, you would need to adapt the configuration yourself.
