Shu recreated the Liquid Glass effect by using an SVG displacement filter and shaders. See the demo or paste the script into any website console. This seems to be the most flexible and customizable recreation, but unfortunately it also only works in Chrome.

Allan Yu imitates the Liquid Glass effect in Figma by using the new texture feature in Figma Draw. A few other takes using similar techniques by Camden, Luis Ouriach, Brett from Designjoy, Max, and Ben South — some are with the Figma files as well.

Of course, the elephant in the room is the sneak peek by Figma that native Liquid Glass support is coming soon.

Apple slightly updated the corner rounding of their icon template. Time to update all the icons!

John LePore explains refraction — light passes from one material to the next — for non-3D designers.

“Dive deeper into the new design system to explore key changes to visual design, information architecture, and core system components. Learn how the system reshapes the relationship between interface and content, enabling you to create designs that are dynamic, harmonious, and consistent across devices, screen sizes, and input modes.”

Apple updated HIG with all the latest design techniques.

Apple Keynote introducing new Liquid Glass design language, year-based version names, Foundation Models API, and significant updates to iPadOS.

WWDC session introducing Liquid Glass. ​“Get to know the design principles of Liquid Glass, explore its core optical and physical properties, and learn where to use it and why.”

Speaking of Apple, the latest winners of the Design Award were announced. Congrats to Play for winning the Innovation award!

Sebastiaan de With is the co-founder and designer of the award-winning apps Halide and Kino for photography and video. In this article, he imagines what could be next for the UI design at Apple: ​“What would I do if I were Apple’s design team? What changes would I like to see, and what do I think is likely? Considering where technology is going, how do I think interface design should change to accommodate?”

(Reminder that WWDC25 is happening this week, with a keynote on Monday at 10 AM PT. That’s when we’ll find out how close his predictions are to what Apple designers have in mind.)

Apple’s SF Pro and SF Compact fonts are now automatically downloaded in Figma Editor, Slides, and Buzz.

Apple updated their iOS 18 UI kit to include iPhone 16 Pro bezels (in all colors), updated templates to match new display dimensions, and several other bug fixes and improvements.

Apple added nine new design templates for Figma: Apple Pay, App Clips, Live Activities, iMessage apps and sticker packs, Sign in with Apple, App Shortcuts, Tap to Pay, Tip Kit, and Wallet. See also Apple Design Resourcesin the Developer Center.

Mike Rundle points out interesting implementation details in the Apple Design Resources – visionOS file.

“Apple’s initial visionOS design kit for Figma contains a comprehensive set of UI components, views, system interfaces, text styles, color styles, and materials. All of the core ingredients you need to quickly create highly realistic visionOS app designs.” See also Designing for visionOS at Apple Design Resources.

First the iOS kit, and now the official design library and templates for macOS Sonoma from Apple!

Big day for the Figma community! After years of making official design resources only for Sketch, Adobe XD, and Photoshop (!), Apple finally launched a Figma community page and published a UI kit for iOS 17 and iPadOS 17. (Interestingly, this seems to be the first community resource requiring accepting Terms of Service before opening.)

Let’s use this opportunity to thank Joey Banks for his community service in building many iOS kits over the years, starting with iOS 13!

Free virtual try-on for the Vision Pro, because let’s be fair — we all need one now.

Zander with just-in-time tips on creating a spatial UI for Vision Pro, supafast!