diff --git a/src/Terminal.ts b/src/Terminal.ts
index 62449654..e9b499b1 100644
--- a/src/Terminal.ts
+++ b/src/Terminal.ts
@@ -150,7 +150,7 @@ const DEFAULT_OPTIONS: ITerminalOptions = {
   cursorBlink: false,
   cursorStyle: 'block',
   bellSound: BellSound,
-  bellStyles: [BellStyles.Sound],
+  bellStyles: [BellStyles.Sound, BellStyles.Visual],
   scrollback: 1000,
   screenKeys: false,
   debug: false,
@@ -180,6 +180,8 @@ export class Terminal extends EventEmitter implements ITerminal, IInputHandlingT
   private helperContainer: HTMLElement;
   private compositionView: HTMLElement;
   private charSizeStyleElement: HTMLStyleElement;
+  private bellAudioElement: HTMLAudioElement;
+  private visualBellTimer: number;
 
   public browser: IBrowser = <any>Browser;
 
@@ -692,7 +694,7 @@ export class Terminal extends EventEmitter implements ITerminal, IInputHandlingT
     this.viewportElement.appendChild(this.viewportScrollArea);
 
     // preload audio
-    if (this.options.bellSound) {
+    if (this.options.bellStyles.indexOf(BellStyles.Sound) > -1) {
       this.bellAudioElement = document.createElement('audio');
       this.bellAudioElement.setAttribute('preload', 'auto');
       this.bellAudioElement.setAttribute('src', this.options.bellSound);
@@ -1889,11 +1891,10 @@ export class Terminal extends EventEmitter implements ITerminal, IInputHandlingT
       this.bellAudioElement.play();
     }
     if (this.options.bellStyles.indexOf(BellStyles.Visual) > -1) {
-      var cursor = this.element.querySelector('.terminal-cursor') as HTMLElement;
-      var originalBackground = cursor.style.backgroundColor;
-      cursor.style.backgroundColor = "#fff";
-      setTimeout(function() {
-        cursor.style.backgroundColor = originalBackground;
+      this.element.classList.add("visual-bell-active");
+      clearTimeout(this.visualBellTimer);
+      this.visualBellTimer = window.setTimeout(() => {
+        this.element.classList.remove("visual-bell-active");
       }, 200);
     }
   }
diff --git a/src/xterm.css b/src/xterm.css
index 7ccad12f..0996742b 100644
--- a/src/xterm.css
+++ b/src/xterm.css
@@ -94,12 +94,12 @@
 }
 
 .terminal:not(.focus) .terminal-cursor {
-    outline: 1px solid #eeeeec;
+    outline: 1px solid #fff;
     outline-offset: -1px;
 }
 
 .terminal.xterm-cursor-style-block.focus:not(.xterm-cursor-blink-on) .terminal-cursor {
-    background-color: #eeeeec;
+    background-color: #fff;
     color: #000;
 }
 
@@ -107,7 +107,7 @@
 .terminal.focus.xterm-cursor-style-underline:not(.xterm-cursor-blink-on) .terminal-cursor::before {
     content: '';
     position: absolute;
-    background-color: #eeeeec;
+    background-color: #fff;
 }
 
 .terminal.focus.xterm-cursor-style-bar:not(.xterm-cursor-blink-on) .terminal-cursor::before {
@@ -124,6 +124,10 @@
     height: 1px;
 }
 
+.visual-bell-active .terminal-cursor {
+  background-color: #fff !important;
+}
+
 .terminal .composition-view {
     background: #000;
     color: #FFF;