diff --git a/src/components/View.svelte b/src/components/View.svelte
index f7e1f73e..e604bcc3 100644
--- a/src/components/View.svelte
+++ b/src/components/View.svelte
@@ -28,6 +28,9 @@ const detectType = text => {
   if (text.match(/^\s*gitGraph/)) {
     return 'git';
   }
+  if (text.match(/^\s*flowchart/)) {
+    return 'flowchart';
+  }
 
   if (text.match(/^\s*info/)) {
     return 'info';
diff --git a/src/components/editor-utils.js b/src/components/editor-utils.js
index 6cd21948..c7484fbd 100644
--- a/src/components/editor-utils.js
+++ b/src/components/editor-utils.js
@@ -4,7 +4,7 @@ export const initEditor = monaco => {
   // Register a tokens provider for the language
   monaco.languages.setMonarchTokensProvider('mermaid', {
     typeKeywords: [
-      'graph', 'stateDiagram', 'sequenceDiagram', 'classDiagram', 'pie'
+      'graph', 'stateDiagram', 'sequenceDiagram', 'classDiagram', 'pie', 'flowchart', 'gantt'
     ],
     keywords: [
     'patricipant','as'