diff --git a/lib/components/style-sheet.js b/lib/components/style-sheet.js
index a9bfdfc5..4c90b394 100644
--- a/lib/components/style-sheet.js
+++ b/lib/components/style-sheet.js
@@ -5,6 +5,7 @@ export default class StyleSheet extends React.PureComponent {
     const {
       customCSS,
       colors,
+      backgroundColor,
       cursorColor,
       fontSize,
       fontFamily,
@@ -75,7 +76,7 @@ export default class StyleSheet extends React.PureComponent {
 
           .terminal.focus:not(.xterm-cursor-style-underline):not(.xterm-cursor-style-bar) .terminal-cursor {
             background-color: ${cursorColor};
-            color: #000;
+            color: ${backgroundColor};
           }
 
           .terminal:not(.focus) .terminal-cursor {
diff --git a/lib/components/terms.js b/lib/components/terms.js
index 406b6585..4a1a340d 100644
--- a/lib/components/terms.js
+++ b/lib/components/terms.js
@@ -89,6 +89,7 @@ export default class Terms extends Component {
             terms: this.terms,
             activeSession: this.props.activeSession,
             sessions: this.props.sessions,
+            backgroundColor: this.props.backgroundColor,
             borderColor: this.props.borderColor,
             cursorShape: this.props.cursorShape,
             cursorBlink: this.props.cursorBlink,
@@ -119,6 +120,7 @@ export default class Terms extends Component {
         {this.props.customChildren}
         <StyleSheet
           colors={this.props.colors}
+          backgroundColor={this.props.backgroundColor}
           customCSS={this.props.customCSS}
           cursorColor={this.props.cursorColor}
           fontSize={this.props.fontSize}