diff --git a/packages/emoji-mart/src/components/Picker/Picker.tsx b/packages/emoji-mart/src/components/Picker/Picker.tsx
index f6fa5cab..5cdefe7e 100644
--- a/packages/emoji-mart/src/components/Picker/Picker.tsx
+++ b/packages/emoji-mart/src/components/Picker/Picker.tsx
@@ -725,26 +725,22 @@ export default class Picker extends Component {
           <div class={`margin-${this.dir[0]}`}>
             {emoji ? (
               <div class={`padding-${this.dir[2]} align-${this.dir[0]}`}>
-                <div class="ellipsis" style={{ fontSize: '1.1em' }}>
-                  {emoji.name}
-                </div>
-                <div class="ellipsis color-c" style={{ fontSize: '.9em' }}>
+                <div class="preview-title ellipsis">{emoji.name}</div>
+                <div class="preview-subtitle ellipsis color-c">
                   {emoji.skins[0].shortcodes}
                 </div>
               </div>
             ) : noSearchResults ? (
               <div class={`padding-${this.dir[2]} align-${this.dir[0]}`}>
-                <div class="ellipsis" style={{ fontSize: '1.1em' }}>
+                <div class="preview-title ellipsis">
                   {I18n.search_no_results_1}
                 </div>
-                <div class="ellipsis color-c" style={{ fontSize: '.9em' }}>
+                <div class="preview-subtitle ellipsis color-c">
                   {I18n.search_no_results_2}
                 </div>
               </div>
             ) : (
-              <div class="color-c" style={{ fontSize: 21 }}>
-                {I18n.pick}
-              </div>
+              <div class="preview-placeholder color-c">{I18n.pick}</div>
             )}
           </div>
         </div>
diff --git a/packages/emoji-mart/src/components/Picker/PickerStyles.scss b/packages/emoji-mart/src/components/Picker/PickerStyles.scss
index ba45144b..8fab3dcd 100644
--- a/packages/emoji-mart/src/components/Picker/PickerStyles.scss
+++ b/packages/emoji-mart/src/components/Picker/PickerStyles.scss
@@ -46,6 +46,10 @@
 
   --sidebar-width: 16px;
 
+  --preview-placeholder-size: 21px;
+  --preview-title-size: 1.1em;
+  --preview-subtitle-size: .9em;
+
   --duration: 225ms;
   --duration-fast: 125ms;
   --duration-instant: 50ms;
@@ -318,6 +322,10 @@ button {
   position: relative;
   padding: calc(var(--padding) + 4px) var(--padding);
   padding-right: var(--sidebar-width);
+
+  .preview-placeholder { font-size: var(--preview-placeholder-size) }
+  .preview-title { font-size: var(--preview-title-size) }
+  .preview-subtitle { font-size: var(--preview-subtitle-size) }
 }
 
 #nav, #preview {