diff --git a/packages/mermaid/src/diagrams/state/styles.js b/packages/mermaid/src/diagrams/state/styles.js
index fe3d7078b..e2a70ffec 100644
--- a/packages/mermaid/src/diagrams/state/styles.js
+++ b/packages/mermaid/src/diagrams/state/styles.js
@@ -68,6 +68,15 @@ g.stateGroup line {
   fill: ${options.labelBackgroundColor};
   opacity: 0.5;
 }
+.edgeLabel {
+  background-color: ${options.edgeLabelBackground};
+  rect {
+    opacity: 0.5;
+    background-color: ${options.edgeLabelBackground};
+    fill: ${options.edgeLabelBackground};
+  }
+  text-align: center;
+}
 .edgeLabel .label text {
   fill: ${options.transitionLabelColor || options.tertiaryTextColor};
 }
diff --git a/packages/mermaid/src/themes/theme-default.js b/packages/mermaid/src/themes/theme-default.js
index d95ccf59e..dea1a6163 100644
--- a/packages/mermaid/src/themes/theme-default.js
+++ b/packages/mermaid/src/themes/theme-default.js
@@ -34,7 +34,7 @@ class Theme {
     this.arrowheadColor = '#333333';
     this.fontFamily = '"trebuchet ms", verdana, arial, sans-serif';
     this.fontSize = '16px';
-    this.labelBackground = '#e8e8e8';
+    this.labelBackground = 'rgba(232,232,232,0.6)';
     this.textColor = '#333';
     this.THEME_COLOR_LIMIT = 12;