diff --git a/src/components/emoji_input/suggestor.js b/src/components/emoji_input/suggestor.js
index d5e83ecb2..fe8e9e105 100644
--- a/src/components/emoji_input/suggestor.js
+++ b/src/components/emoji_input/suggestor.js
@@ -26,14 +26,14 @@ export default (data) => {
 }
 
 export const suggestEmoji = (emojis) => (input, nameKeywordLocalizer) => {
-  const noPrefix = input.toLowerCase().substring(1)
+  const noPrefix = input.toLowerCase().substr(1)
   return emojis
     .map((emoji) => ({ ...emoji, ...nameKeywordLocalizer(emoji) }))
     .filter(
       (emoji) =>
         emoji.names
           .concat(emoji.keywords)
-          .filter((kw) => kw.toLowerCase().includes(noPrefix)).length,
+          .filter((kw) => kw.toLowerCase().match(noPrefix)).length,
     )
     .map((k) => {
       let score = 0
diff --git a/src/components/palette_editor/palette_editor.vue b/src/components/palette_editor/palette_editor.vue
index 5b89f2af2..eec9fe361 100644
--- a/src/components/palette_editor/palette_editor.vue
+++ b/src/components/palette_editor/palette_editor.vue
@@ -4,21 +4,15 @@
     :class="{ '-compact': compact, '-apply': apply, '-mobile': mobile }"
   >
     <div class="palette">
-      <div v-for="key in paletteKeys">
-        <ColorInput
-          :key="key"
-          :name="key"
-          :model-value="props.modelValue[key]"
-          :fallback="fallback(key)"
-          :label="$t('settings.style.themes3.palette.' + key)"
-          @update:model-value="value => updatePalette(key, value)"
-        />
-        <ContrastRatio
-          v-if="contrast[key]"
-          :show-ratio="true"
-          :contrast="contrast[key]"
-        />
-      </div>
+      <ColorInput
+        v-for="key in paletteKeys"
+        :key="key"
+        :name="key"
+        :model-value="props.modelValue[key]"
+        :fallback="fallback(key)"
+        :label="$t('settings.style.themes3.palette.' + key)"
+        @update:model-value="value => updatePalette(key, value)"
+      />
     </div>
     <div class="buttons">
       <button
@@ -54,9 +48,6 @@
 import { computed } from 'vue'
 
 import ColorInput from 'src/components/color_input/color_input.vue'
-import ContrastRatio from 'src/components/contrast_ratio/contrast_ratio.vue'
-
-import { getContrastRatio, hex2rgb } from 'src/services/color_convert/color_convert.js'
 
 import { useInterfaceStore } from 'src/stores/interface.js'
 
@@ -115,16 +106,6 @@ const importPalette = () => {
   paletteImporter.importData()
 }
 
-const hints = (ratio) => ({
-  text: ratio.toPrecision(3) + ':1',
-  // AA level, AAA level
-  aa: ratio >= 4.5,
-  aaa: ratio >= 7,
-  // same but for 18pt+ texts
-  laa: ratio >= 3,
-  laaa: ratio >= 4.5,
-})
-
 const applyPalette = () => {
   emit('applyPalette', getExportedObject())
 }
@@ -133,15 +114,6 @@ const mobile = computed(() => {
   return useInterfaceStore().layoutType === 'mobile'
 })
 
-const contrast = computed(() => {
-  const bg = hex2rgb(props.modelValue.bg)
-
-  return {
-    text: hints(getContrastRatio(bg, hex2rgb(props.modelValue.text))),
-    link: hints(getContrastRatio(bg, hex2rgb(props.modelValue.link))),
-  }
-})
-
 const fallback = (key) => {
   if (key === 'accent') {
     return props.modelValue.link