swiftui list with custom image header

I want to set a image header for list in swiftui. The effect I want is shown in the figure below:

My code is as bellow:

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                Section() {
                    VStack() {
                        Image("HeadImage")
                            .resizable()
                            .frame(width: 50, height: 50)
                        Text("Test word")
                            .foregroundColor(Color.red)
                    }
                    .frame(minWidth: 0, maxWidth: .infinity)
                    .frame(height: 150)
                }
                ForEach((0..<4), id: \.self) { index in
                    Section {
                        NavigationLink(destination: Text("aaa")) {
                            Label("Buttons", systemImage: "capsule")
                        }
                        NavigationLink(destination: Text("aaa")) {
                            Label("Colors", systemImage: "paintpalette")
                        }
                        NavigationLink(destination: Text("aaa")) {
                            Label("Controls", systemImage: "slider.horizontal.3")
                        }
                    }
                }
            }
            .navigationBarTitle("SwiftUI")
            .navigationBarTitleDisplayMode(.inline)
        }
        .accentColor(.accentColor)
    }
}

The result is as bellow, the header view has a white background:

I find a method to set the image row backgroud color as bellow:

import SwiftUI

struct ContentView: View {
    var body: some View {
        NavigationView {
            List {
                Section() {
                    VStack() {
                        Image("HeadImage")
                            .resizable()
                            .frame(width: 50, height: 50)
                        Text("Test word")
                            .foregroundColor(Color.red)
                        
                    }
                    .frame(minWidth: 0, maxWidth: .infinity)
                    .frame(height: 150)
                    .listRowInsets(EdgeInsets())
                    // rgb get from screenshot of List in Sketch
                    .background(Color(red: 242/255, green: 242/255, blue: 247/255))
                }
                ForEach((0..<4), id: \.self) { index in
                    Section {
                        NavigationLink(destination: Text("aaa")) {
                            Label("Buttons", systemImage: "capsule")
                        }
                        NavigationLink(destination: Text("aaa")) {
                            Label("Colors", systemImage: "paintpalette")
                        }
                        NavigationLink(destination: Text("aaa")) {
                            Label("Controls", systemImage: "slider.horizontal.3")
                        }
                    }
                }
            }
            .navigationBarTitle("SwiftUI")
            .navigationBarTitleDisplayMode(.inline)
        }
        .accentColor(.accentColor)
    }
}

This can make the image row to same background color with the List.

But this way is to set a fixed color, which is the RGB value of the background color of the List obtained by using the color finder in Sketch. It is not a very beautiful method. Is there a more elegant way to set the background color of the image row to be the same as the background color of the List?