Design signature

Manti UI aims to feel smooth: quiet surfaces, clear state changes, and predictable interaction.

Material

The default interface is cool, near-neutral, and monochrome. Color appears through semantic variants instead of decoration.

Floating surfaces share one panel treatment:

translucent surface tint;
subtle border;
blur when the browser and layout support it.

The signature surface

A rounded panel with a quiet border and clear surface contrast.

Use .manti-panel for application-owned menus, sheets, or command palettes. Manti falls back to an opaque surface when blur is unavailable.

Main controls

.manti-app {
  --manti-panel-tint: oklch(0.2 0.008 280 / 0.55);
  --manti-panel-border: oklch(1 0 0 / 0.09);
  --manti-panel-blur: blur(16px) saturate(160%);
}

For broader customization, continue to Color & variants, Design tokens, and Motion.

Last updated 13 September 2026