diff --git a/dist/index.html b/dist/index.html
index f25925d13..8d856d04e 100644
--- a/dist/index.html
+++ b/dist/index.html
@@ -16,6 +16,8 @@ C -->|Two| E[iPhone]
 C -->|Three| F[Car]
 click A "index.html#link-clicked" "link test"
 click B testClick "click test"
+classDef someclass fill:#f96;
+class A someclass;
   </div>
 
   <hr/>
diff --git a/src/diagrams/flowchart/flowRenderer.js b/src/diagrams/flowchart/flowRenderer.js
index fee2623be..1cd3e8e88 100644
--- a/src/diagrams/flowchart/flowRenderer.js
+++ b/src/diagrams/flowchart/flowRenderer.js
@@ -215,18 +215,7 @@ export const getClasses = function (text) {
 
   // Parse the graph definition
   parser.parse(text)
-
-  const classes = flowDb.getClasses()
-
-  // Add default class if undefined
-  if (typeof (classes.default) === 'undefined') {
-    classes.default = { id: 'default' }
-    classes.default.styles = []
-    classes.default.clusterStyles = ['rx:4px', 'fill: rgb(255, 255, 222)', 'rx: 4px', 'stroke: rgb(170, 170, 51)', 'stroke-width: 1px']
-    classes.default.nodeLabelStyles = ['fill:#000', 'stroke:none', 'font-weight:300', 'font-family:"Helvetica Neue",Helvetica,Arial,sans-serf', 'font-size:14px']
-    classes.default.edgeLabelStyles = ['fill:#000', 'stroke:none', 'font-weight:300', 'font-family:"Helvetica Neue",Helvetica,Arial,sans-serf', 'font-size:14px']
-  }
-  return classes
+  return flowDb.getClasses()
 }
 
 /**
diff --git a/src/mermaidAPI.js b/src/mermaidAPI.js
index 8b5650a0a..2250aff66 100644
--- a/src/mermaidAPI.js
+++ b/src/mermaidAPI.js
@@ -380,8 +380,17 @@ const render = function (id, txt, cb, container) {
   const svg = element.firstChild
   const firstChild = svg.firstChild
 
+  // classDef
+  let style = themes[config.theme] || themes.default
+  if (graphType === 'flowchart') {
+    const classes = flowRenderer.getClasses(txt)
+    for (const className in classes) {
+      style += `\n.${className} rect,.${className} polygon,.${className} circle,.${className} ellipse{${classes[className].styles.join(' !important;')} !important;}`
+    }
+  }
+
   const style1 = document.createElement('style')
-  style1.innerHTML = scope(themes[config.theme] || themes.default, `#${id}`)
+  style1.innerHTML = scope(style, `#${id}`)
   svg.insertBefore(style1, firstChild)
 
   const style2 = document.createElement('style')