Greetings, traveler!

At WWDC 2025, Apple introduced a new UI design philosophy, highlighted by the glass effect. This approach delivers a visually striking aesthetic, moving beyond traditional button backgrounds to create an immersive user experience. The glass effect, characterized by its translucent and reflective qualities, adds depth and sophistication to iOS interfaces.

However, the adoption of this effect has raised concerns among some users and developers regarding text visibility on glass-effect elements. Given Apple’s longstanding commitment to accessibility, it is evident that this issue is a priority. The company has implemented solutions to ensure text remains legible across diverse backgrounds, making the glass effect both visually appealing and functional.

One such solution is the use of the .tint(.primary) modifier in SwiftUI, which automatically adjusts text color to maintain contrast and readability, regardless of the underlying background. When applied to buttons styled with .buttonStyle(.glass), this modifier ensures that text remains clear and accessible, adapting dynamically to the background’s color and intensity.

Below is an example demonstrating how to implement a glass-effect button with adaptive text visibility in SwiftUI:

import SwiftUI

import SwiftUI

struct ContentView: View {
    @State private var position1 = CGPoint(x: 100, y: 100)
    @State private var position2 = CGPoint(x: 200, y: 200)
    
    var body: some View {
        VStack {
            Circle()
                .fill(.black)
                .frame(height: 200)
                .position(position2)
                .gesture(
                    DragGesture()
                        .onChanged { value in
                            position2 = value.location
                        }
                )
            
            Button("Hello!") {}
                .tint(.primary)
                .buttonStyle(.glass)
                .zIndex(1)
            
            Circle()
                .fill(.white)
                .frame(height: 200)
                .position(position1)
                .gesture(
                    DragGesture()
                        .onChanged { value in
                            position1 = value.location
                        }
                )
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity)
        .background(.purple)
    }
}

This code creates a SwiftUI view with a glass-effect button placed between two draggable circles, one black and one white, set against a purple background. The .tint(.primary) modifier ensures the button’s text remains legible as the circles move, demonstrating the adaptability of the glass effect in dynamic scenarios.

Conclusion

By leveraging Apple’s accessibility-focused tools like .tint(.primary), developers can confidently adopt the glass effect, ensuring both aesthetic appeal and usability in their applications.