Build a theme
Every Collr profile can wear a theme, and the themes are contributed. One is a small block of JSON: a background, an accent, a text colour, and a set of choices about shape and type. There is no template to write and no code to ship — every theme uses the same markup, so you change values rather than learn a component tree.
Two minutes to a theme on screen
- 1Clone themedev and open
preview/index.htmlin a browser. No install, no build step, nothing to sign up for. - 2Copy
themes/example.json, change the values, reload. The preview draws a mock profile at desktop and at 320px and prints the contrast ratios as you go. - 3Want it to move? Add a stylesheet beside the JSON. Several Collr themes animate — drifting lights, a sweeping radar, a slow pan — and the preview has a switch for what a visitor who asked for reduced motion will see.
- 4Open a pull request. It goes to GitHub, so the only account you need is one you almost certainly already have.
What review asks about
- Contrast. Body text at 4.5:1, the display name at 3:1, and the accent has to read as text because it is used for links.
- A background you didn’t choose. Members can replace your background with their own, including a pale one. The preview has a switch for it; nothing may become invisible.
- Touch and width. Buttons at least 44px tall, and it has to hold together at 320px.
- Anything that moves stops — not slows — for anyone who has asked their device for less motion, and every selector is scoped to your own theme so it cannot reach anyone else’s page.
A theme ships to every visitor of every profile using it, which is why each one is reviewed as a code change rather than merged on sight.
Accepted themes carry your name
Your theme lists you as its contributor, and if you have a Collr page you earn the Contributor badge — the same one the people who send code get.