Circuit

One system, six tools. Circuit is a single set of tokens — neutrals, type, spacing, components — with exactly one dimension that changes per project: an accent hue. Everything else stays fixed, so switching between matey, mcp-query, ecmanim, clawser, andbox, and objectify feels like moving between rooms in the same building, not different buildings.

This site is itself a Circuit consumer — it imports @erisera/circuit and remaps Starlight’s own theme variables onto it. Nothing here is a mockup.

The three rules

Only --accent (derived from --hue) changes per tool. See Color for the full token reference.

Try it live

The interactive showcase has the full token spec, a live hue picker, and a working search palette you can open with /.

Install

npm install @erisera/circuit

@import '@erisera/circuit/tokens.css';
@import '@erisera/circuit/themes.css';
@import '@erisera/circuit/components.css';

<html class="theme-matey">        <!-- or theme-mcp-query, theme-ecmanim, theme-clawser, theme-andbox, theme-objectify -->
<html class="theme-matey dark">   <!-- dark mode -->

Source: github.com/erisera-code/circuit