diff --git a/imports/Spectral/Component/Avatar.qml b/imports/Spectral/Component/Avatar.qml
index b9e516875..4df6a3f8f 100644
--- a/imports/Spectral/Component/Avatar.qml
+++ b/imports/Spectral/Component/Avatar.qml
@@ -7,6 +7,7 @@ import Spectral.Setting 0.1
 Item {
     property string hint: "H"
     property string source: ""
+    property color color: MPalette.accent
     readonly property url realSource: source ? "image://mxc/" + source : ""
 
     id: root
@@ -38,7 +39,7 @@ Item {
         visible: !realSource || image.status != Image.Ready
 
         radius: height / 2
-        color: MPalette.accent
+        color: root.color
         antialiasing: true
 
         Label {
@@ -47,22 +48,9 @@ Item {
             color: "white"
             text: hint[0].toUpperCase()
             font.pixelSize: root.width / 2
-            font.weight: Font.Light
+            font.weight: Font.Medium
             horizontalAlignment: Text.AlignHCenter
             verticalAlignment: Text.AlignVCenter
         }
     }
-
-//    function stringToColor(str) {
-//        var hash = 0;
-//        for (var i = 0; i < str.length; i++) {
-//            hash = str.charCodeAt(i) + ((hash << 5) - hash);
-//        }
-//        var colour = '#';
-//        for (var j = 0; j < 3; j++) {
-//            var value = (hash >> (j * 8)) & 0xFF;
-//            colour += ('00' + value.toString(16)).substr(-2);
-//        }
-//        return colour;
-//    }
 }
diff --git a/imports/Spectral/Component/Timeline/StateDelegate.qml b/imports/Spectral/Component/Timeline/StateDelegate.qml
index 7f4453c01..6db382767 100644
--- a/imports/Spectral/Component/Timeline/StateDelegate.qml
+++ b/imports/Spectral/Component/Timeline/StateDelegate.qml
@@ -29,6 +29,7 @@ Control {
 
                     hint: author.displayName
                     source: author.avatarMediaId
+                    color: Qt.darker(author.color, 1.1)
                 }
 
                 Label {
diff --git a/imports/Spectral/Panel/RoomPanelInput.qml b/imports/Spectral/Panel/RoomPanelInput.qml
index 044a7d5d3..256f9dd46 100644
--- a/imports/Spectral/Panel/RoomPanelInput.qml
+++ b/imports/Spectral/Panel/RoomPanelInput.qml
@@ -61,7 +61,7 @@ Control {
 
                 background: Rectangle {
                     radius: height / 2
-                    color: replyUser ? replyUser.color : MPalette.accent
+                    color: replyUser ? Qt.darker(replyUser.color, 1.1) : MPalette.accent
                 }
 
                 contentItem: RowLayout {
@@ -135,22 +135,22 @@ Control {
                 readonly property bool highlighted: autoCompleteListView.currentIndex === index
 
                 height: 36
-                padding: 8
+                padding: 6
 
                 background: Rectangle {
                     visible: !isEmoji
-                    color: highlighted ? Material.accent : "transparent"
-                    border.color: Material.accent
+                    color: highlighted ? border.color : "transparent"
+                    border.color: isEmoji ? Material.accent : modelData.color
                     border.width: 2
                     radius: height / 2
                 }
 
-                contentItem: Row {
-                    spacing: 4
+                contentItem: RowLayout {
+                    spacing: 6
 
                     Text {
-                        width: 20
-                        height: 20
+                        width: 24
+                        height: 24
                         visible: isEmoji
                         text: autoCompleteText
                         font.pixelSize: 24
@@ -158,18 +158,24 @@ Control {
                         verticalAlignment: Text.AlignVCenter
                         horizontalAlignment: Text.AlignHCenter
                     }
+
                     Avatar {
-                        width: 20
-                        height: 20
+                        Layout.preferredWidth: 24
+                        Layout.preferredHeight: 24
+
                         visible: !isEmoji
                         source: modelData.avatarMediaId || null
+                        color: modelData.color ? Qt.darker(modelData.color, 1.1) : MPalette.accent
                     }
+
                     Label {
-                        height: parent.height
+                        Layout.fillHeight: true
+
                         visible: !isEmoji
                         text: autoCompleteText
-                        color: highlighted ? "white" : Material.accent
+                        color: highlighted ? "white" : MPalette.foreground
                         verticalAlignment: Text.AlignVCenter
+                        rightPadding: 8
                     }
                 }