diff --git a/app/assets/javascripts/discourse/app/components/emoji-picker.js b/app/assets/javascripts/discourse/app/components/emoji-picker.js
index 9fab42b390f..3c0f3c85468 100644
--- a/app/assets/javascripts/discourse/app/components/emoji-picker.js
+++ b/app/assets/javascripts/discourse/app/components/emoji-picker.js
@@ -215,6 +215,14 @@ export default Component.extend({
     section && section.scrollIntoView();
   },
 
+  @action
+  keydown(event) {
+    if (event.code === "Escape") {
+      this.onClose();
+      return false;
+    }
+  },
+
   @action
   onFilter(event) {
     const emojiPicker = document.querySelector(".emoji-picker");
diff --git a/app/assets/javascripts/discourse/app/templates/components/emoji-picker.hbs b/app/assets/javascripts/discourse/app/templates/components/emoji-picker.hbs
index 68b2c0865cf..f41a27cb20b 100644
--- a/app/assets/javascripts/discourse/app/templates/components/emoji-picker.hbs
+++ b/app/assets/javascripts/discourse/app/templates/components/emoji-picker.hbs
@@ -1,5 +1,5 @@
 {{#if isActive}}
-  <div class="emoji-picker {{if @isActive "opened"}}">
+  <div {{on "keydown" (action "keydown")}} class="emoji-picker {{if @isActive "opened"}}">
     <div class="emoji-picker-category-buttons">
       {{#if recentEmojis.length}}
         <button type="button" data-section="recent" {{action "onCategorySelection" "recent"}} class="btn btn-default category-button emoji">