diff --git a/src/pages/home/report/EmojiPickerMenu/index.js b/src/pages/home/report/EmojiPickerMenu/index.js
index 9ac5b2b2a253..51d0307a21f6 100755
--- a/src/pages/home/report/EmojiPickerMenu/index.js
+++ b/src/pages/home/report/EmojiPickerMenu/index.js
@@ -298,7 +298,9 @@ class EmojiPickerMenu extends Component {
/**
* Given an emoji item object, render a component based on its type.
* Items with the code "SPACER" return nothing and are used to fill rows up to 8
- * so that the sticky headers function properly
+ * so that the sticky headers function properly.
+ * We add '\uFE0F' to our unicode to force the correct emoji presentation (VS16)
+ * on emojis that also have a text style presentation (VS15).
*
* @param {Object} item
* @param {Number} index
@@ -313,7 +315,7 @@ class EmojiPickerMenu extends Component {
if (header) {
return (
- {code}
+ {`${code}\uFE0F`}
);
}
@@ -322,7 +324,7 @@ class EmojiPickerMenu extends Component {
this.setState({highlightedIndex: index})}
- emoji={code}
+ emoji={`${code}\uFE0F`}
isHighlighted={index === this.state.highlightedIndex}
emojiSize={this.emojiSize}
/>
diff --git a/src/pages/home/report/EmojiPickerMenu/index.native.js b/src/pages/home/report/EmojiPickerMenu/index.native.js
index b1a4d1302506..6708330dffca 100644
--- a/src/pages/home/report/EmojiPickerMenu/index.native.js
+++ b/src/pages/home/report/EmojiPickerMenu/index.native.js
@@ -58,7 +58,7 @@ class EmojiPickerMenu extends Component {
if (item.header) {
return (
- {item.code}
+ {`${item.code}\uFE0F`}
);
}
@@ -66,7 +66,7 @@ class EmojiPickerMenu extends Component {
return (
);