Onersoft Design System · v0
Tiny Radix wrapper
with a human-friendly color space.
A React component library that wraps Radix primitives in vanilla CSS. Lightweight by construction, with retheming in two lines.
01 — Tiny
The end of tuning is stock.
CSS-in-JS, Tailwind, recipe registries — every abstraction exists to produce one thing: a .css file. Onersoft produces it at build time and keeps the abstraction thin — a component API and a token system, nothing more. The weight goes; the developer experience stays.
Baseline
~161 kB (gz) — the cost of Next.js 16 + React 19 alone, before any UI library. Every site pays this floor before a single component renders. The portion of each bar past it is what a library actually adds on top.
02 — OKLCH
Edit once, overrides all.
OKLCH is a color space designed for human perception, not for screens. Surface, text, border, and accent are all derived from the same hue·chroma coordinates, so changing two values reshapes the entire palette in light and dark, in lockstep. Try it yourself.
Free forever
MIT-licensed. No seats, no usage limits.
In your host app, override the same two variables. No mapping table, no light/dark palette to define separately. Perceptual uniformity keeps lightness contrast intact at any hue you pick.
/* Retheme — that's it. */
:root {
--ds-brand-hue: 232;
--ds-brand-chroma: 0.06;
}03 — Verified
Compatible with modern web environments.
Every release runs the component suite through axe-core under Playwright on Chromium, Firefox, and WebKit. Integration-tested with Next.js and Vite + React — the two stacks we ship with. The version is 0.0.1 for a reason: expect APIs and component names to change before we cut a stable release.