diff --git a/client/ui/qml/Controls2/CheckBoxType.qml b/client/ui/qml/Controls2/CheckBoxType.qml
index 1cd46143..c547a8e4 100644
--- a/client/ui/qml/Controls2/CheckBoxType.qml
+++ b/client/ui/qml/Controls2/CheckBoxType.qml
@@ -1,10 +1,24 @@
 import QtQuick
 import QtQuick.Controls
 import QtQuick.Layouts
+import Qt5Compat.GraphicalEffects
 
 Item {
     id: root
 
+    property string hoveredColor: Qt.rgba(255, 255, 255, 0.05)
+    property string defaultColor: "transparent"
+    property string pressedColor: Qt.rgba(255, 255, 255, 0.05)
+
+    property string defaultBorderColor: "#D7D8DB"
+    property string checkedBorderColor: "#FBB26A"
+
+    property string checkedImageColor: "#FBB26A"
+    property string hoveredImageColor: "#A85809"
+    property string defaultImageColor: "transparent"
+
+    property string imageSource: "qrc:/images/controls/check.svg"
+
     implicitWidth: content.implicitWidth
     implicitHeight: content.implicitHeight
 
@@ -23,22 +37,35 @@ Item {
                 id: indicator
                 anchors.verticalCenter: checkBox.verticalCenter
                 anchors.horizontalCenter: checkBox.horizontalCenter
-                source: checkBox.checked ? "qrc:/images/controls/check.svg" : ""
+                ColorOverlay {
+                    id: imageColor
+                    anchors.fill: indicator
+                    source: indicator
+                }
             }
+
             Rectangle {
+                id: imageBorder
+
                 anchors.verticalCenter: checkBox.verticalCenter
                 anchors.horizontalCenter: checkBox.horizontalCenter
                 width: 24
                 height: 24
                 color: "transparent"
-                border.color: "#FBB26A"
+                border.color: checkBox.checked ? checkedBorderColor : defaultBorderColor
                 border.width: 1
                 radius: 4
             }
+
             background: Rectangle {
-                id: background
-                color: Qt.rgba(255, 255, 255, 0.05)
+                id: checkBoxBackground
                 radius: 16
+
+                color: "transparent"
+
+                Behavior on color {
+                    PropertyAnimation { duration: 200 }
+                }
             }
         }
 
@@ -70,8 +97,27 @@ Item {
     MouseArea {
         anchors.fill: parent
         cursorShape: Qt.PointingHandCursor
+        hoverEnabled: true
+
+        onEntered: {
+            checkBoxBackground.color = hoveredColor
+        }
+
+        onExited: {
+            checkBoxBackground.color = defaultColor
+        }
+
+        onPressedChanged: {
+            indicator.source = pressed ? imageSource : ""
+            imageColor.color = pressed ? hoveredImageColor : defaultImageColor
+            checkBoxBackground.color = pressed ? pressedColor : entered ? hoveredColor : defaultColor
+        }
+
         onClicked: {
             checkBox.checked = !checkBox.checked
+            indicator.source = checkBox.checked ? imageSource : ""
+            imageColor.color = checkBox.checked ? checkedImageColor : defaultImageColor
+            imageBorder.border.color = checkBox.checked ? checkedBorderColor : defaultBorderColor
         }
     }
 }