diff --git a/docs/_sidebar.md b/docs/_sidebar.md
index 5c5a758365..fbb9822ca9 100644
--- a/docs/_sidebar.md
+++ b/docs/_sidebar.md
@@ -15,6 +15,7 @@
   - [Pie Chart](pie.md)
   - [Requirement Diagram](requirementDiagram.md)
   - [Gitgraph (Git) Diagram 🔥](gitgraph.md)
+  - [C4C Diagram (Context) Diagram 🦺⚠️](c4c.md)
   - [Other Examples](examples.md)
 
 - ⚙️ Deployment and Configuration
diff --git a/docs/c4c.md b/docs/c4c.md
new file mode 100644
index 0000000000..9d1f1ec6f6
--- /dev/null
+++ b/docs/c4c.md
@@ -0,0 +1,46 @@
+# C4C Diagrams
+
+**Edit this Page** [![N|Solid](img/GitHub-Mark-32px.png)](https://github.com/mermaid-js/mermaid/blob/develop/docs/gitgraph.md)
+> C4 Diagram: This is an experimental diagram for now. The syntax and properties can change in future releases. Proper documentation will be provided when the syntax is stable.
+
+
+
+Mermaid's c4 diagram sytax is compatible with plantUML. See example below:
+
+```mermaid-example
+    C4Context
+      title System Context diagram for Internet Banking System
+
+      Person(customerA, "Banking Customer A", "A customer of the bank, with personal bank accounts.")
+      Person(customerB, "Banking Customer B")
+      Person_Ext(customerC, "Banking Customer C")
+      System(SystemAA, "Internet Banking System", "Allows customers to view information about their bank accounts, and make payments.")
+
+      Person(customerD, "Banking Customer D", "A customer of the bank, <br/> with personal bank accounts.")
+
+      Enterprise_Boundary(b1, "BankBoundary") {
+
+        SystemDb_Ext(SystemE, "Mainframe Banking System", "Stores all of the core banking information about customers, accounts, transactions, etc.")
+
+        System_Boundary(b2, "BankBoundary2") {
+          System(SystemA, "Banking System A")
+          System(SystemB, "Banking System B", "A system of the bank, with personal bank accounts.")
+        }
+
+        System_Ext(SystemC, "E-mail system", "The internal Microsoft Exchange e-mail system.")
+        SystemDb(SystemD, "Banking System D Database", "A system of the bank, with personal bank accounts.")
+
+        Boundary(b3, "BankBoundary3", "boundary") {
+          SystemQueue(SystemF, "Banking System F Queue", "A system of the bank, with personal bank accounts.")
+          SystemQueue_Ext(SystemG, "Banking System G Queue", "A system of the bank, with personal bank accounts.")
+        }
+      }
+
+      BiRel(customerA, SystemAA, "Uses")
+      BiRel(SystemAA, SystemE, "Uses")
+      Rel(SystemAA, SystemC, "Sends e-mails", "SMTP")
+      Rel(SystemC, customerA, "Sends e-mails to")
+
+
+```
+
diff --git a/src/diagrams/c4/c4Db.js b/src/diagrams/c4/c4Db.js
index c483df2874..b346d9b165 100644
--- a/src/diagrams/c4/c4Db.js
+++ b/src/diagrams/c4/c4Db.js
@@ -2,6 +2,7 @@ import mermaidAPI from '../../mermaidAPI';
 import * as configApi from '../../config';
 import { log } from '../../logger';
 import { sanitizeText } from '../common/common';
+import { setAccTitle, getAccTitle, getAccDescription, setAccDescription } from '../../commonDb';
 
 let c4ShapeArray = [];
 let boundaryParseStack = [''];
@@ -443,15 +444,6 @@ export const setTitle = function (txt) {
   title = sanitizedText;
 };
 
-const setAccDescription = function (description_lex) {
-  let sanitizedText = sanitizeText(description_lex, configApi.getConfig());
-  description = sanitizedText;
-};
-
-const getAccDescription = function () {
-  return description;
-};
-
 export default {
   addPersonOrSystem,
   addPersonOrSystemBoundary,
@@ -472,6 +464,8 @@ export default {
   getRels,
   getTitle,
   getC4Type,
+  setAccTitle,
+  getAccTitle,
   getAccDescription,
   setAccDescription,
   parseDirective,