How to use

1. Start: use this template

Click Use this template and GitHub makes you your own repository — a complete, independent copy. No upstream to track, no permission to ask. It's plain HTML and CSS: nothing to install, no build step to run, no framework to adopt.

Use this template

2. Get oriented

Read these four files, in this order:

1. README — what the system is, and how it's laid out.
2. PRINCIPLES.md — the three commitments everything else follows from.
3. TESTING.md — the bar every component has to clear.
4. docs/adapting.md — how to make it yours.

3. Adapt

Theming here is self-determination. Your community's colours and words live in one file — tokens.css. Remap the activity colours, the surfaces, the type, and every component follows. You don't need to touch the component CSS.

:root {
  /* Your community's palette, in one file. */
  --grow:   #b5651d;  /* terracotta — what this fork calls "available" */
  --repair: #4f7a6f;  /* sage       — "needs attention" */
  /* …surfaces, type, spacing follow the same way. */
}

One safeguard worth knowing: every foundation reads its tokens with a fallback — var(--token, sensible-default) — so if you delete a token by mistake, the system degrades visibly instead of failing silently. Keep that convention in any CSS you add.

Read the adapting guide →

4. Test

seedbank.design has three foundational test criteria. Pass these and a change will survive the edges:

• It renders with no CSS at all.
• It works at 200% zoom.
• It works at 320px wide.

Hold your fork to the same bar.

Read the low-fi testing guide →