diff --git a/src/vs/workbench/parts/debug/browser/media/debugHover.css b/src/vs/workbench/parts/debug/browser/media/debugHover.css
index a734651beab4d..6dd157e94495f 100644
--- a/src/vs/workbench/parts/debug/browser/media/debugHover.css
+++ b/src/vs/workbench/parts/debug/browser/media/debugHover.css
@@ -26,7 +26,7 @@
 	word-break: normal;
 	text-overflow: ellipsis;
 	height: 18px;
-	overflow: hidden;
+	overflow: auto;
 	border-bottom: 1px solid rgba(128, 128, 128, 0.35);
 }
 
@@ -64,6 +64,8 @@
 .monaco-editor .debug-hover-widget .value {
 	white-space: pre-wrap;
 	color: rgba(108, 108, 108, 0.8);
+	overflow: auto;
+	max-height: 500px;
 }
 
 .monaco-editor .debug-hover-widget .error {
diff --git a/src/vs/workbench/parts/debug/electron-browser/debugHover.ts b/src/vs/workbench/parts/debug/electron-browser/debugHover.ts
index ce54f235ae5f2..946fe4db9390e 100644
--- a/src/vs/workbench/parts/debug/electron-browser/debugHover.ts
+++ b/src/vs/workbench/parts/debug/electron-browser/debugHover.ts
@@ -21,13 +21,13 @@ import { IDebugService, IExpression, IExpressionContainer } from 'vs/workbench/p
 import { Expression } from 'vs/workbench/parts/debug/common/debugModel';
 import { VariablesRenderer, renderExpressionValue, VariablesDataSource } from 'vs/workbench/parts/debug/electron-browser/debugViewer';
 import { IListService } from 'vs/platform/list/browser/listService';
+import { DomScrollableElement } from 'vs/base/browser/ui/scrollbar/scrollableElement';
 import { attachListStyler, attachStylerCallback } from 'vs/platform/theme/common/styler';
 import { IThemeService } from 'vs/platform/theme/common/themeService';
 import { editorHoverBackground, editorHoverBorder } from 'vs/platform/theme/common/colorRegistry';
 
 const $ = dom.$;
 const MAX_ELEMENTS_SHOWN = 18;
-const MAX_VALUE_RENDER_LENGTH_IN_HOVER = 4096;
 
 export class DebugHoverWidget implements IContentWidget {
 
@@ -46,6 +46,7 @@ export class DebugHoverWidget implements IContentWidget {
 	private valueContainer: HTMLElement;
 	private stoleFocus: boolean;
 	private toDispose: lifecycle.IDisposable[];
+	private scrollbar: DomScrollableElement;
 
 	constructor(
 		private editor: ICodeEditor,
@@ -58,9 +59,12 @@ export class DebugHoverWidget implements IContentWidget {
 		this.create(instantiationService);
 		this.registerListeners();
 
-		this.valueContainer = dom.append(this.domNode, $('.value'));
+		this.valueContainer = $('.value');
 		this.valueContainer.tabIndex = 0;
 		this.valueContainer.setAttribute('role', 'tooltip');
+		this.scrollbar = new DomScrollableElement(this.valueContainer, { canUseTranslate3d: false });
+		this.domNode.appendChild(this.scrollbar.getDomNode());
+		this.toDispose.push(this.scrollbar);
 
 		this._isVisible = false;
 		this.showAtPosition = null;
@@ -249,9 +253,9 @@ export class DebugHoverWidget implements IContentWidget {
 			this.valueContainer.hidden = false;
 			renderExpressionValue(expression, this.valueContainer, {
 				showChanged: false,
-				maxValueLength: MAX_VALUE_RENDER_LENGTH_IN_HOVER,
 				preserveWhitespace: true
 			});
+			this.scrollbar.scanDomNode();
 			this.valueContainer.title = '';
 			this.editor.layoutContentWidget(this);
 			if (focus) {