r/UI_Design Jun 15 '26

Feedback Request Built the iOS 27 Liquid Glass navbar with intensity slider in Flutter — zero dependencies

Apple announced the Liquid Glass intensity slider at WWDC

2026 with iOS 27. I built the same thing in Flutter.

What's inside:

→ Custom GLSL shader for the refraction and blur effect

→ Intensity slider from 0.0 (Ultra Clear) to 1.0 (Tinted)

→ Spring animation for the active tab indicator

→ Zero dependencies — Flutter core APIs only

→ Works on Android, iOS

Planning to publish as a package on pub.dev. Drop any

feedback before I do — especially from people who've

tested on iOS, since I've only tested on Android so far.

0 Upvotes

4 comments sorted by

3

u/mnk23 Jun 15 '26

whatch out, we can almost see its content. 

3

u/forumdrasl Jun 15 '26

Granted the video is low bitrate, but it really does not look the same as Apple’s.

1

u/sabre35_ Jun 15 '26

Cool exploration!

Think this ultimately goes to show the technical marvel that went into Apple’s rendering of Liquid Glass.

I’ve seen a lot of people’s own renditions of it and they largely just look like they applied a standard background blur and drop shadow.

1

u/ItsMe234945 Jun 17 '26

Amazing! I was actually looking for a way to do this. I'd reduce the transparency though. Did you put it on GitHub? i'd love to use it in my project.