lotusui the ikaito design language for Gio — desktop, mobile, web
GitHub

Design principles

The rules that make an app built on lotusui read as one product.

lotusui owns the mechanisms of a design language. The rules are few and fixed — components enforce them so screens don't have to remember them. The look itself is yours: every rule below operates on theme tokens, so a custom palette keeps the discipline while changing the skin (see Theme & palette).

One accent, quiet grays

Neutral grays by default: panels floating on a tinted canvas, hierarchy from size and color rather than bold shouting. There is exactly one accent — yours — and red belongs to Delete-class actions exclusively. Status colors always render as a pastel background with deep ink text, never saturated fill with white text.

State lives with the caller

The core contract: components wrap arbitrary content and know nothing about what's inside. Visibility, values, and selection belong to the caller — widget.Clickable for buttons, isOpen/onClose for the dialog, Value on checkbox and switch. Input rules reject wrong characters at the input layer instead of flagging them after the fact.

Reveal, never reflow

Motion is a viewport trick: panes live at natural width on a strip and are only ever revealed or hidden by its edges — content never re-flows mid-animation. One shared animation clock drives every transition, so everything in an app moves identically.

Every demo on this site is the real Go component compiled to WebAssembly — one gallery app, one bundle, addressed by URL hash.