How can I adjust the size of an image in a SwiftUI tabItem?

Question

I want to use custom images/icons in my TabView, but when I use a custom image instead of a system image, the image is too large. I've tried to adjust via .frame but it seems to have no effect. I've also tried to resize the photo itself before using it, but it results in poor quality.

Below, you can see my tabItem and the things inside that I've tried. The problem that my image is full size when rendered and I can't get it to shrink down to proper size.
(.frame seems to work fine anywhere else except inside the tabItem)

import SwiftUI

struct ContentView: View {
    @State var selectedMeasurementSystem = UserDefaults.standard.integer(forKey: "selectedMeasurementSystem")

    var body: some View {
        TabView {
            NearEarthObjectsUI(selectedMeasurementSystem: selectedMeasurementSystem)
            .tabItem {
                Image("asteroid").frame(width: 30, height: 30)
                //Image("asteroid").resizable().frame(width: 30, height: 30)
                //Label("NEOs", image: "asteroid")
                //Label("NEOs", image: "asteroid").frame(width: 40, height: 40)
            }
        }.accentColor(.white)
    }
}

Answer 1

You may need to call the resizable modifier on the Image.

Image("cat")
  .resizable() 
  .frame(width: 100, height: 100)