Skip to main content

Consistent, accessible, extensible

An algorithmic theming and component engine.

Derive a complete, internally-consistent token set from an algorithm you control (a handful of anchor colors, or every last knob), and build apps and sites against components made to honor it.

Success: coverage 50/50 every consumed token is produced by the active register
derived from
bg #0b0d12
fg #e6e9ef
accent #6ea8fe

Watch the whole system render together

Everything below is live: real @xoji/astro components, rendered from the same register as the rest of the page.

xo
Live sampler rendered from the active theme
Info:xoji-default
Live derivation Live derivation
100%
All components covered
Every consumed token is produced by the active register.
Buttons · tone × variant
solid
outline
ghost
subtle
accent Success:success Warning:warn Danger:danger Info:info accent Success:success Warning:warn Danger:danger Info:info

By the numbers

50

components

Success:+2 since v0.0.0

8

categories

3

libraries

276

tokens

Success:+78 since v0.0.0

Why it works

The model rests on a few deliberate decisions, recorded so they don't drift.

core stance

The algorithm is the durable part.

A named, swappable algorithm maps a few anchors and knobs into a full, internally-consistent token set. A theme invokes one: anywhere from a quick three-color pick to a design dialed in over days. Both are first-class.

The open register.

Not a fixed schema. Authors declare new tokens and rewire any derivation. The only hard contract is a coverage check between what components consume and what a module produces.

One contract, every binding.

A manifest-driven component library (HTML custom elements, a Svelte wrapper, and Astro) all honoring the same derived tokens. This whole site is one xoji theme.

See the whole contract

50 components across 8 categories, each with a live demo, a full prop table, anatomy, and a live token-coverage check. All generated from one manifest.

Explore components →