One look for every lsuite app.

Frosted glass for the chrome, solid surfaces for the work, and one signature color per app, so you can tell them apart at a glance the way you tell a blue suite app from an orange one. Same type, radii, spacing and motion everywhere, in dark and light. Pick an app and a mode above.

tokens.json · tokens.css · DESIGN.md · lsuite.xyz

Each app owns one hue.

Same lightness and chroma for all three (OKLCH), only the hue changes, so they read as one family. The accent is step 400 in dark mode and 600 in light. Violet, green, amber and pink are kept for the next apps.

Glass around the work, never on it.

Sidebars, toolbars, inspectors, transport and popovers are glass over the window's tinted backdrop. The canvas, timeline or document stays solid, so what you make is never blurred or tinted.

Three levels of frost.

The higher a surface floats, the more opaque it gets, so text stays readable over anything. With "reduce transparency" turned on, every tier becomes solid.

Manrope and IBM Plex Mono.

What every app follows.