Hello, I've been messing with this for some time but i'm not making progress.

I have the form below, which is embedded in another VStack. The background of the parent Vstack is Red and it displays as expected.

However this form is displayed with a White background even though I explicity state it should be Red (yes, no need to comment on the colors chosen, it just for testing purposes :) )

I want the back ground of the form below to be Red

                                VStack {
                                    Form {
                                        Text("Token")
                                            .font(.system(size: 19, weight: .light, design: .rounded))
                                        TextField("Token", text: $settingsToken)
                                            .textFieldStyle(OvalTextFieldStyle())
                                            .font(.system(size: 19, weight: .regular, design: .rounded))
                                            .foregroundColor(.black)
                                            .disableAutocorrection(true)
                                            .autocapitalization(.none)
                                            .listRowSeparator(.hidden)

                                        Text("User")
                                            .font(.system(size: 19, weight: .light, design: .rounded))
                                        TextField("User", text: $settingsUser)
                                            .textFieldStyle(OvalTextFieldStyle())
                                            .font(.system(size: 19, weight: .regular, design: .rounded))
                                            .foregroundColor(.black)
                                            .disableAutocorrection(true)
                                            .autocapitalization(.none)
                                            .listRowSeparator(.hidden)

                                        Text("Slug")
                                            .font(.system(size: 19, weight: .light, design: .rounded))
                                        TextField("Slug", text: $settingsSlug)
                                            .textFieldStyle(OvalTextFieldStyle())
                                            .font(.system(size: 19, weight: .regular, design: .rounded))
                                            .foregroundColor(.black)
                                            .disableAutocorrection(true)
                                            .autocapitalization(.none)
                                            .listRowSeparator(.hidden)
                                    }
                                    .background(Color.red)

                                }
                                .background(Color.red)

See here for a screen shot.

https://imgur.com/a/d58OhVs

What do I misunderstand about using colors and forms?

Thank you!!

Hi, just add .scrollContentBackground(.hidden) to your Form

Thank you @ygeras, thats progress. After adding I still see the background of the form in white, new scree shot below.

                                VStack {
                                    Form {
                                        Text("Token")
                                            .font(.system(size: 19, weight: .light, design: .rounded))
                                        TextField("Token", text: $settingsToken)
                                            .textFieldStyle(OvalTextFieldStyle())
                                            .font(.system(size: 19, weight: .regular, design: .rounded))
                                            .foregroundColor(.black)
                                            .disableAutocorrection(true)
                                            .autocapitalization(.none)
                                            .listRowSeparator(.hidden)
                                        Text("User")
                                            .font(.system(size: 19, weight: .light, design: .rounded))
                                        TextField("User", text: $settingsUser)
                                            .textFieldStyle(OvalTextFieldStyle())
                                            .font(.system(size: 19, weight: .regular, design: .rounded))
                                            .foregroundColor(.black)
                                            .disableAutocorrection(true)
                                            .autocapitalization(.none)
                                            .listRowSeparator(.hidden)

                                        Text("Slug")
                                            .font(.system(size: 19, weight: .light, design: .rounded))
                                        TextField("Slug", text: $settingsSlug)
                                            .textFieldStyle(OvalTextFieldStyle())
                                            .font(.system(size: 19, weight: .regular, design: .rounded))
                                            .foregroundColor(.black)
                                            .disableAutocorrection(true)
                                            .autocapitalization(.none)
                                            .listRowSeparator(.hidden)
                                    }
                                    .scrollContentBackground(.hidden)
                                }

https://imgur.com/a/OXsG6BW