Skip to content

Add window glass effect for macOS Liquid Glass and Windows Mica#2440

Open
huacnlee wants to merge 5 commits into
mainfrom
liquid-glass
Open

Add window glass effect for macOS Liquid Glass and Windows Mica#2440
huacnlee wants to merge 5 commits into
mainfrom
liquid-glass

Conversation

@huacnlee

@huacnlee huacnlee commented Jun 5, 2026

Copy link
Copy Markdown
Member

Summary

  • Add WindowExt::enable_window_glass / disable_window_glass / is_window_glass_enabled to toggle the system glass window background:
    • macOS 26+: Liquid Glass, by embedding a native NSGlassEffectView behind the window content (runtime class lookup, no macOS 26 SDK needed).
    • Windows 11 22H2+: Mica backdrop via GPUI MicaBackdrop, with a build number check so the return value is correct on older builds.
    • Other platforms: no-op that returns false, the window stays opaque.
  • When enabled, the theme surface colors are made semi-transparent in three tiers, so components let the glass show through with no per-component changes:
    • Window surfaces (background, title_bar, sidebar, tab_bar, table, tiles): x0.5
    • Container surfaces (secondary, group_box, muted, accent, list/tab/table colors, etc.): x0.7
    • Floating surfaces (popover): x0.85
  • The transform is applied in Theme::change, so it survives theme switching (light/dark, custom themes) and is fully restored on disable.
  • Add a "Window Glass" toggle to the story gallery settings menu.
  • Add examples/window_glass example.
  • Add "Window Glass" docs section (en + zh-CN).

Test plan

  • macOS 26: cargo run, open the settings menu, toggle "Window Glass" on and off, switch light/dark theme while enabled.
  • cargo run -p window_glass for the minimal example.
  • cargo build / cargo clippy -- --deny warnings / typos pass.

🤖 Generated with Claude Code

huacnlee and others added 5 commits June 5, 2026 19:51
Add WindowExt::enable_window_glass / disable_window_glass /
is_window_glass_enabled to toggle the system glass window background:

- macOS 26+: Liquid Glass, by embedding a native NSGlassEffectView
  behind the window content.
- Windows 11 22H2+: Mica backdrop.
- Other platforms: no-op that returns false.

When enabled, the theme surface colors are made semi-transparent in
three tiers (window / container / floating) to let the glass show
through. The transform is applied in Theme::change, so it survives
theme switching and is fully restored on disable.

Also add a "Window Glass" toggle to the story settings menu, a
window_glass example, and docs (en + zh-CN).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Extract the editor's bottom bar into a reusable StatusBar with
left/center/right regions and a StatusBarItem rendered as a ghost
xsmall Button. StatusBar sets flex_shrink_0 so it keeps its height
at the bottom of a flex column.

Wire it into the editor example and the gallery bottom bar, add a
StatusBarStory, and document it (en + zh).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Move the platform glass implementation (macOS NSGlassEffectView / Windows Mica / no-op fallback) into a dedicated window_glass module, one file per platform. Mirror the glass-enabled state onto Theme so a full theme swap via apply_config, not just a light/dark mode switch, reapplies the translucent surface adjustments. Sidebar hover now uses an opaque mix so it stays lighter than the active item even over a translucent glass sidebar. Docs synced (en/zh-CN).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@huacnlee

huacnlee commented Jun 9, 2026

Copy link
Copy Markdown
Member Author

Need GPUI to improve to solve round border render on glass background. zed-industries/zed#58833

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant