diff --git a/config/Dimensions.qml b/config/Dimensions.qml
index d768bf8..9c5c094 100644
--- a/config/Dimensions.qml
+++ b/config/Dimensions.qml
@@ -13,6 +13,7 @@ Singleton {
     property Clock clock: Clock {}
     property Pipewire pipewire: Pipewire {}
     property Storage storage: Storage {}
+    property Cpu cpu: Cpu {}
     property Caffeine caffeine: Caffeine {}
     property Workspace workspace: Workspace {}
     property Tray tray: Tray {}
@@ -67,6 +68,16 @@ Singleton {
         property int verticalPadding: 6
     }
 
+    component Cpu: QtObject {
+        id: clock
+
+        property int iconSize: 14
+        property int fontSize: 14
+        property int height: 30
+        property int horizontalPadding: 8
+        property int verticalPadding: 6
+    }
+
     component Caffeine: QtObject {
         id: clock
 
diff --git a/constants/Icons.qml b/constants/Icons.qml
index 7c947e6..22e6268 100644
--- a/constants/Icons.qml
+++ b/constants/Icons.qml
@@ -5,6 +5,7 @@ import Quickshell
 Singleton {
     property string brickWall: "\u{E586}"
     property string coffee: "\u{E09a}"
+    property string cpu: "\u{E0ad}"
     property string hardDrive: "\u{E0f1}"
     property string triangle: "\u{E192}"
     property string triangleDashed: "\u{E642}"
diff --git a/modules/bar/Bar.qml b/modules/bar/Bar.qml
index 17d043e..db9ea4a 100644
--- a/modules/bar/Bar.qml
+++ b/modules/bar/Bar.qml
@@ -108,6 +108,10 @@ Scope {
                     anchors.verticalCenter: parent.verticalCenter
                 }
 
+                Cpu {
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
                 Clock {
                     anchors.verticalCenter: parent.verticalCenter
                 }
diff --git a/modules/bar/components/Cpu.qml b/modules/bar/components/Cpu.qml
new file mode 100644
index 0000000..d6be494
--- /dev/null
+++ b/modules/bar/components/Cpu.qml
@@ -0,0 +1,65 @@
+import QtQuick
+import Quickshell
+import "../../../config/"
+import "../../../constants/"
+import "../../../services/"
+import "../../../styled/"
+import "../../../utils/"
+
+Clickable {
+    id: root
+
+    property bool showTemp: true
+
+    implicitWidth: row.width
+    implicitHeight: Dimensions.storage.height
+
+    Ref {
+        service: SystemInfo
+    }
+
+    onClicked: {
+        root.showTemp = !root.showTemp;
+    }
+
+    Row {
+        id: row
+        StyledText {
+            id: icon
+
+            font.family: Theme.lucide.font.family
+            font.pixelSize: Dimensions.storage.iconSize
+            font.bold: true
+            text: Icons.cpu
+
+            anchors.verticalCenter: parent.verticalCenter
+            topPadding: Dimensions.storage.verticalPadding
+            bottomPadding: Dimensions.storage.verticalPadding
+            leftPadding: Dimensions.storage.horizontalPadding
+        }
+
+        StyledText {
+            id: text
+            anchors.verticalCenter: parent.verticalCenter
+            topPadding: Dimensions.storage.verticalPadding
+            bottomPadding: Dimensions.storage.verticalPadding
+            rightPadding: Dimensions.storage.horizontalPadding
+
+            font.pixelSize: Dimensions.storage.fontSize
+
+            text: ` ${(SystemInfo.cpuPerc * 100).toFixed()}%`
+
+            states: [
+                State {
+                    name: "temp"
+                    when: root.showTemp
+                    PropertyChanges {
+                        text {
+                            text: ` ${(SystemInfo.cpuTemp)}℃`
+                        }
+                    }
+                }
+            ]
+        }
+    }
+}