diff --git a/modules/bar/#Bat.qml# b/modules/bar/#Bat.qml#
new file mode 100644
index 0000000..0609f3f
--- /dev/null
+++ b/modules/bar/#Bat.qml#
@@ -0,0 +1,58 @@
+import Quickshell.Services.UPower
+import QtQuick
+import QtQuick.Layouts
+import QtQuick.Effects
+import qs
+import qs.widgets
+import qs.settings
+
+Rectangle {
+    id: root
+    layer.enabled: true
+    layer.effect: MultiEffect {
+        id: dropShadow
+        source: root
+        shadowEnabled: true
+        shadowHorizontalOffset: 4
+        shadowVerticalOffset: 2
+        shadowOpacity: 0.5
+        shadowColor: "#020202"
+    }
+    clip: true
+    color: Colors.moduleBg
+    visible: UPower.displayDevice.isLaptopBattery
+    property double percent: UPower.displayDevice.percentage * 100
+    property bool hasBattery: UPower.displayDevice.isLaptopBattery
+    property bool charging: UPower.displayDevice.state === UPowerDeviceState.Charging
+    required property double moduleHeight
+    implicitHeight: moduleHeight
+    implicitWidth: batLayout.implicitWidth + 16
+    radius: Config.rounding
+
+    function batteryIcon(percent, charging) {
+        if (charging)
+            return "battery_android_frame_bolt";
+        if (percent <= 15)
+            return "battery_android_alert";
+        if (percent <= 30)
+            return "battery_android_frame_2";
+        if (percent <= 50)
+            return "battery_android_frame_3";
+        if (percent <= 70)
+            return "battery_android_frame_4";
+        if (percent <= 85)
+            return "battery_android_frame_5";
+        if (percent <= 95)
+            return "battery_android_frame_full";
+q    }
+    RowLayout {
+        id: batLayout
+        anchors.centerIn: root
+        MaterialIcon {
+            text: root.batteryIcon(root.percent, root.charging)
+        }
+        StyledText {
+            text: Math.floor(root.percent) + "%"
+        }
+    }
+}
diff --git a/modules/bar/Bat.qml b/modules/bar/Bat.qml
index f47b0ca..7d8c92d 100644
--- a/modules/bar/Bat.qml
+++ b/modules/bar/Bat.qml
@@ -29,8 +29,8 @@ Rectangle {
     implicitWidth: batLayout.implicitWidth + 16
     radius: Config.rounding
 
-    function batteryIcon(percent, charging) {
-        if (charging)
+    function batteryIcon(percent) {
+        if (root.charging)
             return "battery_android_frame_bolt";
         if (percent <= 15)
             return "battery_android_alert";
@@ -42,14 +42,14 @@ Rectangle {
             return "battery_android_frame_4";
         if (percent <= 85)
             return "battery_android_frame_5";
-        if (percent <= 95)
+        if (percent <= 100)
             return "battery_android_frame_full";
     }
     RowLayout {
         id: batLayout
         anchors.centerIn: root
         MaterialIcon {
-            text: root.batteryIcon(root.percent, root.charging)
+            text: root.batteryIcon(root.percent)
         }
         StyledText {
             text: Math.floor(root.percent) + "%"