diff --git a/package-lock.json b/package-lock.json
index c9b2e409..7ab88ee3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -5404,7 +5404,7 @@
       "integrity": "sha512-+eqpz5j8WONSzxmc4avCN4XX/6q5+J6JfWz2AaluZIOVNgXPxUjXBhKS73+nRhM3nE1pGeRMqkyZevTQWgYTTw==",
       "dev": true
     },
-     "dictionary-en-gb": {
+    "dictionary-en-gb": {
       "version": "2.2.2",
       "resolved": "https://registry.npmjs.org/dictionary-en-gb/-/dictionary-en-gb-2.2.2.tgz",
       "integrity": "sha512-36Pz/2BGmJfXtAo5+IGOi+U6gwtxFsFXFJMOX0FC1z2YeLd1IXkxsfAhieC06OrdGie3SqCZmUOYeYgct5Hzzw==",
diff --git a/public/js/lib/renderer/fretboard/fretboard.js b/public/js/lib/renderer/fretboard/fretboard.js
index 48d1cb78..c7e56fd1 100644
--- a/public/js/lib/renderer/fretboard/fretboard.js
+++ b/public/js/lib/renderer/fretboard/fretboard.js
@@ -1,4 +1,5 @@
 /* global $ */
+import escapeHTML from 'lodash/escape'
 
 import './css/i.css'
 import dotEmpty from './svg/dotEmpty.svg'
@@ -41,7 +42,7 @@ export const renderFretBoard = (content, { title: fretTitle = '', type = '' }) =
   const fretboardHTML = $(`<div class="${containerClass}"></div>`)
 
   if (fretTitle) {
-    $(fretboardHTML).append(`<div class="fretTitle">${fretTitle}</div>`)
+    $(fretboardHTML).append(`<div class="fretTitle">${escapeHTML(fretTitle)}</div>`)
   }
 
   // create fretboard background HTML