diff --git a/TheNoiseClock/Views/Clock/Components/BatteryOverlayView.swift b/TheNoiseClock/Views/Clock/Components/BatteryOverlayView.swift
index 1c85b42..43ffcf4 100644
--- a/TheNoiseClock/Views/Clock/Components/BatteryOverlayView.swift
+++ b/TheNoiseClock/Views/Clock/Components/BatteryOverlayView.swift
@@ -20,9 +20,11 @@ struct BatteryOverlayView: View {
     // MARK: - Body
     var body: some View {
         let clamped = ColorUtils.clampOpacity(opacity)
+        let batteryIcon = getBatteryIcon()
+        let batteryColor = getBatteryColor()
         
-        Label("\(batteryLevel)%", systemImage: "bolt.circle")
-            .foregroundColor(color)
+        Label("\(batteryLevel)%", systemImage: batteryIcon)
+            .foregroundColor(batteryColor)
             .opacity(clamped)
             .font(.callout.weight(.semibold))
             .onAppear {
@@ -36,6 +38,54 @@ struct BatteryOverlayView: View {
     }
     
     // MARK: - Private Methods
+    private func getBatteryIcon() -> String {
+        #if canImport(UIKit)
+        let batteryState = UIDevice.current.batteryState
+        
+        // Check if device is charging
+        if batteryState == .charging {
+            return "bolt.circle.fill"
+        }
+        #endif
+        
+        // Return battery icon based on level
+        switch batteryLevel {
+        case 75...100:
+            return "battery.100"
+        case 50..<75:
+            return "battery.75"
+        case 25..<50:
+            return "battery.50"
+        case 10..<25:
+            return "battery.25"
+        default:
+            return "battery.0"
+        }
+    }
+    
+    private func getBatteryColor() -> Color {
+        #if canImport(UIKit)
+        let batteryState = UIDevice.current.batteryState
+        
+        // Green when charging
+        if batteryState == .charging {
+            return .green
+        }
+        #endif
+        
+        // Color based on battery level
+        switch batteryLevel {
+        case 50...100:
+            return .green
+        case 20..<50:
+            return .yellow
+        case 10..<20:
+            return .orange
+        default:
+            return .red
+        }
+    }
+    
     private func enableBatteryMonitoring() {
         #if canImport(UIKit)
         UIDevice.current.isBatteryMonitoringEnabled = true
diff --git a/TheNoiseClock/Views/Clock/Components/TopOverlayView.swift b/TheNoiseClock/Views/Clock/Components/TopOverlayView.swift
index d13542e..374fe7b 100644
--- a/TheNoiseClock/Views/Clock/Components/TopOverlayView.swift
+++ b/TheNoiseClock/Views/Clock/Components/TopOverlayView.swift
@@ -18,16 +18,16 @@ struct TopOverlayView: View {
     
     // MARK: - Body
     var body: some View {
-        HStack(spacing: UIConstants.Spacing.large) {
-            if showBattery {
-                BatteryOverlayView(color: color, opacity: opacity)
-            }
-            
+        HStack {
             if showDate {
                 DateOverlayView(color: color, opacity: opacity)
             }
             
             Spacer()
+            
+            if showBattery {
+                BatteryOverlayView(color: color, opacity: opacity)
+            }
         }
         .padding(.horizontal, UIConstants.Spacing.medium)
         .padding(.vertical, UIConstants.Spacing.small)