Skip to main content
LucentUI renders one component tree through two visual systems. Switching appearance does not replace homepage blocks, dashboard blocks, copy, media, colors, or extension data.
The default design uses restrained translucent surfaces, semantic borders, and background blur. Choose a surface hierarchy and glass recipe to control how often and how strongly glass appears.

​
Lucent surface hierarchy

Balanced is the safest default for readability and visual hierarchy.

​
Glass recipes

Optional custom blur is clamped to 0–50 px. Custom opacity is clamped to 10–100%. Leave either field empty to inherit the chosen preset.

​
Flat surface styles

These controls appear only while Flat UI is selected.

​
Choosing a mode

  • Use Balanced Lucent when wallpaper and branded depth are part of the experience.
  • Use Flat / Bordered for dense business dashboards and maximum separation.
  • Use Flat / Quiet when content hierarchy already provides enough structure.
  • Validate light and dark mode after every palette or wallpaper change.
“Solid” under Lucent surface hierarchy and “Flat UI” are not identical. Solid retains the Lucent system and layout treatment; Flat UI disables the glass behavior globally and offers its own three surface styles.
Last modified on September 9, 2026