diff --git a/public/js/extra.js b/public/js/extra.js
index a5be425..6febd88 100644
--- a/public/js/extra.js
+++ b/public/js/extra.js
@@ -8,6 +8,7 @@ require('prismjs/components/prism-go')
 require('prismjs/components/prism-typescript')
 require('prismjs/components/prism-jsx')
 require('prismjs/components/prism-makefile')
+require('prismjs/components/prism-gherkin')
 
 import Prism from 'prismjs'
 import hljs from 'highlight.js'
@@ -510,7 +511,7 @@ export function finishView (view) {
               result = {
                 value: code
               }
-            } else if (reallang === 'haskell' || reallang === 'go' || reallang === 'typescript' || reallang === 'jsx') {
+            } else if (reallang === 'haskell' || reallang === 'go' || reallang === 'typescript' || reallang === 'jsx' || reallang === 'gherkin') {
               code = S(code).unescapeHTML().s
               result = {
                 value: Prism.highlight(code, Prism.languages[reallang])
diff --git a/public/js/index.js b/public/js/index.js
index 8a7e83b..9a8ee11 100644
--- a/public/js/index.js
+++ b/public/js/index.js
@@ -92,7 +92,7 @@ var cursorMenuThrottle = 50
 var cursorActivityDebounce = 50
 var cursorAnimatePeriod = 100
 var supportContainers = ['success', 'info', 'warning', 'danger']
-var supportCodeModes = ['javascript', 'typescript', 'jsx', 'htmlmixed', 'htmlembedded', 'css', 'xml', 'clike', 'clojure', 'ruby', 'python', 'shell', 'php', 'sql', 'haskell', 'coffeescript', 'yaml', 'pug', 'lua', 'cmake', 'nginx', 'perl', 'sass', 'r', 'dockerfile', 'tiddlywiki', 'mediawiki', 'go']
+var supportCodeModes = ['javascript', 'typescript', 'jsx', 'htmlmixed', 'htmlembedded', 'css', 'xml', 'clike', 'clojure', 'ruby', 'python', 'shell', 'php', 'sql', 'haskell', 'coffeescript', 'yaml', 'pug', 'lua', 'cmake', 'nginx', 'perl', 'sass', 'r', 'dockerfile', 'tiddlywiki', 'mediawiki', 'go', 'gherkin']
 var supportCharts = ['sequence', 'flow', 'graphviz', 'mermaid', 'abc']
 var supportHeaders = [
   {