Button grayed out in toolbar initially

Question

I have a SwiftUI macOS application, and I noticed that when you have a button in a toolbar , its image is initially grayed out until you hover over or click it.

I am using macOS Montery Beta 3, and Xcode 13 Beta 3.

Simple Reproduction

1. Create a new SwiftUI macOS project
2. Paste the following code:

struct ContentView: View {
    var body: some View {
        NavigationView {
            Text("Panel1").padding()
                .toolbar {
                    Button(action: {}) {
                        Image(systemName: "plus")
                    }
                }
            Text("Panel2").padding()
        }
    }
}

3. Run the application, and you should see that the plus button is grayed out. However hovering over or clicking it makes the button not gray.

This question is very similar to this , but instead with a toolbar .

Whats happening here?

Answer 1

I had the same issue and discovered that you need to specify the color explicitly.

.toolbar {
    Button(action: {}) {
        Image(systemName: "plus")
    }
    Button(action: {}) {
        Image(systemName: "plus")
            .foregroundColor(.white)
    }
}