How to achieve this vibrant background effect on iOS?

Question

Created 21h

Replies 2

Boosts 0

Participants 2

Hi everyone,

I'm trying to reproduce an effect that Apple has created for the Contacts app on iOS, iPadOS and MacOS v26.4 where the contact card is displayed with a nice material frosted background that blends well with the underlying background.

Simulator Screenshot - iPhone 17 Pro Max - 2026-05-02 at 16.57.58.png

I love this effect and I want to use it in my app to display different information. As you can see in the screenshot, the list rows have a frosted background (probably thinMaterial) combined with a vibrant effect that adapts to the underlying view background. Additionally, the fields labels and icons also have a nice effect.

I've tried everything but I'm unable to accurately recreate this effect. I tried applying a Rectangle with a material background listRowBackground but this resulted in something different than what Apple is using (either too light, too dark, or simply not vibrant).

I've even tried SwiftUIVisualEffects swift package which can apply a vibrancy effect. However the result is still not the same as the one you see in the screenshot, with the correct contrast between background and labels.

Any guidance would be appreciated. Thank you 🙏🏻

Boost

Answer 1

darkpaw OP

14h

I hope that's test data and you haven't actually posted someone's private details on the internet...

0

Answer 2

darkpaw OP

13h

Good, now what have you actually tried? Show us some code.

Is it the background of the data fields you want to get, i.e. the rounded rectangle boxes on top of the large AH background?

It looks like some sort of simple gradient. What have you tried?

0