LiquidGlassAvaloniaUI

An AvaloniaUI “liquid glass” backdrop effect: vibrancy → blur → rounded-rect lens refraction (optional dispersion) → edge highlight.

🎯 Overview

This project implements a composited backdrop pipeline using AvaloniaUI + SkiaSharp (SKRuntimeEffect) on Avalonia’s Skia renderer.

Requires the Skia renderer (Avalonia.Skia).

Screen.Recording.2026-01-10.at.15.55.20_compressed_v3.mp4

More headless-rendered examples:

Distortion (refraction + CA)	Magnifier (zoom + offset)

Progressive mask blur

🚀 Quick Start

1. Clone the repository
2. Open the solution in your IDE
3. Run the LiquidGlassAvaloniaUI.Demo project to see the effects in action

The demo includes a floating draggable glass card for quick testing.

To validate rendering headlessly and optionally emit PNGs:

• dotnet test LiquidGlassAvaloniaUI.sln -c Release
• (optional) LIQUIDGLASS_TEST_OUTPUT_DIR=./artifacts to write with-glass.png / without-glass.png
• (optional) LIQUIDGLASS_README_SCREENSHOTS_DIR=./docs/screenshots dotnet test LiquidGlassAvaloniaUI.Tests/LiquidGlassAvaloniaUI.Tests.csproj -c Release --filter FullyQualifiedName~ReadmeScreenshotGenerator to (re)generate the screenshots above

📖 Usage

• LiquidGlassSurface - A ContentControl that draws the liquid-glass pipeline behind its child and clips to CornerRadius.
• LiquidGlassInteractiveSurface - Adds press/drag deformation + interactive highlight.

💡 Reflection

Developing this project has made me realize that AvaloniaUI is still relatively immature when it comes to high-end visual effects.

While the framework offers impressive cross-platform capabilities, there is still a significant gap in providing a "mature and seamless" experience for low-level rendering pipelines and advanced shader integration. Achieving these effects often requires fighting with the underlying APIs rather than working with the framework itself, highlighting the ongoing tension between flexibility and out-of-the-box usability in the current ecosystem.

🙏 Credits

• Inspired by liquid-glass-react
• Thanks to Kyant0/AndroidLiquidGlass
• Assisted by OpenAI Codex (GPT-5.2)

📄 License

MIT License - see LICENSE file for details.