diff --git a/core/renderers/common/debugger.js b/core/renderers/common/debugger.js
index 965f749c8..68c4583f4 100644
--- a/core/renderers/common/debugger.js
+++ b/core/renderers/common/debugger.js
@@ -54,24 +54,21 @@ Blockly.blockRendering.Debug = function() {
    * @type {SVGElement}
    */
   this.svgRoot_ = null;
-
-  /**
-   * @type {Object} Configuration object containing booleans to enable and
-   *     disable debug rendering of specific rendering components.
-   */
-  this.config_ = Blockly.blockRendering.Debug.getDebugConfig();
 };
 
-Blockly.blockRendering.Debug.getDebugConfig = function() {
-  return {
-    // rowSpacers: true,
-    // elemSpacers: true,
-    // rows: true,
-    elems: true,
-    // connections: true,
-    blockBounds: true,
-    // connectedBlockBounds: true
-  };
+/**
+ * Configuration object containing booleans to enable and disable debug
+ * rendering of specific rendering components.
+ * @type {!Object.<string, boolean>}
+ */
+Blockly.blockRendering.Debug.config = {
+  rowSpacers: true,
+  elemSpacers: true,
+  rows: true,
+  elems: true,
+  connections: true,
+  blockBounds: true,
+  connectedBlockBounds: true
 };
 
 /**
@@ -94,7 +91,7 @@ Blockly.blockRendering.Debug.prototype.clearElems = function() {
  * @package
  */
 Blockly.blockRendering.Debug.prototype.drawSpacerRow = function(row, cursorY, isRtl) {
-  if (!this.config_.rowSpacers) {
+  if (!Blockly.blockRendering.Debug.config.rowSpacers) {
     return;
   }
 
@@ -121,7 +118,7 @@ Blockly.blockRendering.Debug.prototype.drawSpacerRow = function(row, cursorY, is
  * @package
  */
 Blockly.blockRendering.Debug.prototype.drawSpacerElem = function(elem, rowHeight, isRtl) {
-  if (!this.config_.elemSpacers) {
+  if (!Blockly.blockRendering.Debug.config.elemSpacers) {
     return;
   }
 
@@ -153,7 +150,7 @@ Blockly.blockRendering.Debug.prototype.drawSpacerElem = function(elem, rowHeight
  * @package
  */
 Blockly.blockRendering.Debug.prototype.drawRenderedElem = function(elem, isRtl) {
-  if (this.config_.elems) {
+  if (Blockly.blockRendering.Debug.config.elems) {
     var xPos = elem.xPos;
     if (isRtl) {
       xPos = -(xPos + elem.width);
@@ -174,7 +171,8 @@ Blockly.blockRendering.Debug.prototype.drawRenderedElem = function(elem, isRtl)
   }
 
 
-  if (Blockly.blockRendering.Types.isInput(elem) && this.config_.connections) {
+  if (Blockly.blockRendering.Types.isInput(elem) &&
+      Blockly.blockRendering.Debug.config.connections) {
     this.drawConnection(elem.connection);
   }
 };
@@ -187,7 +185,7 @@ Blockly.blockRendering.Debug.prototype.drawRenderedElem = function(elem, isRtl)
  * @package
  */
 Blockly.blockRendering.Debug.prototype.drawConnection = function(conn) {
-  if (!this.config_.connections) {
+  if (!Blockly.blockRendering.Debug.config.connections) {
     return;
   }
 
@@ -231,7 +229,7 @@ Blockly.blockRendering.Debug.prototype.drawConnection = function(conn) {
  * @package
  */
 Blockly.blockRendering.Debug.prototype.drawRenderedRow = function(row, cursorY, isRtl) {
-  if (!this.config_.rows) {
+  if (!Blockly.blockRendering.Debug.config.rows) {
     return;
   }
   this.debugElements_.push(Blockly.utils.dom.createSvgElement('rect',
@@ -251,7 +249,7 @@ Blockly.blockRendering.Debug.prototype.drawRenderedRow = function(row, cursorY,
     return;
   }
 
-  if (this.config_.connectedBlockBounds) {
+  if (Blockly.blockRendering.Debug.config.connectedBlockBounds) {
     this.debugElements_.push(Blockly.utils.dom.createSvgElement('rect',
         {
           'class': 'connectedBlockWidth blockRenderDebug',
@@ -295,7 +293,7 @@ Blockly.blockRendering.Debug.prototype.drawRowWithElements = function(row, curso
  * @package
  */
 Blockly.blockRendering.Debug.prototype.drawBoundingBox = function(info) {
-  if (!this.config_.blockBounds) {
+  if (!Blockly.blockRendering.Debug.config.blockBounds) {
     return;
   }
   // Bounding box without children.
@@ -315,7 +313,7 @@ Blockly.blockRendering.Debug.prototype.drawBoundingBox = function(info) {
       },
       this.svgRoot_));
 
-  if (this.config_.connectedBlockBounds) {
+  if (Blockly.blockRendering.Debug.config.connectedBlockBounds) {
     // Bounding box with children.
     xPos = info.RTL ? -info.widthWithChildren : 0;
     this.debugElements_.push(Blockly.utils.dom.createSvgElement('rect',
diff --git a/tests/playground.html b/tests/playground.html
index d765e5452..acacd898f 100644
--- a/tests/playground.html
+++ b/tests/playground.html
@@ -134,6 +134,7 @@ function start() {
           }
       });
   addToolboxButtonCallbacks();
+  addRenderDebugOptionsCheckboxes();
   // Restore previously displayed text.
   if (sessionStorage) {
     var text = sessionStorage.getItem('textarea');
@@ -146,6 +147,10 @@ function start() {
     // Restore render debug state.
     var renderDebugState = sessionStorage.getItem('blockRenderDebug');
     toggleRenderingDebug(Boolean(Number(renderDebugState)));
+    // Restore render debug options state.
+    var renderDebugOptionsState =
+        JSON.parse(sessionStorage.getItem('blockRenderDebugOptions'));
+    setRenderDebugOptionCheckboxState(renderDebugOptionsState);
   } else {
     // MSIE 11 does not support sessionStorage on file:// URLs.
     logEvents(false);
@@ -260,6 +265,52 @@ function addToolboxButtonCallbacks() {
       'removeDynamicOption', Blockly.TestBlocks.removeDynamicDropdownOption_);
 }
 
+function setRenderDebugOptionCheckboxState(overrideOptions) {
+  Blockly.blockRendering.Debug.config = overrideOptions || {};
+  if (!overrideOptions) {
+    return;
+  }
+  var renderDebugOptionsListEl = document.getElementById('renderDebugOptions');
+  var renderDebugOptionInputs =
+      renderDebugOptionsListEl.getElementsByTagName('input');
+  for (var i = 0, optionInput;
+      (optionInput = renderDebugOptionInputs[i]); i++) {
+    var optionName = optionInput.getAttribute('data-optionName');
+    optionInput.checked = !!overrideOptions[optionName];
+  }
+}
+
+function updateRenderDebugOptions(e) {
+  var target = e.target;
+  var optionName = target.getAttribute('data-optionName');
+  var config = Blockly.blockRendering.Debug.config;
+  config[optionName] = !!target.checked;
+  sessionStorage.setItem(
+      'blockRenderDebugOptions', JSON.stringify(config));
+  workspace.render();
+}
+
+function addRenderDebugOptionsCheckboxes() {
+  var renderDebugConfig = Blockly.blockRendering.Debug.config;
+  var renderDebugOptionsListEl = document.getElementById('renderDebugOptions');
+  var optionNames = Object.keys(renderDebugConfig);
+  for (var i = 0, optionName; (optionName = optionNames[i]); i++) {
+    var optionCheckId = 'RenderDebug' + optionName + 'Check';
+    var optionLabel = document.createElement('label');
+    optionLabel.setAttribute('for', optionCheckId);
+    optionLabel.textContent = optionName;
+    var optionCheck = document.createElement('input');
+    optionCheck.setAttribute('type', 'checkbox');
+    optionCheck.setAttribute('id', optionCheckId);
+    optionCheck.setAttribute('data-optionName', optionName);
+    optionCheck.onclick = updateRenderDebugOptions;
+    var optionLi = document.createElement('li');
+    optionLi.appendChild(optionLabel);
+    optionLi.appendChild(optionCheck);
+    renderDebugOptionsListEl.appendChild(optionLi);
+  }
+}
+
 function changeTheme() {
   var theme = document.getElementById('themeChanger');
   if (theme.value === "modern") {
@@ -352,9 +403,11 @@ function toggleRenderingDebug(state) {
   if (state) {
     document.getElementById('blocklyDiv').className = 'renderingDebug';
     Blockly.blockRendering.startDebugger();
+    document.getElementById('renderDebugOptions').style.display = 'block';
   } else {
     document.getElementById('blocklyDiv').className = '';
     Blockly.blockRendering.stopDebugger();
+    document.getElementById('renderDebugOptions').style.display = 'none';
   }
 }
 
@@ -434,39 +487,46 @@ var spaghettiXml = [
 </script>
 
 <style>
-html, body {
-  height: 100%;
-}
-body {
-  background-color: #fff;
-  font-family: sans-serif;
-  overflow: hidden;
-}
-h1 {
-  font-weight: normal;
-  font-size: 140%;
-}
-#blocklyDiv {
-  float: right;
-  height: 95%;
-  width: 70%;
-}
-#importExport {
-  font-family: monospace;
-}
+  html, body {
+    height: 100%;
+  }
+  body {
+    background-color: #fff;
+    font-family: sans-serif;
+    overflow: hidden;
+  }
+  h1 {
+    font-weight: normal;
+    font-size: 140%;
+  }
+  #blocklyDiv {
+    float: right;
+    height: 95%;
+    width: 70%;
+  }
+  #importExport {
+    font-family: monospace;
+  }
 
-.ioLabel>.blocklyFlyoutLabelText {
-  font-style: italic;
-}
+  .ioLabel>.blocklyFlyoutLabelText {
+    font-style: italic;
+  }
 
-#blocklyDiv.renderingDebug .blockRenderDebug {
-  display: block;
-}
+  #blocklyDiv.renderingDebug .blockRenderDebug {
+    display: block;
+  }
 
-.blockRenderDebug {
-  display: none;
-}
+  .playgroundToggleOptions {
+    list-style: none;
+    padding: 0;
+  }
+  .playgroundToggleOptions li {
+    margin-top: 1em;
+  }
 
+  .blockRenderDebug {
+    display: none;
+  }
 </style>
 </head>
 <body onload="start()">
@@ -530,20 +590,21 @@ h1 {
     <input type="button" value="Airstrike!" onclick="airstrike(100)">
     <input type="button" value="Spaghetti!" onclick="spaghetti(8)">
   </p>
-  <p>
-    Log events: &nbsp;
-    <input type="checkbox" onclick="logEvents(this.checked)" id="logCheck">
-  </p>
-
-  <p>
-    Block rendering debug: &nbsp;
-    <input type="checkbox" onclick="toggleRenderingDebug(this.checked)" id="blockRenderDebugCheck">
-  </p>
-
-  <p>
-    Enable Accessibility Mode: &nbsp;
-    <input type="checkbox" onclick="toggleAccessibilityMode(this.checked)" id="accessibilityModeCheck">
-  </p>
+  <ul class="playgroundToggleOptions">
+    <li>
+      <label for="logCheck">Log events:</label>
+      <input type="checkbox" onclick="logEvents(this.checked)" id="logCheck">
+    </li>
+    <li>
+      <label for="blockRenderDebugCheck">Enable block rendering debug:</label>
+      <input type="checkbox" onclick="toggleRenderingDebug(this.checked)" id="blockRenderDebugCheck">
+      <ul id="renderDebugOptions"></ul>
+    </li>
+    <li>
+      <label for="accessibilityModeCheck">Enable Accessibility Mode:</label>
+      <input type="checkbox" onclick="toggleAccessibilityMode(this.checked)" id="accessibilityModeCheck">
+    </li>
+  </ul>
 
 
   <!-- The next three blocks of XML are sample toolboxes for testing basic