Badge with Symbol & Palette Rendering

import SwiftUI

struct UseBadgeWSymbolPaletteRendering: View {
    
    var body: some View {
        HStack {
            BadgeWSymbolPaletteRendering(title: "Weather", symbol: "cloud.sun.rain.fill", firstColor: .white, secondColor: .yellow, thirdColor: .blue)
        }
    }
}

#Preview {
    UseBadgeWSymbolPaletteRendering()
}

struct BadgeWSymbolPaletteRendering: View {
    
    var title: String
    var symbol: String
    var firstColor: Color
    var secondColor: Color
    var thirdColor: Color
    
    var body: some View {
        HStack(alignment: .center, spacing: 8) {
            Image(systemName: symbol)
                .font(.system(size: 20, weight: .regular))
                .symbolRenderingMode(.palette)
                .foregroundStyle(firstColor, secondColor, thirdColor)
            Text(title)
                .foregroundStyle(.primary)
        }
        .font(.system(size: 15, weight: .medium))
        .padding(.vertical, 8)
        .padding(.horizontal, 12)
        .background(.thinMaterial, in: RoundedRectangle(cornerRadius: 12.0, style: .continuous))
    }
}