diff --git a/src/themes/classDiagram.scss b/src/themes/class.scss
similarity index 100%
rename from src/themes/classDiagram.scss
rename to src/themes/class.scss
diff --git a/src/themes/gitGraph.scss b/src/themes/git.scss
similarity index 100%
rename from src/themes/gitGraph.scss
rename to src/themes/git.scss
diff --git a/src/themes/mermaid.scss b/src/themes/mermaid.scss
index 177270f1f..adefd04f4 100644
--- a/src/themes/mermaid.scss
+++ b/src/themes/mermaid.scss
@@ -1,24 +1,24 @@
-  @import 'flow';
-  @import 'sequenceDiagram';
-  @import 'gantt';
-  @import 'classDiagram';
-  @import 'gitGraph';
+@import 'flow';
+@import 'sequence';
+@import 'gantt';
+@import 'class';
+@import 'git';
 
-  .node text {
-    font-family: 'trebuchet ms', verdana, arial;
-    font-size: 14px;
-  }
+.node text {
+  font-family: 'trebuchet ms', verdana, arial;
+  font-size: 14px;
+}
 
-  div.mermaidTooltip {
-    position: absolute;
-    text-align: center;
-    max-width: 200px;
-    padding: 2px;
-    font-family: 'trebuchet ms', verdana, arial;
-    font-size: 12px;
-    background: $secondBkg;
-    border: 1px solid $border2;
-    border-radius: 2px;
-    pointer-events: none;
-    z-index: 100;
-  }
+div.mermaidTooltip {
+  position: absolute;
+  text-align: center;
+  max-width: 200px;
+  padding: 2px;
+  font-family: 'trebuchet ms', verdana, arial;
+  font-size: 12px;
+  background: $secondBkg;
+  border: 1px solid $border2;
+  border-radius: 2px;
+  pointer-events: none;
+  z-index: 100;
+}
diff --git a/src/themes/sequenceDiagram.scss b/src/themes/sequence.scss
similarity index 100%
rename from src/themes/sequenceDiagram.scss
rename to src/themes/sequence.scss
diff --git a/todo.md b/todo.md
index 0506f55bc..64d492bbb 100644
--- a/todo.md
+++ b/todo.md
@@ -1,10 +1,9 @@
 - Get familar with jison
 - git graph requires a blank line at the end. why?
 - Create a desktop client
+- Flowchart `interpolate` is useless because there is no rendering code using it
+- Each type of diagram should have its own set of CSS.
 - Support customization of gantt diagram xAxis format
     - https://github.com/d3/d3-time-format#api-reference
     - https://bl.ocks.org/wboykinm/34627426d84f3242e0e6ecb2339e9065
     - Some one created a great PR: https://github.com/knsv/mermaid/pull/624
-- Flowchart `interpolate` is useless because there is no rendering code using it
-- mermaid live editor saved svg file has different font-size.
-    - Should not have removed this part: https://github.com/knsv/mermaid/pull/577#issuecomment-372116281