Liquid Glass Visual Design

import SwiftUI

struct LiquidGlassDemoView: View {
    let items = ["Spatial Audio", "Adaptive Lenses", "Neural Engine", "ProMotion Display", "Always-On Sensor"]

    var body: some View {
        ZStack {
            // Vivid background so the glass refraction is visible
            LinearGradient(
                colors: [.purple, .indigo, .cyan, .mint],
                startPoint: .topLeading,
                endPoint: .bottomTrailing
            )
            .ignoresSafeArea()

            ScrollView {
                VStack(spacing: 16) {
                    ForEach(items, id: \.self) { item in
                        GlassCard(title: item)
                    }
                }
                .padding()
            }
        }
    }
}

struct GlassCard: View {
    let title: String

    var body: some View {
        HStack {
            Image(systemName: "sparkles")
                .font(.title2)
                .foregroundStyle(.white)
            Text(title)
                .font(.headline)
                .foregroundStyle(.white)
            Spacer()
            Image(systemName: "chevron.right")
                .foregroundStyle(.white.opacity(0.7))
        }
        .padding()
        // iOS 27: apply Liquid Glass material to a custom view
        .glassEffect()
        .clipShape(RoundedRectangle(cornerRadius: 16))
    }
}

#Preview {
    LiquidGlassDemoView()
}