ios – Add custom Liquid Glass navigation view like App Store Connect app?

Regarding the first point:

The chips have some weird background color

The background is the translucent effect that you get with .regular glass, which is the default. There is also a shadow effect with this kind of glass.

To make the items more transparent, try using .clear glass instead. There is no shadow effect with clear glass either. If you are intending to add tap gestures to the items, you might want to make the glass interactive too:

.glassEffect(.clear.interactive())

Regarding the second point:

Scrolling the list up makes it fade out below the navigation, but the chips are not taken into account

If you want the fade effect to start behind your glassy items, you just need to change it from .safeAreaInset to .safeAreaBar. The documentation has a discussion:

Similar to the safeAreaInset(edge:alignment:spacing:content:) modifier, the content view is anchored to the specified horizontal edge of the parent view and its width insets the safe area.

Additionally, it extends the edge effect of any scroll views affected by the inset safe area.

.safeAreaBar(edge: .top) {
    ScrollView(.horizontal) {
        // ...
    }
}