diff --git a/src/components/DefElement.vue b/src/components/DefElement.vue
index eba99a555745a648266f94f40cc76eb2bcc4b620..9f314cf20df748e36dee32c68481d28dd003e067 100644
--- a/src/components/DefElement.vue
+++ b/src/components/DefElement.vue
@@ -16,6 +16,7 @@
 
 <script>
 import entities from '../utils/entities.js'
+import helpers from '../utils/helpers.js'
 
 export default {
   name: 'DefElement',
@@ -53,7 +54,7 @@ export default {
           else if (item.type_ == 'superscript') return {type: item.type_, html: item.text, tag: 'sup'}
           else if (item.type_ == 'subscript') return {type: item.type_, html: item.text, 'tag': 'sub'}
           else if (item.type_ == 'quote_inset') return {type: item.type_, body: item, html: '', tag: 'DefElement', props: {body: item, tag: 'i'}}
-          else if (item.type_ == 'fraction') return {type: item.type_, html: '', num: item.numerator, denom: item.denominator}
+          else if (item.type_ == 'fraction') return helpers.fraction(item.numerator, item.denominator)
           else if (item.id) return {type: item.type_, html: (entities[lang][item.id] || {})['expansion'] || item.id}
           else return {type: item.type_ || 'plain', html: item}
         }
diff --git a/src/utils/helpers.js b/src/utils/helpers.js
index 6c4b48b9287857c512ed13890fbbeb2778deca63..904a82e8beaad3a7e0ed122376f567921671014f 100644
--- a/src/utils/helpers.js
+++ b/src/utils/helpers.js
@@ -71,4 +71,121 @@ var group_list = function(grps, dictionary) {
   return Array.from(grp_collection).join(' - ')
 }
 
-export default { group_list}
+var fraction = function(numerator, denominator) {
+  var superscript = {
+  '0': '⁰',
+  '1': '¹',
+  '2': '²',
+  '3': '³',
+  '4': '⁴',
+  '5': '⁵',
+  '6': '⁶',
+  '7': '⁷',
+  '8': '⁸',
+  '9': '⁹',
+  '+': '⁺',
+  '-': '⁻',
+  '=': '⁼',
+  '(': '⁽',
+  ')': '⁾',
+  'a': 'ᵃ',
+  'b': 'ᵇ',
+  'c': 'ᶜ',
+  'd': 'ᵈ',
+  'e': 'ᵉ',
+  'f': 'ᶠ',
+  'g': 'ᵍ',
+  'h': 'Ê°',
+  'i': 'ⁱ',
+  'j': 'ʲ',
+  'k': 'ᵏ',
+  'l': 'Ë¡',
+  'm': 'ᵐ',
+  'n': 'ⁿ',
+  'o': 'áµ’',
+  'p': 'áµ–',
+  'r': 'ʳ',
+  's': 'Ë¢',
+  't': 'áµ—',
+  'u': 'ᵘ',
+  'v': 'áµ›',
+  'w': 'Ê·',
+  'x': 'Ë£',
+  'y': 'ʸ',
+  'z': 'ᶻ',
+  ' ': ' '
+  }
+
+  var subscript = {
+  '0': 'â‚€',
+  '1': '₁',
+  '2': 'â‚‚',
+  '3': '₃',
+  '4': 'â‚„',
+  '5': 'â‚…',
+  '6': '₆',
+  '7': '₇',
+  '8': '₈',
+  '9': '₉',
+  '+': 'â‚Š',
+  '-': 'â‚‹',
+  '=': '₌',
+  '(': '₍',
+  ')': 'â‚Ž',
+  'a': 'ₐ',
+  'e': 'â‚‘',
+  'h': 'â‚•',
+  'i': 'áµ¢',
+  'j': 'â±¼',
+  'k': 'â‚–',
+  'l': 'â‚—',
+  'm': 'ₘ',
+  'n': 'â‚™',
+  'o': 'â‚’',
+  'p': 'â‚š',
+  'r': 'áµ£',
+  's': 'â‚›',
+  't': 'ₜ',
+  'u': 'ᵤ',
+  'v': 'áµ¥',
+  'x': 'â‚“',
+  ' ': ' '
+  };
+
+  var fractions = {
+  '1/2': '½',
+  '1/3': 'â…“',
+  '2/3': 'â…”',
+  '1/4': '¼',
+  '3/4': '¾',
+  '1/5': 'â…•',
+  '2/5': 'â…–',
+  '3/5': 'â…—',
+  '4/5': 'â…˜',
+  '1/6': 'â…™',
+  '5/6': 'â…š',
+  '1/7': '⅐',
+  '1/8': 'â…›',
+  '3/8': '⅜',
+  '5/8': '⅝',
+  '7/8': 'â…ž',
+  '1/9': 'â…‘',
+  '1/10': 'â…’'
+  };
+
+  let other_fraction = null
+
+  let num_sup = numerator.toString().split('').map(x => superscript[x] || '_').join('')
+  let den_sub = denominator.toString().split('').map(x => subscript[x] || '_').join('')
+
+  if (! num_sup.includes('_') && ! den_sub.includes('_')) {
+    other_fraction = num_sup + '⁄' +  den_sub
+  }
+
+  return fractions[numerator + '/' + denominator] && {type: 'plain', html: fractions[numerator + '/' + denominator] }
+      || other_fraction && {type: 'plain', html: other_fraction }
+      || {type: 'fraction', html: '', num: numerator, denom: denominator}
+
+}
+
+export default { group_list, fraction }