Equalizer

// Equalizer · syxUI · https://syxui.dev/components/media2-equalizer
// Free in any project. Keep this line and credit syxUI where a person can read it.

import SwiftUI

let medGreen = Color(red: 0.16, green: 0.66, blue: 0.40)

// Equalizer / visualizer
struct EqualizerCard: View {
    let heights: [CGFloat] = [20, 40, 28, 52, 34, 48, 24, 44, 30, 50, 26, 42]
    var body: some View {
        VStack(spacing: 14) {
            HStack { VStack(alignment: .leading, spacing: 2) { Text("Now Playing").font(.system(size: 12)).foregroundStyle(.white.opacity(0.6)); Text("Midnight City").font(.system(size: 16, weight: .bold)).foregroundStyle(.white) }; Spacer(); Image(systemName: "pause.fill").font(.system(size: 18)).foregroundStyle(.white) }
            HStack(alignment: .center, spacing: 4) {
                ForEach(Array(heights.enumerated()), id: \.offset) { _, h in Capsule().fill(medGreen).frame(width: 5, height: h) }
            }.frame(height: 52)
        }.padding(18).frame(width: 300).background(Color(red: 0.10, green: 0.11, blue: 0.16), in: RoundedRectangle(cornerRadius: 18, style: .continuous))
    }
}