diff --git a/lib/ace/css/editor.css b/lib/ace/css/editor.css
index cf65fb83fbb..19da6e568c7 100644
--- a/lib/ace/css/editor.css
+++ b/lib/ace/css/editor.css
@@ -268,6 +268,13 @@ styles.join("\n")
     text-align: center;
 }
 
+.ace_emoji {
+    display: inline-block;
+    text-align: center;
+    font-size: 50%;
+    /* transform: translate(-12.5%, -12.5%); */
+}
+
 .ace_cursor-layer {
     z-index: 4;
 }
diff --git a/lib/ace/layer/text.js b/lib/ace/layer/text.js
index ff5748d3697..4f765216916 100644
--- a/lib/ace/layer/text.js
+++ b/lib/ace/layer/text.js
@@ -344,8 +344,9 @@ var Text = function(parentEl) {
 
     this.$renderToken = function(parent, screenColumn, token, value) {
         var self = this;
-        var re = /(\t)|( +)|([\x00-\x1f\x80-\xa0\xad\u1680\u180E\u2000-\u200f\u2028\u2029\u202F\u205F\uFEFF\uFFF9-\uFFFC]+)|(\u3000)|([\u1100-\u115F\u11A3-\u11A7\u11FA-\u11FF\u2329-\u232A\u2E80-\u2E99\u2E9B-\u2EF3\u2F00-\u2FD5\u2FF0-\u2FFB\u3001-\u303E\u3041-\u3096\u3099-\u30FF\u3105-\u312D\u3131-\u318E\u3190-\u31BA\u31C0-\u31E3\u31F0-\u321E\u3220-\u3247\u3250-\u32FE\u3300-\u4DBF\u4E00-\uA48C\uA490-\uA4C6\uA960-\uA97C\uAC00-\uD7A3\uD7B0-\uD7C6\uD7CB-\uD7FB\uF900-\uFAFF\uFE10-\uFE19\uFE30-\uFE52\uFE54-\uFE66\uFE68-\uFE6B\uFF01-\uFF60\uFFE0-\uFFE6]|[\uD800-\uDBFF][\uDC00-\uDFFF])/g;
-        
+
+        var re = /(\t)|( +)|([\x00-\x1f\x80-\xa0\xad\u1680\u180E\u2000-\u200f\u2028\u2029\u202F\u205F\uFEFF\uFFF9-\uFFFC]+)|(\u3000)|([\u1100-\u115F\u11A3-\u11A7\u11FA-\u11FF\u2329-\u232A\u2E80-\u2E99\u2E9B-\u2EF3\u2F00-\u2FD5\u2FF0-\u2FFB\u3001-\u303E\u3041-\u3096\u3099-\u30FF\u3105-\u312D\u3131-\u318E\u3190-\u31BA\u31C0-\u31E3\u31F0-\u321E\u3220-\u3247\u3250-\u32FE\u3300-\u4DBF\u4E00-\uA48C\uA490-\uA4C6\uA960-\uA97C\uAC00-\uD7A3\uD7B0-\uD7C6\uD7CB-\uD7FB\uF900-\uFAFF\uFE10-\uFE19\uFE30-\uFE52\uFE54-\uFE66\uFE68-\uFE6B\uFF01-\uFF60\uFFE0-\uFFE6]|[\uD800-\uDBFF][\uDC00-\uDFFF])|(\u00a9|\u00ae|[\u2070-\u3300]|\ud83c[\ud000-\udfff]|\ud83d[\ud000-\udfff]|\ud83e[\ud000-\udfff])|(\uFE0F)/g;
+
         var valueFragment = this.dom.createFragment(this.element);
 
         var m;
@@ -356,7 +357,9 @@ var Text = function(parentEl) {
             var controlCharacter = m[3];
             var cjkSpace = m[4];
             var cjk = m[5];
-            
+            var emoji = m[6];
+            var variationSelector = m[7];
+
             if (!self.showSpaces && simpleSpace)
                 continue;
 
@@ -398,13 +401,35 @@ var Text = function(parentEl) {
             } else if (cjk) {
                 screenColumn += 1;
                 var span = this.dom.createElement("span");
+
                 span.style.width = (self.config.characterWidth * 2) + "px";
                 span.className = "ace_cjk";
                 span.textContent = cjk;
                 valueFragment.appendChild(span);
+            } else if (emoji) {
+                screenColumn += 1;
+                var span = this.dom.createElement("span");
+                var previousChar = value[m.index - 1];
+
+                if (previousChar === "\u200D") {
+                  span.style.width = (self.config.characterWidth) + "px";
+                  span.className = "ace_cjk";
+                } else {
+                    span.style.width = (self.config.characterWidth) + "px";
+                    span.className = "ace_emoji";
+                }
+                span.textContent = emoji;
+                valueFragment.appendChild(span);
+            } else if (variationSelector) {
+              screenColumn += 1;
+              var span = this.dom.createElement("span");
+              span.style.width = (self.config.characterWidth * 1) + "px";
+              span.className = "ace_emoji variationSelctor";
+              span.textContent = variationSelector;
+              valueFragment.appendChild(span);
             }
         }
-        
+
         valueFragment.appendChild(this.dom.createTextNode(i ? value.slice(i) : value, this.element));
 
         if (!this.$textToken[token.type]) {