diff --git a/css/style.scss b/css/style.scss
index dec8b972..de5d49d9 100644
--- a/css/style.scss
+++ b/css/style.scss
@@ -1 +1,2 @@
 @include icon-black-white('reply', 'social', 1);
+@include icon-black-white('emoji', 'social', 1);
diff --git a/img/emoji.svg b/img/emoji.svg
new file mode 100644
index 00000000..f2abab5b
--- /dev/null
+++ b/img/emoji.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg xmlns="http://www.w3.org/2000/svg" width="68" height="68">
+  <path d="M34 0C15.3 0 0 15.3 0 34s15.3 34 34 34 34-15.3 34-34S52.7 0 34 0zm0 64C17.5 64 4 50.5 4 34S17.5 4 34 4s30 13.5 30 30-13.5 30-30 30z"/>
+  <path d="M44.6 44.6c-5.8 5.8-15.4 5.8-21.2 0-.8-.8-2-.8-2.8 0-.8.8-.8 2 0 2.8C24.3 51.1 29.1 53 34 53s9.7-1.9 13.4-5.6c.8-.8.8-2 0-2.8-.8-.8-2-.8-2.8 0z"/>
+  <circle r="5" cy="26" cx="24"/>
+  <circle r="5" cy="26" cx="44"/>
+</svg>
diff --git a/src/components/Composer.vue b/src/components/Composer.vue
index fbdd2b0f..28aee629 100644
--- a/src/components/Composer.vue
+++ b/src/components/Composer.vue
@@ -187,7 +187,7 @@
 	}
 
 	.emoji-invoker {
-		background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2OCIgaGVpZ2h0PSI2OCI+PHBhdGggZD0iTTM0IDBDMTUuMyAwIDAgMTUuMyAwIDM0czE1LjMgMzQgMzQgMzQgMzQtMTUuMyAzNC0zNFM1Mi43IDAgMzQgMHptMCA2NEMxNy41IDY0IDQgNTAuNSA0IDM0UzE3LjUgNCAzNCA0czMwIDEzLjUgMzAgMzAtMTMuNSAzMC0zMCAzMHoiLz48cGF0aCBkPSJNNDQuNiA0NC42Yy01LjggNS44LTE1LjQgNS44LTIxLjIgMC0uOC0uOC0yLS44LTIuOCAwLS44LjgtLjggMiAwIDIuOEMyNC4zIDUxLjEgMjkuMSA1MyAzNCA1M3M5LjctMS45IDEzLjQtNS42Yy44LS44LjgtMiAwLTIuOC0uOC0uOC0yLS44LTIuOCAweiIvPjxjaXJjbGUgcj0iNSIgY3k9IjI2IiBjeD0iMjQiLz48Y2lyY2xlIHI9IjUiIGN5PSIyNiIgY3g9IjQ0Ii8+PC9zdmc+);
+		background-image: var(--icon-social-emoji-000);
 		background-position: center center;
 		background-repeat: no-repeat;
 		width: 38px;