diff --git a/imports/NeoChat/Component/ChatBox/ChatBox.qml b/imports/NeoChat/Component/ChatBox/ChatBox.qml
index 7853dcdc9..f9c3b78df 100644
--- a/imports/NeoChat/Component/ChatBox/ChatBox.qml
+++ b/imports/NeoChat/Component/ChatBox/ChatBox.qml
@@ -95,9 +95,16 @@ Item {
         width: parent.width
         height: visible ? implicitHeight : 0
         anchors.bottom: replySeparator.top
-        sourceComponent: EmojiPicker{
-            textArea: chatBar.textField
-            onChosen: addText(emoji)
+        sourceComponent: QQC2.Pane {
+            topPadding: 0
+            bottomPadding: 0
+            rightPadding: 0
+            leftPadding: 0
+            Kirigami.Theme.colorSet: Kirigami.Theme.View
+            contentItem: EmojiPicker {
+                textArea: chatBar.textField
+                onChosen: addText(emoji)
+            }
         }
         Behavior on height {
             NumberAnimation {
diff --git a/imports/NeoChat/Component/Emoji/EmojiPicker.qml b/imports/NeoChat/Component/Emoji/EmojiPicker.qml
index e6053f8fb..aac88f895 100644
--- a/imports/NeoChat/Component/Emoji/EmojiPicker.qml
+++ b/imports/NeoChat/Component/Emoji/EmojiPicker.qml
@@ -63,7 +63,7 @@ ColumnLayout {
 
                 Layout.preferredWidth: del.label === "custom" ? implicitWidth + Kirigami.Units.largeSpacing : Kirigami.Units.gridUnit * 2
 
-                font.family: del.label === "custom" ? "" : 'emoji'
+                font.family: del.label === "custom" ? Kirigami.Theme.defaultFont.family : 'emoji'
                 text: del.label === "custom" ? i18n("Custom") : del.label
             }