diff --git a/js/util.js b/js/util.js
index fcd0e97..6b0ade3 100644
--- a/js/util.js
+++ b/js/util.js
@@ -1,18 +1,5 @@
 .pragma library
 
-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;
-}
-
 function pushToStack(stack, page) {
     if(page && stack.currentItem !== page) {
         if(stack.depth === 1) {
diff --git a/qml/Setting.qml b/qml/Setting.qml
index 6774ffb..d9e953d 100644
--- a/qml/Setting.qml
+++ b/qml/Setting.qml
@@ -54,7 +54,6 @@ Page {
                                 height: parent.height
 
                                 hint: user.displayName
-                                defaultColor: Util.stringToColor(user.displayName)
                                 image: user.avatar
                             }
 
diff --git a/qml/component/EmojiButton.qml b/qml/component/EmojiButton.qml
index dc3873e..0c5c87d 100644
--- a/qml/component/EmojiButton.qml
+++ b/qml/component/EmojiButton.qml
@@ -11,7 +11,7 @@ Text {
     verticalAlignment: Text.AlignVCenter
 
     font.pointSize: 20
-    font.family: "Noto Color Emoji"
+    font.family: "Emoji"
 
     MouseArea {
         anchors.fill: parent
diff --git a/qml/component/EmojiPicker.qml b/qml/component/EmojiPicker.qml
index f58189a..3939cbe 100644
--- a/qml/component/EmojiPicker.qml
+++ b/qml/component/EmojiPicker.qml
@@ -37,7 +37,7 @@ Popup {
                 verticalAlignment: Text.AlignVCenter
 
                 font.pointSize: 20
-                font.family: "Noto Color Emoji"
+                font.family: "Emoji"
                 text: modelData
 
                 MouseArea {
diff --git a/qml/component/MessageDelegate.qml b/qml/component/MessageDelegate.qml
index 6de039a..712fafd 100644
--- a/qml/component/MessageDelegate.qml
+++ b/qml/component/MessageDelegate.qml
@@ -31,7 +31,6 @@ RowLayout {
         round: false
         visible: avatarVisible
         hint: author.displayName
-        defaultColor: Util.stringToColor(author.displayName)
         image: author.avatar
     }
 
@@ -106,7 +105,6 @@ RowLayout {
                         height: parent.height
 
                         hint: modelData.displayName
-                        defaultColor: Util.stringToColor(modelData.displayName)
                         image: modelData.avatar
                     }
                 }
diff --git a/qml/component/RoomDrawer.qml b/qml/component/RoomDrawer.qml
index 04db9e4..8da9397 100644
--- a/qml/component/RoomDrawer.qml
+++ b/qml/component/RoomDrawer.qml
@@ -30,7 +30,6 @@ Drawer {
             Layout.alignment: Qt.AlignHCenter
 
             hint: room ? room.displayName : "No name"
-            defaultColor: Util.stringToColor(room ? room.displayName : "No name")
             image: matriqueController.safeImage(room ? room.avatar : null)
         }
 
@@ -123,7 +122,6 @@ Drawer {
                         Layout.preferredWidth: height
                         Layout.fillHeight: true
 
-                        defaultColor: Util.stringToColor(name)
                         image: avatar
                         hint: name
                     }
diff --git a/qml/form/RoomForm.qml b/qml/form/RoomForm.qml
index 99a4fa6..da45545 100644
--- a/qml/form/RoomForm.qml
+++ b/qml/form/RoomForm.qml
@@ -63,7 +63,6 @@ Item {
                             Layout.fillHeight: true
 
                             hint: currentRoom ? currentRoom.displayName : "No name"
-                            defaultColor: Util.stringToColor(currentRoom ? currentRoom.displayName : "No name")
                             image: matriqueController.safeImage(currentRoom ? currentRoom.avatar : null)
                         }
 
@@ -292,7 +291,6 @@ Item {
                                         Layout.preferredWidth: height
                                         Layout.fillHeight: true
 
-                                        defaultColor: Util.stringToColor(modelData.displayName)
                                         image: modelData.avatar
                                         hint: modelData.displayName
                                     }
diff --git a/qml/form/RoomListForm.qml b/qml/form/RoomListForm.qml
index 58d9c91..8d72919 100644
--- a/qml/form/RoomListForm.qml
+++ b/qml/form/RoomListForm.qml
@@ -164,7 +164,6 @@ Item {
                         Layout.fillHeight: true
 
                         hint: name || "No Name"
-                        defaultColor: Util.stringToColor(name || "No Name")
 
                         image: avatar
                     }
diff --git a/qml/main.qml b/qml/main.qml
index 97045c0..c25154a 100644
--- a/qml/main.qml
+++ b/qml/main.qml
@@ -128,7 +128,6 @@ ApplicationWindow {
 
                             hint: user.displayName
                             image: user.avatar
-                            defaultColor: Util.stringToColor(user.displayName)
                         }
 
                         highlightColor: matriqueController.color(user.id)
diff --git a/src/imageitem.cpp b/src/imageitem.cpp
index 95bc0f3..18e1509 100644
--- a/src/imageitem.cpp
+++ b/src/imageitem.cpp
@@ -13,7 +13,10 @@ void ImageItem::paint(QPainter *painter) {
 
   if (m_image.isNull()) {
     painter->setPen(Qt::NoPen);
-    painter->setBrush(QColor(m_color));
+    if (m_color.isEmpty())
+      painter->setBrush(QColor(stringtoColor(m_hint)));
+    else
+      painter->setBrush(QColor(m_color));
     if (m_round)
       painter->drawEllipse(0, 0, int(bounding_rect.width()),
                            int(bounding_rect.height()));
@@ -22,7 +25,7 @@ void ImageItem::paint(QPainter *painter) {
                         int(bounding_rect.height()));
     painter->setPen(QPen(Qt::white, 2));
     QFont font;
-    font.setPixelSize(bounding_rect.width() / 2);
+    font.setPixelSize(int(bounding_rect.width() / 2));
     font.setBold(true);
     painter->setFont(font);
     painter->drawText(
@@ -80,3 +83,13 @@ void ImageItem::setRound(bool value) {
     update();
   }
 }
+
+QString ImageItem::stringtoColor(QString string) {
+  int hash = 0;
+  for (int i = 0; i < string.length(); i++)
+    hash = string.at(i).unicode() + ((hash << 5) - hash);
+  QString colour = "#";
+  for (int j = 0; j < 3; j++)
+    colour += ("00" + QString::number((hash >> (j * 8)) & 0xFF, 16)).right(2);
+  return colour;
+}
diff --git a/src/imageitem.h b/src/imageitem.h
index 0d7cb39..6558ec7 100644
--- a/src/imageitem.h
+++ b/src/imageitem.h
@@ -41,8 +41,10 @@ class ImageItem : public QQuickPaintedItem {
  private:
   QImage m_image;
   QString m_hint = "H";
-  QString m_color = "#000000";
+  QString m_color;
   bool m_round = true;
+
+  QString stringtoColor(QString string);
 };
 
 #endif  // IMAGEITEM_H