diff --git a/src/web-chatview/chatview.js b/src/web-chatview/chatview.js
index 76fffe9b699a45f84e675345accbaf1da181ba3a..529727bab5ee41e4498c6062fc3f5a2e3671e330 100644
--- a/src/web-chatview/chatview.js
+++ b/src/web-chatview/chatview.js
@@ -127,10 +127,6 @@ if (use_qt) {
             setSendMessageContent(content)
         });
     })
-} else {
-    // For now hide on non qt client, as it needs some modifications in cpp code
-    emojiBtn.style.visibility = "collapse"
-    emojiBtn.style.width = 0
 }
 
 /* i18n manager */
@@ -169,8 +165,6 @@ function init_i18n(data) {
 
 /* exported init_picker */
 function init_picker(dark) {
-    if (!use_qt)
-        return;
     const picker = new EmojiButton({
         theme: dark? 'dark' : 'light'
     });
diff --git a/src/web-chatview/emoji.css b/src/web-chatview/emoji.css
new file mode 100644
index 0000000000000000000000000000000000000000..8c6e111a8b7dfe701d1d715846606f96229d9d4c
--- /dev/null
+++ b/src/web-chatview/emoji.css
@@ -0,0 +1,494 @@
+@keyframes show {
+  0% {
+    opacity: 0;
+    transform: scale3d(0.8, 0.8, 0.8);
+  }
+
+  50% {
+    transform: scale3d(1.05, 1.05, 1.05);
+  }
+
+  100% {
+    transform: scale3d(1, 1, 1);
+  }
+}
+
+@keyframes hide {
+  0% {
+    opacity: 1;
+    transform: scale3d(1, 1, 1);
+  }
+
+  100% {
+    opacity: 0;
+    transform: scale3d(0.8, 0.8, 0.8);
+  }
+}
+
+@keyframes grow {
+  0% {
+    opacity: 0;
+    transform: scale3d(0.8, 0.8, 0.8); 
+  }
+
+  100% { 
+    opacity: 1;
+    transform: scale3d(1, 1, 1); 
+  }
+}
+
+@keyframes shrink {
+  0% { 
+    opacity: 1;
+    transform: scale3d(1, 1, 1);
+  }
+
+  100% { 
+    opacity: 0;
+    transform: scale3d(0.8, 0.8, 0.8); 
+  }
+}
+
+@keyframes fade-in {
+  0% { opacity: 0; }
+  100% { opacity: 1; }
+}
+
+@keyframes fade-out {
+  0% { opacity: 1; }
+  100% { opacity: 0; }
+}
+
+.emoji-picker {
+  --animation-duration: 0.2s;
+  --animation-easing: ease-in-out;
+
+  --emoji-size: 1.8em;
+  --emoji-size-multiplier: 1.5;
+  --emoji-preview-size: 2em;
+  --emoji-per-row: 8;
+  --row-count: 6;
+
+  --content-height: calc((var(--emoji-size) * var(--emoji-size-multiplier)) * var(--row-count) + var(--category-name-size) + var(--category-button-height) + 0.5em);
+
+  --category-name-size: 0.85em;
+
+  --category-button-height: 2em;
+  --category-button-size: 1.1em;
+  --category-border-bottom-size: 4px;
+
+  --focus-indicator-color: #999999;
+
+  --search-height: 2em;
+
+  --blue-color: #4F81E5;
+
+  --border-color: #CCCCCC;
+  --background-color: #FFFFFF;
+  --text-color: #000000;
+  --secondary-text-color: #666666;
+  --hover-color: #E8F4F9;
+  --search-focus-border-color: var(--blue-color);
+  --search-icon-color: #CCCCCC;
+  --overlay-background-color: rgba(0, 0, 0, 0.8);
+  --popup-background-color: #FFFFFF;
+  --category-button-color: #666666;
+  --category-button-active-color: var(--blue-color);
+
+  --dark-border-color: #666666;
+  --dark-background-color: #333333;
+  --dark-text-color: #FFFFFF;
+  --dark-secondary-text-color: #999999;
+  --dark-hover-color: #666666;
+  --dark-search-background-color: #666666;
+  --dark-search-border-color: #999999;
+  --dark-search-placeholder-color: #999999;
+  --dark-search-focus-border-color: #DBE5F9;
+  --dark-popup-background-color: #333333;
+  --dark-category-button-color: #FFFFFF;
+
+  --font: Arial, Helvetica, sans-serif;
+  --font-size: 16px;
+}
+
+.emoji-picker {
+  font-size: var(--font-size);
+  border: 1px solid var(--border-color);
+  border-radius: 5px;
+  background: var(--background-color);
+  width: calc(var(--emoji-per-row) * var(--emoji-size) * var(--emoji-size-multiplier) + 1em + 1.5rem);
+  font-family: var(--font);
+  overflow: hidden;
+  animation: show var(--animation-duration) var(--animation-easing);
+}
+
+.emoji-picker * {
+  font-family: var(--font);
+  box-sizing: content-box;
+}
+
+.emoji-picker__overlay {
+  background: rgba(0, 0, 0, 0.75);
+  z-index: 1000;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.emoji-picker.hiding {
+  animation: hide var(--animation-duration) var(--animation-easing);
+}
+
+.emoji-picker.dark {
+  background: var(--dark-background-color);
+  color: var(--dark-text-color);
+  border-color: var(--dark-border-color);
+}
+
+.emoji-picker__content {
+  padding: 0.5em;
+  height: var(--content-height);
+  position: relative;
+}
+
+.emoji-picker__preview {
+  height: var(--emoji-preview-size);
+  padding: 0.5em;
+  border-top: 1px solid var(--border-color);
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+}
+
+.emoji-picker.dark .emoji-picker__preview {
+  border-top-color: var(--dark-border-color);
+}
+
+.emoji-picker__preview-emoji {
+  font-size: var(--emoji-preview-size);
+  margin-right: 0.25em;
+  font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Segoe UI", "Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "EmojiOne Color", "Android Emoji";
+}
+
+.emoji-picker__preview-emoji img.emoji {
+  height: 1em;
+  width: 1em;
+  margin: 0 .05em 0 .1em;
+  vertical-align: -0.1em;
+}
+
+.emoji-picker__preview-name {
+  color: var(--text-color);
+  font-size: 0.85em;
+  overflow-wrap: break-word;
+  word-break: break-all;
+}
+
+.emoji-picker.dark .emoji-picker__preview-name {
+  color: var(--dark-text-color);
+}
+
+.emoji-picker__container {
+  display: grid;
+  justify-content: center;
+  grid-template-columns: repeat(var(--emoji-per-row), calc(var(--emoji-size) * var(--emoji-size-multiplier)));
+  grid-auto-rows: calc(var(--emoji-size) * var(--emoji-size-multiplier));
+}
+
+.emoji-picker__container.search-results {
+  height: var(--content-height);
+  overflow-y: auto;
+}
+
+.emoji-picker__custom-emoji {
+  width: 1em;
+  height: 1em;
+}
+
+.emoji-picker__emoji {
+  background: transparent;
+  border: none;
+  cursor: pointer;
+  overflow: hidden;
+  font-size: var(--emoji-size);
+  width: 1.5em;
+  height: 1.5em;
+  padding: 0;
+  margin: 0;
+  outline: none;
+  font-family: "Segoe UI Emoji", "Segoe UI Symbol", "Segoe UI", "Apple Color Emoji", "Twemoji Mozilla", "Noto Color Emoji", "EmojiOne Color", "Android Emoji";
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.emoji-picker__emoji img.emoji {
+  height: 1em;
+  width: 1em;
+  margin: 0 .05em 0 .1em;
+  vertical-align: -0.1em;
+}
+
+.emoji-picker__emoji:focus, .emoji-picker__emoji:hover {
+  background: var(--hover-color);
+}
+
+.emoji-picker__emoji:focus {
+  outline: 1px dotted var(--focus-indicator-color);
+}
+
+.emoji-picker.dark .emoji-picker__emoji:focus, .emoji-picker.dark .emoji-picker__emoji:hover {
+  background: var(--dark-hover-color);
+}
+
+.emoji-picker__plugin-container {
+  margin: 0.5em;
+  display: flex;
+  flex-direction: row;
+}
+
+.emoji-picker__search-container {
+  margin: 0.5em;
+  position: relative;
+  height: var(--search-height);
+  display: flex;
+}
+
+.emoji-picker__search {
+  box-sizing: border-box;
+  width: 100%;
+  border-radius: 3px;
+  border: 1px solid var(--border-color);
+  padding-right: 2em;
+  padding: 0.5em 2.25em 0.5em 0.5em;
+  font-size: 0.85em;
+  outline: none;
+}
+
+.emoji-picker.dark .emoji-picker__search {
+  background: var(--dark-search-background-color);
+  color: var(--dark-text-color);
+  border-color: var(--dark-search-border-color);
+}
+
+.emoji-picker.dark .emoji-picker__search::placeholder {
+  color: var(--dark-search-placeholder-color);
+}
+
+.emoji-picker__search:focus {
+  border: 1px solid var(--search-focus-border-color);
+}
+
+.emoji-picker.dark .emoji-picker__search:focus {
+  border-color: var(--dark-search-focus-border-color);
+}
+
+.emoji-picker__search-icon {
+  position: absolute;
+  color: var(--search-icon-color);
+  width: 1em;
+  height: 1em;
+  right: 0.75em;
+  top: calc(50% - 0.5em);
+}
+
+.emoji-picker__search-icon img {
+  width: 1em;
+  height: 1em;
+}
+
+.emoji-picker__search-not-found {
+  color: var(--secondary-text-color);
+  text-align: center;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+
+.emoji-picker__search-not-found h2 {
+  color: var(--secondary-text-color);
+}
+
+.emoji-picker.dark .emoji-picker__search-not-found {
+  color: var(--dark-secondary-text-color);
+}
+
+.emoji-picker.dark .emoji-picker__search-not-found h2 {
+  color: var(--dark-secondary-text-color);
+}
+
+.emoji-picker__search-not-found-icon {
+  font-size: 3em;
+}
+
+.emoji-picker__search-not-found-icon img {
+  width: 1em;
+  height: 1em;
+}
+
+.emoji-picker__search-not-found h2 {
+  margin: 0.5em 0;
+  font-size: 1em;
+}
+
+.emoji-picker__variant-overlay {
+  background: var(--overlay-background-color);
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  border-radius: 5px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  animation: fade-in var(--animation-duration) var(--animation-easing);
+}
+
+.emoji-picker__variant-overlay.hiding {
+  animation: fade-out var(--animation-duration) var(--animation-easing);
+}
+
+.emoji-picker__variant-popup {
+  background: var(--popup-background-color);
+  margin: 0.5em;
+  padding: 0.5em;
+  text-align: center;
+  border-radius: 5px;
+  animation: grow var(--animation-duration) var(--animation-easing);
+  user-select: none;
+}
+
+.emoji-picker__variant-overlay.hiding .emoji-picker__variant-popup {
+  animation: shrink var(--animation-duration) var(--animation-easing);
+}
+
+.emoji-picker.dark .emoji-picker__variant-popup {
+  background: var(--dark-popup-background-color);
+}
+
+.emoji-picker__emojis {
+  overflow-y: auto;
+  position: relative;
+  height: calc((var(--emoji-size) * var(--emoji-size-multiplier)) * var(--row-count) + var(--category-name-size));
+}
+
+.emoji-picker__emojis.hiding {
+  animation: fade-out 0.05s var(--animation-easing);
+}
+
+.emoji-picker__emojis h2.emoji-picker__category-name {
+  font-size: 0.85em;
+  color: var(--secondary-text-color);
+  text-transform: uppercase;
+  margin: 0.25em 0;
+  text-align: left;
+}
+
+.emoji-picker.dark h2.emoji-picker__category-name {
+  color: var(--dark-secondary-text-color);
+}
+
+.emoji-picker__category-buttons {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-around;
+  height: var(--category-button-height);
+  margin-bottom: 0.5em;
+}
+
+button.emoji-picker__category-button {
+  flex-grow: 1;
+  background: transparent;
+  padding: 0;
+  border: none;
+  cursor: pointer;
+  font-size: var(--category-button-size);
+  vertical-align: middle;
+  color: var(--category-button-color);
+  border-bottom: var(--category-border-bottom-size) solid transparent;
+  outline: none;
+}
+
+button.emoji-picker__category-button img {
+  width: var(--category-button-size);
+  height: var(--category-button-size);
+}
+
+.emoji-picker.keyboard button.emoji-picker__category-button:focus {
+  outline: 1px dotted var(--focus-indicator-color);
+}
+
+.emoji-picker.dark button.emoji-picker__category-button.active {
+  color: var(--category-button-active-color);
+}
+
+.emoji-picker.dark button.emoji-picker__category-button {
+  color: var(--dark-category-button-color);
+}
+
+button.emoji-picker__category-button.active {
+  color: var(--category-button-active-color);
+  border-bottom: var(--category-border-bottom-size) solid var(--category-button-active-color);
+}
+
+@media (prefers-color-scheme: dark) {
+  .emoji-picker.auto {
+    background: var(--dark-background-color);
+    color: var(--dark-text-color);
+    border-color: var(--dark-border-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__preview {
+    border-top-color: var(--dark-border-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__preview-name {
+    color: var(--dark-text-color);
+  }
+
+  .emoji-picker.auto button.emoji-picker__category-button {
+    color: var(--dark-category-button-color);
+  }
+
+  .emoji-picker.auto button.emoji-picker__category-button.active {
+    color: var(--category-button-active-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__emoji:focus, .emoji-picker.auto .emoji-picker__emoji:hover {
+    background: var(--dark-hover-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__search {
+    background: var(--dark-search-background-color);
+    color: var(--dark-text-color);
+    border-color: var(--dark-search-border-color);
+  }
+ 
+  .emoji-picker.auto h2.emoji-picker__category-name {
+    color: var(--dark-secondary-text-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__search::placeholder {
+    color: var(--dark-search-placeholder-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__search:focus {
+    border-color: var(--dark-search-focus-border-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__search-not-found {
+    color: var(--dark-secondary-text-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__search-not-found h2 {
+    color: var(--dark-secondary-text-color);
+  }
+
+  .emoji-picker.auto .emoji-picker__variant-popup {
+    background: var(--dark-popup-background-color);
+  }
+}
\ No newline at end of file
diff --git a/src/web-chatview/fa.css b/src/web-chatview/fa.css
new file mode 100644
index 0000000000000000000000000000000000000000..251acf7b9d090cea872cfe543acda157841aed14
--- /dev/null
+++ b/src/web-chatview/fa.css
@@ -0,0 +1,452 @@
+svg:not(:root).svg-inline--fa {
+  overflow: visible;
+}
+
+.svg-inline--fa {
+  display: inline-block;
+  font-size: inherit;
+  height: 1em;
+  overflow: visible;
+  vertical-align: -0.125em;
+}
+.svg-inline--fa.fa-lg {
+  vertical-align: -0.225em;
+}
+.svg-inline--fa.fa-w-1 {
+  width: 0.0625em;
+}
+.svg-inline--fa.fa-w-2 {
+  width: 0.125em;
+}
+.svg-inline--fa.fa-w-3 {
+  width: 0.1875em;
+}
+.svg-inline--fa.fa-w-4 {
+  width: 0.25em;
+}
+.svg-inline--fa.fa-w-5 {
+  width: 0.3125em;
+}
+.svg-inline--fa.fa-w-6 {
+  width: 0.375em;
+}
+.svg-inline--fa.fa-w-7 {
+  width: 0.4375em;
+}
+.svg-inline--fa.fa-w-8 {
+  width: 0.5em;
+}
+.svg-inline--fa.fa-w-9 {
+  width: 0.5625em;
+}
+.svg-inline--fa.fa-w-10 {
+  width: 0.625em;
+}
+.svg-inline--fa.fa-w-11 {
+  width: 0.6875em;
+}
+.svg-inline--fa.fa-w-12 {
+  width: 0.75em;
+}
+.svg-inline--fa.fa-w-13 {
+  width: 0.8125em;
+}
+.svg-inline--fa.fa-w-14 {
+  width: 0.875em;
+}
+.svg-inline--fa.fa-w-15 {
+  width: 0.9375em;
+}
+.svg-inline--fa.fa-w-16 {
+  width: 1em;
+}
+.svg-inline--fa.fa-w-17 {
+  width: 1.0625em;
+}
+.svg-inline--fa.fa-w-18 {
+  width: 1.125em;
+}
+.svg-inline--fa.fa-w-19 {
+  width: 1.1875em;
+}
+.svg-inline--fa.fa-w-20 {
+  width: 1.25em;
+}
+.svg-inline--fa.fa-pull-left {
+  margin-right: 0.3em;
+  width: auto;
+}
+.svg-inline--fa.fa-pull-right {
+  margin-left: 0.3em;
+  width: auto;
+}
+.svg-inline--fa.fa-border {
+  height: 1.5em;
+}
+.svg-inline--fa.fa-li {
+  width: 2em;
+}
+.svg-inline--fa.fa-fw {
+  width: 1.25em;
+}
+
+.fa-layers svg.svg-inline--fa {
+  bottom: 0;
+  left: 0;
+  margin: auto;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+.fa-layers {
+  display: inline-block;
+  height: 1em;
+  position: relative;
+  text-align: center;
+  vertical-align: -0.125em;
+  width: 1em;
+}
+.fa-layers svg.svg-inline--fa {
+  -webkit-transform-origin: center center;
+          transform-origin: center center;
+}
+
+.fa-layers-counter, .fa-layers-text {
+  display: inline-block;
+  position: absolute;
+  text-align: center;
+}
+
+.fa-layers-text {
+  left: 50%;
+  top: 50%;
+  -webkit-transform: translate(-50%, -50%);
+          transform: translate(-50%, -50%);
+  -webkit-transform-origin: center center;
+          transform-origin: center center;
+}
+
+.fa-layers-counter {
+  background-color: #ff253a;
+  border-radius: 1em;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  color: #fff;
+  height: 1.5em;
+  line-height: 1;
+  max-width: 5em;
+  min-width: 1.5em;
+  overflow: hidden;
+  padding: 0.25em;
+  right: 0;
+  text-overflow: ellipsis;
+  top: 0;
+  -webkit-transform: scale(0.25);
+          transform: scale(0.25);
+  -webkit-transform-origin: top right;
+          transform-origin: top right;
+}
+
+.fa-layers-bottom-right {
+  bottom: 0;
+  right: 0;
+  top: auto;
+  -webkit-transform: scale(0.25);
+          transform: scale(0.25);
+  -webkit-transform-origin: bottom right;
+          transform-origin: bottom right;
+}
+
+.fa-layers-bottom-left {
+  bottom: 0;
+  left: 0;
+  right: auto;
+  top: auto;
+  -webkit-transform: scale(0.25);
+          transform: scale(0.25);
+  -webkit-transform-origin: bottom left;
+          transform-origin: bottom left;
+}
+
+.fa-layers-top-right {
+  right: 0;
+  top: 0;
+  -webkit-transform: scale(0.25);
+          transform: scale(0.25);
+  -webkit-transform-origin: top right;
+          transform-origin: top right;
+}
+
+.fa-layers-top-left {
+  left: 0;
+  right: auto;
+  top: 0;
+  -webkit-transform: scale(0.25);
+          transform: scale(0.25);
+  -webkit-transform-origin: top left;
+          transform-origin: top left;
+}
+
+.fa-lg {
+  font-size: 1.3333333333em;
+  line-height: 0.75em;
+  vertical-align: -0.0667em;
+}
+
+.fa-xs {
+  font-size: 0.75em;
+}
+
+.fa-sm {
+  font-size: 0.875em;
+}
+
+.fa-1x {
+  font-size: 1em;
+}
+
+.fa-2x {
+  font-size: 2em;
+}
+
+.fa-3x {
+  font-size: 3em;
+}
+
+.fa-4x {
+  font-size: 4em;
+}
+
+.fa-5x {
+  font-size: 5em;
+}
+
+.fa-6x {
+  font-size: 6em;
+}
+
+.fa-7x {
+  font-size: 7em;
+}
+
+.fa-8x {
+  font-size: 8em;
+}
+
+.fa-9x {
+  font-size: 9em;
+}
+
+.fa-10x {
+  font-size: 10em;
+}
+
+.fa-fw {
+  text-align: center;
+  width: 1.25em;
+}
+
+.fa-ul {
+  list-style-type: none;
+  margin-left: 2.5em;
+  padding-left: 0;
+}
+.fa-ul > li {
+  position: relative;
+}
+
+.fa-li {
+  left: -2em;
+  position: absolute;
+  text-align: center;
+  width: 2em;
+  line-height: inherit;
+}
+
+.fa-border {
+  border: solid 0.08em #eee;
+  border-radius: 0.1em;
+  padding: 0.2em 0.25em 0.15em;
+}
+
+.fa-pull-left {
+  float: left;
+}
+
+.fa-pull-right {
+  float: right;
+}
+
+.fa.fa-pull-left,
+.fas.fa-pull-left,
+.far.fa-pull-left,
+.fal.fa-pull-left,
+.fab.fa-pull-left {
+  margin-right: 0.3em;
+}
+.fa.fa-pull-right,
+.fas.fa-pull-right,
+.far.fa-pull-right,
+.fal.fa-pull-right,
+.fab.fa-pull-right {
+  margin-left: 0.3em;
+}
+
+.fa-spin {
+  -webkit-animation: fa-spin 2s infinite linear;
+          animation: fa-spin 2s infinite linear;
+}
+
+.fa-pulse {
+  -webkit-animation: fa-spin 1s infinite steps(8);
+          animation: fa-spin 1s infinite steps(8);
+}
+
+@-webkit-keyframes fa-spin {
+  0% {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+  }
+}
+
+@keyframes fa-spin {
+  0% {
+    -webkit-transform: rotate(0deg);
+            transform: rotate(0deg);
+  }
+  100% {
+    -webkit-transform: rotate(360deg);
+            transform: rotate(360deg);
+  }
+}
+.fa-rotate-90 {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
+  -webkit-transform: rotate(90deg);
+          transform: rotate(90deg);
+}
+
+.fa-rotate-180 {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
+  -webkit-transform: rotate(180deg);
+          transform: rotate(180deg);
+}
+
+.fa-rotate-270 {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
+  -webkit-transform: rotate(270deg);
+          transform: rotate(270deg);
+}
+
+.fa-flip-horizontal {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
+  -webkit-transform: scale(-1, 1);
+          transform: scale(-1, 1);
+}
+
+.fa-flip-vertical {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
+  -webkit-transform: scale(1, -1);
+          transform: scale(1, -1);
+}
+
+.fa-flip-both, .fa-flip-horizontal.fa-flip-vertical {
+  -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
+  -webkit-transform: scale(-1, -1);
+          transform: scale(-1, -1);
+}
+
+:root .fa-rotate-90,
+:root .fa-rotate-180,
+:root .fa-rotate-270,
+:root .fa-flip-horizontal,
+:root .fa-flip-vertical,
+:root .fa-flip-both {
+  -webkit-filter: none;
+          filter: none;
+}
+
+.fa-stack {
+  display: inline-block;
+  height: 2em;
+  position: relative;
+  width: 2.5em;
+}
+
+.fa-stack-1x,
+.fa-stack-2x {
+  bottom: 0;
+  left: 0;
+  margin: auto;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+
+.svg-inline--fa.fa-stack-1x {
+  height: 1em;
+  width: 1.25em;
+}
+.svg-inline--fa.fa-stack-2x {
+  height: 2em;
+  width: 2.5em;
+}
+
+.fa-inverse {
+  color: #fff;
+}
+
+.sr-only {
+  border: 0;
+  clip: rect(0, 0, 0, 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+}
+
+.sr-only-focusable:active, .sr-only-focusable:focus {
+  clip: auto;
+  height: auto;
+  margin: 0;
+  overflow: visible;
+  position: static;
+  width: auto;
+}
+
+.svg-inline--fa .fa-primary {
+  fill: var(--fa-primary-color, currentColor);
+  opacity: 1;
+  opacity: var(--fa-primary-opacity, 1);
+}
+
+.svg-inline--fa .fa-secondary {
+  fill: var(--fa-secondary-color, currentColor);
+  opacity: 0.4;
+  opacity: var(--fa-secondary-opacity, 0.4);
+}
+
+.svg-inline--fa.fa-swap-opacity .fa-primary {
+  opacity: 0.4;
+  opacity: var(--fa-secondary-opacity, 0.4);
+}
+
+.svg-inline--fa.fa-swap-opacity .fa-secondary {
+  opacity: 1;
+  opacity: var(--fa-primary-opacity, 1);
+}
+
+.svg-inline--fa mask .fa-primary,
+.svg-inline--fa mask .fa-secondary {
+  fill: black;
+}
+
+.fad.fa-inverse {
+  color: #fff;
+}
diff --git a/src/web-chatview/web.gresource.xml b/src/web-chatview/web.gresource.xml
index de86990317a2fd73592ee6d16669e82ddd298fd8..584b470f4674f8413f6fc9dd1ce1a10ae89250c7 100644
--- a/src/web-chatview/web.gresource.xml
+++ b/src/web-chatview/web.gresource.xml
@@ -10,10 +10,13 @@
       <file>linkify-string.js</file>
       <file>linkify-html.js</file>
       <file>jed.js</file>
+      <file>emoji.js</file>
 
       <!-- CSS -->
       <file>chatview.css</file>
       <file>chatview-gnome.css</file>
+      <file>emoji.css</file>
+      <file>fa.css</file>
 
       <!-- Locale -->
     </gresource>