diff --git a/blockly_compressed.js b/blockly_compressed.js
index d6a5478ff..c0484801c 100644
--- a/blockly_compressed.js
+++ b/blockly_compressed.js
@@ -999,7 +999,7 @@ Blockly.WorkspaceSvg.prototype.isDeleteArea=function(a){a=Blockly.mouseToSvg(a,B
 Blockly.WorkspaceSvg.prototype.onMouseDown_=function(a){this.markFocused();Blockly.isTargetInput_(a)||(Blockly.svgResize(this),Blockly.terminateDrag_(),Blockly.hideChaff(),a.target&&a.target.nodeName&&("svg"==a.target.nodeName.toLowerCase()||a.target==this.svgBackground_)&&Blockly.selected&&!this.options.readOnly&&Blockly.selected.unselect(),Blockly.isRightButton(a)?this.showContextMenu_(a):this.scrollbar&&(Blockly.removeAllRanges(),this.isScrolling=!0,this.startDragMouseX=a.clientX,this.startDragMouseY=
 a.clientY,this.startDragMetrics=this.getMetrics(),this.startScrollX=this.scrollX,this.startScrollY=this.scrollY,"mouseup"in Blockly.bindEvent_.TOUCH_MAP&&(Blockly.onTouchUpWrapper_=Blockly.bindEvent_(document,"mouseup",null,Blockly.onMouseUp_)),Blockly.onMouseMoveWrapper_=Blockly.bindEvent_(document,"mousemove",null,Blockly.onMouseMove_)),a.stopPropagation())};
 Blockly.WorkspaceSvg.prototype.startDrag=function(a,b,c){a=Blockly.mouseToSvg(a,this.options.svg);a.x/=this.scale;a.y/=this.scale;this.dragDeltaX_=b-a.x;this.dragDeltaY_=c-a.y};Blockly.WorkspaceSvg.prototype.moveDrag=function(a){a=Blockly.mouseToSvg(a,this.options.svg);a.x/=this.scale;a.y/=this.scale;return new goog.math.Coordinate(this.dragDeltaX_+a.x,this.dragDeltaY_+a.y)};
-Blockly.WorkspaceSvg.prototype.onMouseWheel_=function(a){Blockly.terminateDrag_();var b=0<a.deltaY?-1:1,c=Blockly.mouseToSvg(a,this.options.svg);this.zoom(c.x,c.y,b);a.preventDefault()};Blockly.WorkspaceSvg.prototype.cleanUp_=function(){for(var a=this.getTopBlocks(!0),b=0,c=0,d;d=a[c];c++){var e=d.getRelativeToSurfaceXY();d.moveBy(-e.x,b-e.y);b+=d.getHeightWidth().height;b+=Blockly.BlockSvg.MIN_BLOCK_Y;d.snapToGrid()}Blockly.fireUiEvent(window,"resize");this.fireChangeEvent()};
+Blockly.WorkspaceSvg.prototype.onMouseWheel_=function(a){Blockly.terminateDrag_();var b=0<a.deltaY?-1:1,c=Blockly.mouseToSvg(a,this.options.svg);this.zoom(c.x,c.y,b);a.preventDefault()};Blockly.WorkspaceSvg.prototype.cleanUp_=function(){for(var a=this.getTopBlocks(!0),b=0,c=0,d;d=a[c];c++){var e=d.getRelativeToSurfaceXY();d.moveBy(-e.x,b-e.y);d.snapToGrid();b=d.getRelativeToSurfaceXY().y+d.getHeightWidth().height+Blockly.BlockSvg.MIN_BLOCK_Y}Blockly.fireUiEvent(window,"resize");this.fireChangeEvent()};
 Blockly.WorkspaceSvg.prototype.showContextMenu_=function(a){if(!this.options.readOnly){var b=[],c=this.getTopBlocks(!0),d={};d.text=Blockly.Msg.CLEAN_UP;d.enabled=1<c.length;d.callback=this.cleanUp_.bind(this);b.push(d);if(this.options.collapse){for(var e=d=!1,f=0;f<c.length;f++)for(var g=c[f];g;)g.isCollapsed()?d=!0:e=!0,g=g.getNextBlock();var h=function(a){for(var b=0,d=0;d<c.length;d++)for(var e=c[d];e;)setTimeout(e.setCollapsed.bind(e,a),b),e=e.getNextBlock(),b+=10},e={enabled:e};e.text=Blockly.Msg.COLLAPSE_ALL;
 e.callback=function(){h(!0)};b.push(e);d={enabled:d};d.text=Blockly.Msg.EXPAND_ALL;d.callback=function(){h(!1)};b.push(d)}Blockly.ContextMenu.show(a,b,this.RTL)}};Blockly.WorkspaceSvg.prototype.loadAudio_=function(a,b){if(a.length){try{var c=new window.Audio}catch(h){return}for(var d,e=0;e<a.length;e++){var f=a[e],g=f.match(/\.(\w+)$/);if(g&&c.canPlayType("audio/"+g[1])){d=new window.Audio(f);break}}d&&d.play&&(this.SOUNDS_[b]=d)}};
 Blockly.WorkspaceSvg.prototype.preloadAudio_=function(){for(var a in this.SOUNDS_){var b=this.SOUNDS_[a];b.volume=.01;b.play();b.pause();if(goog.userAgent.IPAD||goog.userAgent.IPHONE)break}};
@@ -1221,38 +1221,39 @@ g=e.getSvgRoot();if(!g)throw"block is not rendered.";g=Blockly.getSvgXY_(g,c);g.
 Blockly.Flyout.prototype.getRect=function(){var a=Blockly.mainWorkspace,b=Blockly.getSvgXY_(this.svgGroup_,a).x;this.RTL||(b-=1E9);return new goog.math.Rect(b,-1E9,1E9+this.width_*(this.targetWorkspace_==a?1:a.scale),2E9)};
 Blockly.Flyout.terminateDrag_=function(){Blockly.Flyout.onMouseUpWrapper_&&(Blockly.unbindEvent_(Blockly.Flyout.onMouseUpWrapper_),Blockly.Flyout.onMouseUpWrapper_=null);Blockly.Flyout.onMouseMoveBlockWrapper_&&(Blockly.unbindEvent_(Blockly.Flyout.onMouseMoveBlockWrapper_),Blockly.Flyout.onMouseMoveBlockWrapper_=null);Blockly.Flyout.onMouseMoveWrapper_&&(Blockly.unbindEvent_(Blockly.Flyout.onMouseMoveWrapper_),Blockly.Flyout.onMouseMoveWrapper_=null);Blockly.Flyout.onMouseUpWrapper_&&(Blockly.unbindEvent_(Blockly.Flyout.onMouseUpWrapper_),
 Blockly.Flyout.onMouseUpWrapper_=null);Blockly.Flyout.startDownEvent_=null;Blockly.Flyout.startBlock_=null;Blockly.Flyout.startFlyout_=null};Blockly.Toolbox=function(a){this.workspace_=a};Blockly.Toolbox.prototype.width=0;Blockly.Toolbox.prototype.selectedOption_=null;Blockly.Toolbox.prototype.lastCategory_=null;Blockly.Toolbox.prototype.CONFIG_={indentWidth:19,cssRoot:"blocklyTreeRoot",cssHideRoot:"blocklyHidden",cssItem:"",cssTreeRow:"blocklyTreeRow",cssItemLabel:"blocklyTreeLabel",cssTreeIcon:"blocklyTreeIcon",cssExpandedFolderIcon:"blocklyTreeIconOpen",cssFileIcon:"blocklyTreeIconNone",cssSelectedRow:"blocklyTreeSelected"};
-Blockly.Toolbox.prototype.init=function(){var a=this.workspace_;this.HtmlDiv=goog.dom.createDom("div","blocklyToolboxDiv");this.HtmlDiv.setAttribute("dir",this.workspace_.RTL?"RTL":"LTR");document.body.appendChild(this.HtmlDiv);Blockly.bindEvent_(this.HtmlDiv,"mousedown",this,function(a){Blockly.isRightButton(a)||a.target==this.HtmlDiv?Blockly.hideChaff(!1):Blockly.hideChaff(!0)});this.flyout_=new Blockly.Flyout({parentWorkspace:a,RTL:a.RTL,svg:a.options.svg});goog.dom.insertSiblingAfter(this.flyout_.createDom(),
-a.svgGroup_);this.flyout_.init(a);this.CONFIG_.cleardotPath=a.options.pathToMedia+"1x1.gif";this.CONFIG_.cssCollapsedFolderIcon="blocklyTreeIconClosed"+(this.workspace_.RTL?"Rtl":"Ltr");var b=new Blockly.Toolbox.TreeControl(this,this.CONFIG_);this.tree_=b;b.setShowRootNode(!1);b.setShowLines(!1);b.setShowExpandIcons(!1);b.setSelectedItem(null);this.populate_(a.options.languageTree);b.render(this.HtmlDiv);this.position()};
-Blockly.Toolbox.prototype.dispose=function(){this.flyout_.dispose();this.tree_.dispose();goog.dom.removeNode(this.HtmlDiv);this.workspace_=null};Blockly.Toolbox.prototype.position=function(){var a=this.HtmlDiv;if(a){var b=this.workspace_.options.svg,c=goog.style.getPageOffset(b),b=Blockly.svgSize(b);a.style.left=this.workspace_.RTL?c.x+b.width-a.offsetWidth+"px":c.x+"px";a.style.height=b.height+"px";a.style.top=c.y+"px";this.width=a.offsetWidth;this.workspace_.RTL||--this.width;this.flyout_.position()}};
-Blockly.Toolbox.prototype.populate_=function(a){function b(a,e){for(var f=0,g;g=a.childNodes[f];f++)if(g.tagName)switch(g.tagName.toUpperCase()){case "CATEGORY":var h=c.createNode(g.getAttribute("name"));h.blocks=[];e.add(h);var k=g.getAttribute("custom");k?h.blocks=k:b(g,h);"true"==g.getAttribute("expanded")&&(h.blocks.length&&c.setSelectedItem(h),h.setExpanded(!0));break;case "SEP":e.add(new Blockly.Toolbox.TreeSeparator);break;case "BLOCK":e.blocks.push(g)}}var c=this.tree_;c.removeChildren();
-c.blocks=[];b(a,this.tree_);if(c.blocks.length)throw"Toolbox cannot have both blocks and categories in the root level.";Blockly.fireUiEvent(window,"resize")};Blockly.Toolbox.prototype.clearSelection=function(){this.tree_.setSelectedItem(null)};Blockly.Toolbox.prototype.getRect=function(){var a=this.workspace_.RTL?Blockly.svgSize(this.workspace_.options.svg).width-this.width:-1E7;return new goog.math.Rect(a,-1E7,1E7+this.width,2E7)};
-Blockly.Toolbox.TreeControl=function(a,b){this.toolbox_=a;goog.ui.tree.TreeControl.call(this,goog.html.SafeHtml.EMPTY,b)};goog.inherits(Blockly.Toolbox.TreeControl,goog.ui.tree.TreeControl);Blockly.Toolbox.TreeControl.prototype.enterDocument=function(){Blockly.Toolbox.TreeControl.superClass_.enterDocument.call(this);if(goog.events.BrowserFeature.TOUCH_ENABLED){var a=this.getElement();Blockly.bindEvent_(a,goog.events.EventType.TOUCHSTART,this,this.handleTouchEvent_)}};
-Blockly.Toolbox.TreeControl.prototype.handleTouchEvent_=function(a){a.preventDefault();var b=this.getNodeFromEvent_(a);b&&a.type===goog.events.EventType.TOUCHSTART&&setTimeout(function(){b.onMouseDown(a)},1)};Blockly.Toolbox.TreeControl.prototype.createNode=function(a){return new Blockly.Toolbox.TreeNode(this.toolbox_,a?goog.html.SafeHtml.htmlEscape(a):goog.html.SafeHtml.EMPTY,this.getConfig(),this.getDomHelper())};
-Blockly.Toolbox.TreeControl.prototype.setSelectedItem=function(a){Blockly.removeAllRanges();if(this.selectedItem_!=a){goog.ui.tree.TreeControl.prototype.setSelectedItem.call(this,a);var b=this.toolbox_;a&&a.blocks&&a.blocks.length?(b.flyout_.show(a.blocks),b.lastCategory_!=a.blocks&&(b.flyout_.scrollToTop(),b.lastCategory_=a.blocks)):b.flyout_.hide()}};
+Blockly.Toolbox.prototype.init=function(){var a=this.workspace_;this.HtmlDiv=goog.dom.createDom("div","blocklyToolboxDiv");this.HtmlDiv.setAttribute("dir",a.RTL?"RTL":"LTR");document.body.appendChild(this.HtmlDiv);Blockly.bindEvent_(this.HtmlDiv,"mousedown",this,function(a){Blockly.isRightButton(a)||a.target==this.HtmlDiv?Blockly.hideChaff(!1):Blockly.hideChaff(!0)});this.flyout_=new Blockly.Flyout({parentWorkspace:a,RTL:a.RTL,svg:a.options.svg});goog.dom.insertSiblingAfter(this.flyout_.createDom(),
+a.svgGroup_);this.flyout_.init(a);this.CONFIG_.cleardotPath=a.options.pathToMedia+"1x1.gif";this.CONFIG_.cssCollapsedFolderIcon="blocklyTreeIconClosed"+(a.RTL?"Rtl":"Ltr");var b=new Blockly.Toolbox.TreeControl(this,this.CONFIG_);this.tree_=b;b.setShowRootNode(!1);b.setShowLines(!1);b.setShowExpandIcons(!1);b.setSelectedItem(null);this.populate_(a.options.languageTree);b.render(this.HtmlDiv);this.addColour_(b);this.position()};
+Blockly.Toolbox.prototype.dispose=function(){this.flyout_.dispose();this.tree_.dispose();goog.dom.removeNode(this.HtmlDiv);this.lastCategory_=this.workspace_=null};
+Blockly.Toolbox.prototype.position=function(){var a=this.HtmlDiv;if(a){var b=this.workspace_.options.svg,c=goog.style.getPageOffset(b),b=Blockly.svgSize(b);a.style.left=this.workspace_.RTL?c.x+b.width-a.offsetWidth+"px":c.x+"px";a.style.height=b.height+"px";a.style.top=c.y+"px";this.width=a.offsetWidth;this.workspace_.RTL||--this.width;this.flyout_.position()}};
+Blockly.Toolbox.prototype.populate_=function(a){function b(a,e){for(var f=0,g;g=a.childNodes[f];f++)if(g.tagName)switch(g.tagName.toUpperCase()){case "CATEGORY":var h=c.createNode(g.getAttribute("name"));h.blocks=[];e.add(h);var k=g.getAttribute("custom");k?h.blocks=k:b(g,h);k=g.getAttribute("colour");h.hexColour=goog.isString(k)?Blockly.makeColour(k):"";"true"==g.getAttribute("expanded")&&(h.blocks.length&&c.setSelectedItem(h),h.setExpanded(!0));break;case "SEP":e.add(new Blockly.Toolbox.TreeSeparator);
+break;case "BLOCK":e.blocks.push(g)}}var c=this.tree_;c.removeChildren();c.blocks=[];b(a,this.tree_);if(c.blocks.length)throw"Toolbox cannot have both blocks and categories in the root level.";Blockly.fireUiEvent(window,"resize")};Blockly.Toolbox.prototype.addColour_=function(a){a=a.getChildren();for(var b=0,c;c=a[b];b++){var d="8px solid "+(c.hexColour||"#ddd");this.workspace_.RTL?c.getElement().style.borderLeft=d:c.getElement().style.borderRight=d;this.addColour_(c)}};
+Blockly.Toolbox.prototype.clearSelection=function(){this.tree_.setSelectedItem(null)};Blockly.Toolbox.prototype.getRect=function(){var a=this.workspace_.RTL?Blockly.svgSize(this.workspace_.options.svg).width-this.width:-1E7;return new goog.math.Rect(a,-1E7,1E7+this.width,2E7)};Blockly.Toolbox.TreeControl=function(a,b){this.toolbox_=a;goog.ui.tree.TreeControl.call(this,goog.html.SafeHtml.EMPTY,b)};goog.inherits(Blockly.Toolbox.TreeControl,goog.ui.tree.TreeControl);
+Blockly.Toolbox.TreeControl.prototype.enterDocument=function(){Blockly.Toolbox.TreeControl.superClass_.enterDocument.call(this);if(goog.events.BrowserFeature.TOUCH_ENABLED){var a=this.getElement();Blockly.bindEvent_(a,goog.events.EventType.TOUCHSTART,this,this.handleTouchEvent_)}};Blockly.Toolbox.TreeControl.prototype.handleTouchEvent_=function(a){a.preventDefault();var b=this.getNodeFromEvent_(a);b&&a.type===goog.events.EventType.TOUCHSTART&&setTimeout(function(){b.onMouseDown(a)},1)};
+Blockly.Toolbox.TreeControl.prototype.createNode=function(a){return new Blockly.Toolbox.TreeNode(this.toolbox_,a?goog.html.SafeHtml.htmlEscape(a):goog.html.SafeHtml.EMPTY,this.getConfig(),this.getDomHelper())};
+Blockly.Toolbox.TreeControl.prototype.setSelectedItem=function(a){Blockly.removeAllRanges();var b=this.toolbox_;if(a!=this.selectedItem_&&a!=b.tree_){b.lastCategory_&&(b.lastCategory_.getElement().style.backgroundColor="");if(a){var c=a.hexColour||"#57e";a.getElement().style.backgroundColor=c}goog.ui.tree.TreeControl.prototype.setSelectedItem.call(this,a);a&&a.blocks&&a.blocks.length?(b.flyout_.show(a.blocks),b.lastCategory_!=a&&(b.flyout_.scrollToTop(),b.lastCategory_=a)):b.flyout_.hide()}};
 Blockly.Toolbox.TreeNode=function(a,b,c,d){goog.ui.tree.TreeNode.call(this,b,c,d);a&&(b=function(){Blockly.fireUiEvent(window,"resize")},goog.events.listen(a.tree_,goog.ui.tree.BaseNode.EventType.EXPAND,b),goog.events.listen(a.tree_,goog.ui.tree.BaseNode.EventType.COLLAPSE,b))};goog.inherits(Blockly.Toolbox.TreeNode,goog.ui.tree.TreeNode);Blockly.Toolbox.TreeNode.prototype.getExpandIconSafeHtml=function(){return goog.html.SafeHtml.create("span")};
 Blockly.Toolbox.TreeNode.prototype.onMouseDown=function(a){this.hasChildren()&&this.isUserCollapsible_?(this.toggle(),this.select()):this.isSelected()?this.getTree().setSelectedItem(null):this.select();this.updateRow()};Blockly.Toolbox.TreeNode.prototype.onDoubleClick_=function(a){};Blockly.Toolbox.TreeSeparator=function(){Blockly.Toolbox.TreeNode.call(this,null,"",Blockly.Toolbox.TreeSeparator.CONFIG_)};goog.inherits(Blockly.Toolbox.TreeSeparator,Blockly.Toolbox.TreeNode);
 Blockly.Toolbox.TreeSeparator.CONFIG_={cssTreeRow:"blocklyTreeSeparator"};Blockly.Css={};Blockly.Css.Cursor={OPEN:"handopen",CLOSED:"handclosed",DELETE:"handdelete"};Blockly.Css.currentCursor_="";Blockly.Css.styleSheet_=null;Blockly.Css.mediaPath_="";
 Blockly.Css.inject=function(a,b){if(!Blockly.Css.styleSheet_){var c=".blocklyDraggable {}\n";a&&(c+=Blockly.Css.CONTENT.join("\n"),Blockly.FieldDate&&(c+=Blockly.FieldDate.CSS.join("\n")));Blockly.Css.mediaPath_=b.replace(/[\\\/]$/,"");var c=c.replace(/<<<PATH>>>/g,Blockly.Css.mediaPath_),d=document.createElement("style");document.head.appendChild(d);c=document.createTextNode(c);d.appendChild(c);Blockly.Css.styleSheet_=d.sheet;Blockly.Css.setCursor(Blockly.Css.Cursor.OPEN)}};
 Blockly.Css.setCursor=function(a){if(Blockly.Css.currentCursor_!=a){Blockly.Css.currentCursor_=a;var b="url("+Blockly.Css.mediaPath_+"/"+a+".cur), auto",c=".blocklyDraggable {\n  cursor: "+b+";\n}\n";Blockly.Css.styleSheet_.deleteRule(0);Blockly.Css.styleSheet_.insertRule(c,0);for(var c=document.getElementsByClassName("blocklyToolboxDiv"),d=0,e;e=c[d];d++)e.style.cursor=a==Blockly.Css.Cursor.DELETE?b:"";document.body.parentNode.style.cursor=a==Blockly.Css.Cursor.OPEN?"":b}};
-Blockly.Css.CONTENT=[".blocklySvg {","  background-color: #fff;","  outline: none;","  overflow: hidden;","}",".blocklyWidgetDiv {","  display: none;","  position: absolute;","  z-index: 999;","}",".blocklyTooltipDiv {","  background-color: #ffffc7;","  border: 1px solid #ddc;","  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);","  color: #000;","  display: none;","  font-family: sans-serif;","  font-size: 9pt;","  opacity: 0.9;","  padding: 2px;","  position: absolute;","  z-index: 1000;","}",".blocklyResizeSE {",
-"  cursor: se-resize;","  fill: #aaa;","}",".blocklyResizeSW {","  cursor: sw-resize;","  fill: #aaa;","}",".blocklyResizeLine {","  stroke: #888;","  stroke-width: 1;","}",".blocklyHighlightedConnectionPath {","  fill: none;","  stroke: #fc3;","  stroke-width: 4px;","}",".blocklyPathLight {","  fill: none;","  stroke-linecap: round;","  stroke-width: 1;","}",".blocklySelected>.blocklyPath {","  stroke: #fc3;","  stroke-width: 3px;","}",".blocklySelected>.blocklyPathLight {","  display: none;","}",
-".blocklyDragging>.blocklyPath,",".blocklyDragging>.blocklyPathLight {","  fill-opacity: .8;","  stroke-opacity: .8;","}",".blocklyDragging>.blocklyPathDark {","  display: none;","}",".blocklyDisabled>.blocklyPath {","  fill-opacity: .5;","  stroke-opacity: .5;","}",".blocklyDisabled>.blocklyPathLight,",".blocklyDisabled>.blocklyPathDark {","  display: none;","}",".blocklyText {","  cursor: default;","  fill: #fff;","  font-family: sans-serif;","  font-size: 11pt;","}",".blocklyNonEditableText>text {",
-"  pointer-events: none;","}",".blocklyNonEditableText>rect,",".blocklyEditableText>rect {","  fill: #fff;","  fill-opacity: .6;","}",".blocklyNonEditableText>text,",".blocklyEditableText>text {","  fill: #000;","}",".blocklyEditableText:hover>rect {","  stroke: #fff;","  stroke-width: 2;","}",".blocklyBubbleText {","  fill: #000;","}",".blocklySvg text {","  user-select: none;","  -moz-user-select: none;","  -webkit-user-select: none;","  cursor: inherit;","}",".blocklyHidden {","  display: none;",
-"}",".blocklyFieldDropdown:not(.blocklyHidden) {","  display: block;","}",".blocklyIconGroup {","  cursor: default;","}",".blocklyIconGroup:not(:hover),",".blocklyIconGroupReadonly {","  opacity: .6;","}",".blocklyMinimalBody {","  margin: 0;","  padding: 0;","}",".blocklyCommentTextarea {","  background-color: #ffc;","  border: 0;","  margin: 0;","  padding: 2px;","  resize: none;","}",".blocklyHtmlInput {","  border: none;","  border-radius: 4px;","  font-family: sans-serif;","  height: 100%;",
-"  margin: 0;","  outline: none;","  padding: 0 1px;","  width: 100%","}",".blocklyMainBackground {","  stroke-width: 1;","  stroke: #c6c6c6;","}",".blocklyMutatorBackground {","  fill: #fff;","  stroke: #ddd;","  stroke-width: 1;","}",".blocklyFlyoutBackground {","  fill: #ddd;","  fill-opacity: .8;","}",".blocklyScrollbarBackground {","  opacity: 0;","}",".blocklyScrollbarKnob {","  fill: #ccc;","}",".blocklyScrollbarBackground:hover+.blocklyScrollbarKnob,",".blocklyScrollbarKnob:hover {","  fill: #bbb;",
-"}",".blocklyZoom>image {","  opacity: .4;","}",".blocklyZoom>image:hover {","  opacity: .6;","}",".blocklyZoom>image:active {","  opacity: .8;","}",".blocklyFlyout .blocklyScrollbarKnob {","  fill: #bbb;","}",".blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarKnob,",".blocklyFlyout .blocklyScrollbarKnob:hover {","  fill: #aaa;","}",".blocklyInvalidInput {","  background: #faa;","}",".blocklyAngleCircle {","  stroke: #444;","  stroke-width: 1;","  fill: #ddd;","  fill-opacity: .8;",
-"}",".blocklyAngleMarks {","  stroke: #444;","  stroke-width: 1;","}",".blocklyAngleGauge {","  fill: #f88;","  fill-opacity: .8;  ","}",".blocklyAngleLine {","  stroke: #f00;","  stroke-width: 2;","  stroke-linecap: round;","}",".blocklyContextMenu {","  border-radius: 4px;","}",".blocklyDropdownMenu {","  padding: 0 !important;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","  background: url(<<<PATH>>>/sprites.png) no-repeat -48px -16px !important;",
-"}",".blocklyToolboxDiv {","  background-color: #ddd;","  overflow-x: visible;","  overflow-y: auto;","  position: absolute;","}",".blocklyTreeRoot {","  padding: 4px 0;","}",".blocklyTreeRoot:focus {","  outline: none;","}",".blocklyTreeRow {","  line-height: 22px;","  height: 22px;","  padding-right: 1em;","  white-space: nowrap;","}",'.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {',"  padding-right: 0;","  padding-left: 1em !important;","}",".blocklyTreeRow:hover {","  background-color: #e4e4e4;",
-"}",".blocklyTreeSeparator {","  border-bottom: solid #e5e5e5 1px;","  height: 0px;","  margin: 5px 0;","}",".blocklyTreeIcon {","  background-image: url(<<<PATH>>>/sprites.png);","  height: 16px;","  vertical-align: middle;","  width: 16px;","}",".blocklyTreeIconClosedLtr {","  background-position: -32px -1px;","}",".blocklyTreeIconClosedRtl {","  background-position: 0px -1px;","}",".blocklyTreeIconOpen {","  background-position: -16px -1px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedLtr {",
-"  background-position: -32px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedRtl {","  background-position: 0px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconOpen {","  background-position: -16px -17px;","}",".blocklyTreeIconNone,",".blocklyTreeSelected>.blocklyTreeIconNone {","  background-position: -48px -1px;","}",".blocklyTreeLabel {","  cursor: default;","  font-family: sans-serif;","  font-size: 16px;","  padding: 0 3px;","  vertical-align: middle;","}",".blocklyTreeSelected  {",
-"  background-color: #57e !important;","}",".blocklyTreeSelected .blocklyTreeLabel {","  color: #fff;","}",".blocklyWidgetDiv .goog-palette {","  outline: none;","  cursor: default;","}",".blocklyWidgetDiv .goog-palette-table {","  border: 1px solid #666;","  border-collapse: collapse;","}",".blocklyWidgetDiv .goog-palette-cell {","  height: 13px;","  width: 15px;","  margin: 0;","  border: 0;","  text-align: center;","  vertical-align: middle;","  border-right: 1px solid #666;","  font-size: 1px;",
-"}",".blocklyWidgetDiv .goog-palette-colorswatch {","  position: relative;","  height: 13px;","  width: 15px;","  border: 1px solid #666;","}",".blocklyWidgetDiv .goog-palette-cell-hover .goog-palette-colorswatch {","  border: 1px solid #FFF;","}",".blocklyWidgetDiv .goog-palette-cell-selected .goog-palette-colorswatch {","  border: 1px solid #000;","  color: #fff;","}",".blocklyWidgetDiv .goog-menu {","  background: #fff;","  border-color: #ccc #666 #666 #ccc;","  border-style: solid;","  border-width: 1px;",
-"  cursor: default;","  font: normal 13px Arial, sans-serif;","  margin: 0;","  outline: none;","  padding: 4px 0;","  position: absolute;","  overflow-y: auto;","  overflow-x: hidden;","  max-height: 100%;","  z-index: 20000;","}",".blocklyWidgetDiv .goog-menuitem {","  color: #000;","  font: normal 13px Arial, sans-serif;","  list-style: none;","  margin: 0;","  padding: 4px 7em 4px 28px;","  white-space: nowrap;","}",".blocklyWidgetDiv .goog-menuitem.goog-menuitem-rtl {","  padding-left: 7em;",
-"  padding-right: 28px;","}",".blocklyWidgetDiv .goog-menu-nocheckbox .goog-menuitem,",".blocklyWidgetDiv .goog-menu-noicon .goog-menuitem {","  padding-left: 12px;","}",".blocklyWidgetDiv .goog-menu-noaccel .goog-menuitem {","  padding-right: 20px;","}",".blocklyWidgetDiv .goog-menuitem-content {","  color: #000;","  font: normal 13px Arial, sans-serif;","}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-accel,",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-content {","  color: #ccc !important;",
-"}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-icon {","  opacity: 0.3;","  -moz-opacity: 0.3;","  filter: alpha(opacity=30);","}",".blocklyWidgetDiv .goog-menuitem-highlight,",".blocklyWidgetDiv .goog-menuitem-hover {","  background-color: #d6e9f8;","  border-color: #d6e9f8;","  border-style: dotted;","  border-width: 1px 0;","  padding-bottom: 3px;","  padding-top: 3px;","}",".blocklyWidgetDiv .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-menuitem-icon {","  background-repeat: no-repeat;",
-"  height: 16px;","  left: 6px;","  position: absolute;","  right: auto;","  vertical-align: middle;","  width: 16px;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-icon {","  left: auto;","  right: 6px;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","  background: url(//ssl.gstatic.com/editor/editortoolbar.png) no-repeat -512px 0;","}",
-".blocklyWidgetDiv .goog-menuitem-accel {","  color: #999;","  direction: ltr;","  left: auto;","  padding: 0 6px;","  position: absolute;","  right: 0;","  text-align: right;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-accel {","  left: 0;","  right: auto;","  text-align: left;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-hint {","  text-decoration: underline;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-separator {","  color: #999;","  font-size: 12px;","  padding-left: 4px;",
-"}",".blocklyWidgetDiv .goog-menuseparator {","  border-top: 1px solid #ccc;","  margin: 4px 0;","  padding: 0;","}",""];Blockly.WidgetDiv={};Blockly.WidgetDiv.DIV=null;Blockly.WidgetDiv.owner_=null;Blockly.WidgetDiv.dispose_=null;Blockly.WidgetDiv.createDom=function(){Blockly.WidgetDiv.DIV||(Blockly.WidgetDiv.DIV=goog.dom.createDom("div","blocklyWidgetDiv"),document.body.appendChild(Blockly.WidgetDiv.DIV))};
+Blockly.Css.CONTENT=[".blocklySvg {","background-color: #fff;","outline: none;","overflow: hidden;","}",".blocklyWidgetDiv {","display: none;","position: absolute;","z-index: 999;","}",".blocklyTooltipDiv {","background-color: #ffffc7;","border: 1px solid #ddc;","box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);","color: #000;","display: none;","font-family: sans-serif;","font-size: 9pt;","opacity: 0.9;","padding: 2px;","position: absolute;","z-index: 1000;","}",".blocklyResizeSE {","cursor: se-resize;",
+"fill: #aaa;","}",".blocklyResizeSW {","cursor: sw-resize;","fill: #aaa;","}",".blocklyResizeLine {","stroke: #888;","stroke-width: 1;","}",".blocklyHighlightedConnectionPath {","fill: none;","stroke: #fc3;","stroke-width: 4px;","}",".blocklyPathLight {","fill: none;","stroke-linecap: round;","stroke-width: 1;","}",".blocklySelected>.blocklyPath {","stroke: #fc3;","stroke-width: 3px;","}",".blocklySelected>.blocklyPathLight {","display: none;","}",".blocklyDragging>.blocklyPath,",".blocklyDragging>.blocklyPathLight {",
+"fill-opacity: .8;","stroke-opacity: .8;","}",".blocklyDragging>.blocklyPathDark {","display: none;","}",".blocklyDisabled>.blocklyPath {","fill-opacity: .5;","stroke-opacity: .5;","}",".blocklyDisabled>.blocklyPathLight,",".blocklyDisabled>.blocklyPathDark {","display: none;","}",".blocklyText {","cursor: default;","fill: #fff;","font-family: sans-serif;","font-size: 11pt;","}",".blocklyNonEditableText>text {","pointer-events: none;","}",".blocklyNonEditableText>rect,",".blocklyEditableText>rect {",
+"fill: #fff;","fill-opacity: .6;","}",".blocklyNonEditableText>text,",".blocklyEditableText>text {","fill: #000;","}",".blocklyEditableText:hover>rect {","stroke: #fff;","stroke-width: 2;","}",".blocklyBubbleText {","fill: #000;","}",".blocklySvg text {","user-select: none;","-moz-user-select: none;","-webkit-user-select: none;","cursor: inherit;","}",".blocklyHidden {","display: none;","}",".blocklyFieldDropdown:not(.blocklyHidden) {","display: block;","}",".blocklyIconGroup {","cursor: default;",
+"}",".blocklyIconGroup:not(:hover),",".blocklyIconGroupReadonly {","opacity: .6;","}",".blocklyMinimalBody {","margin: 0;","padding: 0;","}",".blocklyCommentTextarea {","background-color: #ffc;","border: 0;","margin: 0;","padding: 2px;","resize: none;","}",".blocklyHtmlInput {","border: none;","border-radius: 4px;","font-family: sans-serif;","height: 100%;","margin: 0;","outline: none;","padding: 0 1px;","width: 100%","}",".blocklyMainBackground {","stroke-width: 1;","stroke: #c6c6c6;","}",".blocklyMutatorBackground {",
+"fill: #fff;","stroke: #ddd;","stroke-width: 1;","}",".blocklyFlyoutBackground {","fill: #ddd;","fill-opacity: .8;","}",".blocklyScrollbarBackground {","opacity: 0;","}",".blocklyScrollbarKnob {","fill: #ccc;","}",".blocklyScrollbarBackground:hover+.blocklyScrollbarKnob,",".blocklyScrollbarKnob:hover {","fill: #bbb;","}",".blocklyZoom>image {","opacity: .4;","}",".blocklyZoom>image:hover {","opacity: .6;","}",".blocklyZoom>image:active {","opacity: .8;","}",".blocklyFlyout .blocklyScrollbarKnob {",
+"fill: #bbb;","}",".blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarKnob,",".blocklyFlyout .blocklyScrollbarKnob:hover {","fill: #aaa;","}",".blocklyInvalidInput {","background: #faa;","}",".blocklyAngleCircle {","stroke: #444;","stroke-width: 1;","fill: #ddd;","fill-opacity: .8;","}",".blocklyAngleMarks {","stroke: #444;","stroke-width: 1;","}",".blocklyAngleGauge {","fill: #f88;","fill-opacity: .8;  ","}",".blocklyAngleLine {","stroke: #f00;","stroke-width: 2;","stroke-linecap: round;",
+"}",".blocklyContextMenu {","border-radius: 4px;","}",".blocklyDropdownMenu {","padding: 0 !important;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","background: url(<<<PATH>>>/sprites.png) no-repeat -48px -16px !important;","}",".blocklyToolboxDiv {","background-color: #ddd;","overflow-x: visible;","overflow-y: auto;","position: absolute;","}",".blocklyTreeRoot {","padding: 4px 0;","}",".blocklyTreeRoot:focus {",
+"outline: none;","}",".blocklyTreeRow {","height: 22px;","line-height: 22px;","margin-bottom: 3px;","padding-right: 8px;","white-space: nowrap;","}",'.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {',"padding-right: 0;","padding-left: 8px !important;","}",".blocklyTreeRow:not(.blocklyTreeSelected):hover {","background-color: #e4e4e4;","}",".blocklyTreeSeparator {","border-bottom: solid #e5e5e5 1px;","height: 0px;","margin: 5px 0;","}",".blocklyTreeIcon {","background-image: url(<<<PATH>>>/sprites.png);",
+"height: 16px;","vertical-align: middle;","width: 16px;","}",".blocklyTreeIconClosedLtr {","background-position: -32px -1px;","}",".blocklyTreeIconClosedRtl {","background-position: 0px -1px;","}",".blocklyTreeIconOpen {","background-position: -16px -1px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedLtr {","background-position: -32px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconClosedRtl {","background-position: 0px -17px;","}",".blocklyTreeSelected>.blocklyTreeIconOpen {","background-position: -16px -17px;",
+"}",".blocklyTreeIconNone,",".blocklyTreeSelected>.blocklyTreeIconNone {","background-position: -48px -1px;","}",".blocklyTreeLabel {","cursor: default;","font-family: sans-serif;","font-size: 16px;","padding: 0 3px;","vertical-align: middle;","}",".blocklyTreeSelected .blocklyTreeLabel {","color: #fff;","}",".blocklyWidgetDiv .goog-palette {","outline: none;","cursor: default;","}",".blocklyWidgetDiv .goog-palette-table {","border: 1px solid #666;","border-collapse: collapse;","}",".blocklyWidgetDiv .goog-palette-cell {",
+"height: 13px;","width: 15px;","margin: 0;","border: 0;","text-align: center;","vertical-align: middle;","border-right: 1px solid #666;","font-size: 1px;","}",".blocklyWidgetDiv .goog-palette-colorswatch {","position: relative;","height: 13px;","width: 15px;","border: 1px solid #666;","}",".blocklyWidgetDiv .goog-palette-cell-hover .goog-palette-colorswatch {","border: 1px solid #FFF;","}",".blocklyWidgetDiv .goog-palette-cell-selected .goog-palette-colorswatch {","border: 1px solid #000;","color: #fff;",
+"}",".blocklyWidgetDiv .goog-menu {","background: #fff;","border-color: #ccc #666 #666 #ccc;","border-style: solid;","border-width: 1px;","cursor: default;","font: normal 13px Arial, sans-serif;","margin: 0;","outline: none;","padding: 4px 0;","position: absolute;","overflow-y: auto;","overflow-x: hidden;","max-height: 100%;","z-index: 20000;","}",".blocklyWidgetDiv .goog-menuitem {","color: #000;","font: normal 13px Arial, sans-serif;","list-style: none;","margin: 0;","padding: 4px 7em 4px 28px;",
+"white-space: nowrap;","}",".blocklyWidgetDiv .goog-menuitem.goog-menuitem-rtl {","padding-left: 7em;","padding-right: 28px;","}",".blocklyWidgetDiv .goog-menu-nocheckbox .goog-menuitem,",".blocklyWidgetDiv .goog-menu-noicon .goog-menuitem {","padding-left: 12px;","}",".blocklyWidgetDiv .goog-menu-noaccel .goog-menuitem {","padding-right: 20px;","}",".blocklyWidgetDiv .goog-menuitem-content {","color: #000;","font: normal 13px Arial, sans-serif;","}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-accel,",
+".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-content {","color: #ccc !important;","}",".blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-icon {","opacity: 0.3;","-moz-opacity: 0.3;","filter: alpha(opacity=30);","}",".blocklyWidgetDiv .goog-menuitem-highlight,",".blocklyWidgetDiv .goog-menuitem-hover {","background-color: #d6e9f8;","border-color: #d6e9f8;","border-style: dotted;","border-width: 1px 0;","padding-bottom: 3px;","padding-top: 3px;","}",".blocklyWidgetDiv .goog-menuitem-checkbox,",
+".blocklyWidgetDiv .goog-menuitem-icon {","background-repeat: no-repeat;","height: 16px;","left: 6px;","position: absolute;","right: auto;","vertical-align: middle;","width: 16px;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-icon {","left: auto;","right: 6px;","}",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,",".blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {","background: url(//ssl.gstatic.com/editor/editortoolbar.png) no-repeat -512px 0;",
+"}",".blocklyWidgetDiv .goog-menuitem-accel {","color: #999;","direction: ltr;","left: auto;","padding: 0 6px;","position: absolute;","right: 0;","text-align: right;","}",".blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-accel {","left: 0;","right: auto;","text-align: left;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-hint {","text-decoration: underline;","}",".blocklyWidgetDiv .goog-menuitem-mnemonic-separator {","color: #999;","font-size: 12px;","padding-left: 4px;","}",".blocklyWidgetDiv .goog-menuseparator {",
+"border-top: 1px solid #ccc;","margin: 4px 0;","padding: 0;","}",""];Blockly.WidgetDiv={};Blockly.WidgetDiv.DIV=null;Blockly.WidgetDiv.owner_=null;Blockly.WidgetDiv.dispose_=null;Blockly.WidgetDiv.createDom=function(){Blockly.WidgetDiv.DIV||(Blockly.WidgetDiv.DIV=goog.dom.createDom("div","blocklyWidgetDiv"),document.body.appendChild(Blockly.WidgetDiv.DIV))};
 Blockly.WidgetDiv.show=function(a,b,c){Blockly.WidgetDiv.hide();Blockly.WidgetDiv.owner_=a;Blockly.WidgetDiv.dispose_=c;a=goog.style.getViewportPageOffset(document);Blockly.WidgetDiv.DIV.style.top=a.y+"px";Blockly.WidgetDiv.DIV.style.direction=b?"rtl":"ltr";Blockly.WidgetDiv.DIV.style.display="block"};
 Blockly.WidgetDiv.hide=function(){Blockly.WidgetDiv.owner_&&(Blockly.WidgetDiv.DIV.style.display="none",Blockly.WidgetDiv.DIV.style.left="",Blockly.WidgetDiv.DIV.style.top="",Blockly.WidgetDiv.DIV.style.height="",Blockly.WidgetDiv.dispose_&&Blockly.WidgetDiv.dispose_(),Blockly.WidgetDiv.owner_=null,Blockly.WidgetDiv.dispose_=null,goog.dom.removeChildren(Blockly.WidgetDiv.DIV))};Blockly.WidgetDiv.isVisible=function(){return!!Blockly.WidgetDiv.owner_};
 Blockly.WidgetDiv.hideIfOwner=function(a){Blockly.WidgetDiv.owner_==a&&Blockly.WidgetDiv.hide()};Blockly.WidgetDiv.position=function(a,b,c,d,e){b<d.y&&(b=d.y);e?a>c.width+d.x&&(a=c.width+d.x):a<d.x&&(a=d.x);Blockly.WidgetDiv.DIV.style.left=a+"px";Blockly.WidgetDiv.DIV.style.top=b+"px";Blockly.WidgetDiv.DIV.style.height=c.height-b+d.y+"px"};Blockly.inject=function(a,b){goog.isString(a)&&(a=document.getElementById(a));if(!goog.dom.contains(document,a))throw"Error: container is not in current document.";var c=Blockly.parseOptions_(b||{}),d,e=function(){var b=Blockly.createDom_(a,c);d=Blockly.createMainWorkspace_(b,c);Blockly.init_(d);d.markFocused();Blockly.bindEvent_(b,"focus",d,d.markFocused)};if(c.enableRealtime){var f=document.getElementById("realtime");f&&(f.style.display="block");Blockly.Realtime.startRealtime(e,a,c.realtimeOptions)}else e();
diff --git a/core/css.js b/core/css.js
index de8494f94..371a909c5 100644
--- a/core/css.js
+++ b/core/css.js
@@ -132,116 +132,116 @@ Blockly.Css.setCursor = function(cursor) {
  */
 Blockly.Css.CONTENT = [
   '.blocklySvg {',
-  '  background-color: #fff;',
-  '  outline: none;',
-  '  overflow: hidden;',  /* IE overflows by default. */
+    'background-color: #fff;',
+    'outline: none;',
+    'overflow: hidden;',  /* IE overflows by default. */
   '}',
 
   '.blocklyWidgetDiv {',
-  '  display: none;',
-  '  position: absolute;',
-  '  z-index: 999;',
+    'display: none;',
+    'position: absolute;',
+    'z-index: 999;',
   '}',
 
   '.blocklyTooltipDiv {',
-  '  background-color: #ffffc7;',
-  '  border: 1px solid #ddc;',
-  '  box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);',
-  '  color: #000;',
-  '  display: none;',
-  '  font-family: sans-serif;',
-  '  font-size: 9pt;',
-  '  opacity: 0.9;',
-  '  padding: 2px;',
-  '  position: absolute;',
-  '  z-index: 1000;',
+    'background-color: #ffffc7;',
+    'border: 1px solid #ddc;',
+    'box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);',
+    'color: #000;',
+    'display: none;',
+    'font-family: sans-serif;',
+    'font-size: 9pt;',
+    'opacity: 0.9;',
+    'padding: 2px;',
+    'position: absolute;',
+    'z-index: 1000;',
   '}',
 
   '.blocklyResizeSE {',
-  '  cursor: se-resize;',
-  '  fill: #aaa;',
+    'cursor: se-resize;',
+    'fill: #aaa;',
   '}',
 
   '.blocklyResizeSW {',
-  '  cursor: sw-resize;',
-  '  fill: #aaa;',
+    'cursor: sw-resize;',
+    'fill: #aaa;',
   '}',
 
   '.blocklyResizeLine {',
-  '  stroke: #888;',
-  '  stroke-width: 1;',
+    'stroke: #888;',
+    'stroke-width: 1;',
   '}',
 
   '.blocklyHighlightedConnectionPath {',
-  '  fill: none;',
-  '  stroke: #fc3;',
-  '  stroke-width: 4px;',
+    'fill: none;',
+    'stroke: #fc3;',
+    'stroke-width: 4px;',
   '}',
 
   '.blocklyPathLight {',
-  '  fill: none;',
-  '  stroke-linecap: round;',
-  '  stroke-width: 1;',
+    'fill: none;',
+    'stroke-linecap: round;',
+    'stroke-width: 1;',
   '}',
 
   '.blocklySelected>.blocklyPath {',
-  '  stroke: #fc3;',
-  '  stroke-width: 3px;',
+    'stroke: #fc3;',
+    'stroke-width: 3px;',
   '}',
 
   '.blocklySelected>.blocklyPathLight {',
-  '  display: none;',
+    'display: none;',
   '}',
 
   '.blocklyDragging>.blocklyPath,',
   '.blocklyDragging>.blocklyPathLight {',
-  '  fill-opacity: .8;',
-  '  stroke-opacity: .8;',
+    'fill-opacity: .8;',
+    'stroke-opacity: .8;',
   '}',
 
   '.blocklyDragging>.blocklyPathDark {',
-  '  display: none;',
+    'display: none;',
   '}',
 
   '.blocklyDisabled>.blocklyPath {',
-  '  fill-opacity: .5;',
-  '  stroke-opacity: .5;',
+    'fill-opacity: .5;',
+    'stroke-opacity: .5;',
   '}',
 
   '.blocklyDisabled>.blocklyPathLight,',
   '.blocklyDisabled>.blocklyPathDark {',
-  '  display: none;',
+    'display: none;',
   '}',
 
   '.blocklyText {',
-  '  cursor: default;',
-  '  fill: #fff;',
-  '  font-family: sans-serif;',
-  '  font-size: 11pt;',
+    'cursor: default;',
+    'fill: #fff;',
+    'font-family: sans-serif;',
+    'font-size: 11pt;',
   '}',
 
   '.blocklyNonEditableText>text {',
-  '  pointer-events: none;',
+    'pointer-events: none;',
   '}',
 
   '.blocklyNonEditableText>rect,',
   '.blocklyEditableText>rect {',
-  '  fill: #fff;',
-  '  fill-opacity: .6;',
+    'fill: #fff;',
+    'fill-opacity: .6;',
   '}',
 
   '.blocklyNonEditableText>text,',
   '.blocklyEditableText>text {',
-  '  fill: #000;',
+    'fill: #000;',
   '}',
 
   '.blocklyEditableText:hover>rect {',
-  '  stroke: #fff;',
-  '  stroke-width: 2;',
+    'stroke: #fff;',
+    'stroke-width: 2;',
   '}',
 
   '.blocklyBubbleText {',
-  '  fill: #000;',
+    'fill: #000;',
   '}',
 
   /*
@@ -249,234 +249,231 @@ Blockly.Css.CONTENT = [
     drag a block and selected text moves instead.
   */
   '.blocklySvg text {',
-  '  user-select: none;',
-  '  -moz-user-select: none;',
-  '  -webkit-user-select: none;',
-  '  cursor: inherit;',
+    'user-select: none;',
+    '-moz-user-select: none;',
+    '-webkit-user-select: none;',
+    'cursor: inherit;',
   '}',
 
   '.blocklyHidden {',
-  '  display: none;',
+    'display: none;',
   '}',
 
   '.blocklyFieldDropdown:not(.blocklyHidden) {',
-  '  display: block;',
+    'display: block;',
   '}',
 
   '.blocklyIconGroup {',
-  '  cursor: default;',
+    'cursor: default;',
   '}',
 
   '.blocklyIconGroup:not(:hover),',
   '.blocklyIconGroupReadonly {',
-  '  opacity: .6;',
+    'opacity: .6;',
   '}',
 
   '.blocklyMinimalBody {',
-  '  margin: 0;',
-  '  padding: 0;',
+    'margin: 0;',
+    'padding: 0;',
   '}',
 
   '.blocklyCommentTextarea {',
-  '  background-color: #ffc;',
-  '  border: 0;',
-  '  margin: 0;',
-  '  padding: 2px;',
-  '  resize: none;',
+    'background-color: #ffc;',
+    'border: 0;',
+    'margin: 0;',
+    'padding: 2px;',
+    'resize: none;',
   '}',
 
   '.blocklyHtmlInput {',
-  '  border: none;',
-  '  border-radius: 4px;',
-  '  font-family: sans-serif;',
-  '  height: 100%;',
-  '  margin: 0;',
-  '  outline: none;',
-  '  padding: 0 1px;',
-  '  width: 100%',
+    'border: none;',
+    'border-radius: 4px;',
+    'font-family: sans-serif;',
+    'height: 100%;',
+    'margin: 0;',
+    'outline: none;',
+    'padding: 0 1px;',
+    'width: 100%',
   '}',
 
   '.blocklyMainBackground {',
-  '  stroke-width: 1;',
-  '  stroke: #c6c6c6;',  /* Equates to #ddd due to border being off-pixel. */
+    'stroke-width: 1;',
+    'stroke: #c6c6c6;',  /* Equates to #ddd due to border being off-pixel. */
   '}',
 
   '.blocklyMutatorBackground {',
-  '  fill: #fff;',
-  '  stroke: #ddd;',
-  '  stroke-width: 1;',
+    'fill: #fff;',
+    'stroke: #ddd;',
+    'stroke-width: 1;',
   '}',
 
   '.blocklyFlyoutBackground {',
-  '  fill: #ddd;',
-  '  fill-opacity: .8;',
+    'fill: #ddd;',
+    'fill-opacity: .8;',
   '}',
 
   '.blocklyScrollbarBackground {',
-  '  opacity: 0;',
+    'opacity: 0;',
   '}',
 
   '.blocklyScrollbarKnob {',
-  '  fill: #ccc;',
+    'fill: #ccc;',
   '}',
 
   '.blocklyScrollbarBackground:hover+.blocklyScrollbarKnob,',
   '.blocklyScrollbarKnob:hover {',
-  '  fill: #bbb;',
+    'fill: #bbb;',
   '}',
 
   '.blocklyZoom>image {',
-  '  opacity: .4;',
+    'opacity: .4;',
   '}',
 
   '.blocklyZoom>image:hover {',
-  '  opacity: .6;',
+    'opacity: .6;',
   '}',
 
   '.blocklyZoom>image:active {',
-  '  opacity: .8;',
+    'opacity: .8;',
   '}',
 
   /* Darken flyout scrollbars due to being on a grey background. */
   /* By contrast, workspace scrollbars are on a white background. */
   '.blocklyFlyout .blocklyScrollbarKnob {',
-  '  fill: #bbb;',
+    'fill: #bbb;',
   '}',
 
   '.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarKnob,',
   '.blocklyFlyout .blocklyScrollbarKnob:hover {',
-  '  fill: #aaa;',
+    'fill: #aaa;',
   '}',
 
   '.blocklyInvalidInput {',
-  '  background: #faa;',
+    'background: #faa;',
   '}',
 
   '.blocklyAngleCircle {',
-  '  stroke: #444;',
-  '  stroke-width: 1;',
-  '  fill: #ddd;',
-  '  fill-opacity: .8;',
+    'stroke: #444;',
+    'stroke-width: 1;',
+    'fill: #ddd;',
+    'fill-opacity: .8;',
   '}',
 
   '.blocklyAngleMarks {',
-  '  stroke: #444;',
-  '  stroke-width: 1;',
+    'stroke: #444;',
+    'stroke-width: 1;',
   '}',
 
   '.blocklyAngleGauge {',
-  '  fill: #f88;',
-  '  fill-opacity: .8;  ',
+    'fill: #f88;',
+    'fill-opacity: .8;  ',
   '}',
 
   '.blocklyAngleLine {',
-  '  stroke: #f00;',
-  '  stroke-width: 2;',
-  '  stroke-linecap: round;',
+    'stroke: #f00;',
+    'stroke-width: 2;',
+    'stroke-linecap: round;',
   '}',
 
   '.blocklyContextMenu {',
-  '  border-radius: 4px;',
+    'border-radius: 4px;',
   '}',
 
   '.blocklyDropdownMenu {',
-  '  padding: 0 !important;',
+    'padding: 0 !important;',
   '}',
 
   /* Override the default Closure URL. */
   '.blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,',
   '.blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {',
-  '  background: url(<<<PATH>>>/sprites.png) no-repeat -48px -16px !important;',
+    'background: url(<<<PATH>>>/sprites.png) no-repeat -48px -16px !important;',
   '}',
 
   /* Category tree in Toolbox. */
   '.blocklyToolboxDiv {',
-  '  background-color: #ddd;',
-  '  overflow-x: visible;',
-  '  overflow-y: auto;',
-  '  position: absolute;',
+    'background-color: #ddd;',
+    'overflow-x: visible;',
+    'overflow-y: auto;',
+    'position: absolute;',
   '}',
 
   '.blocklyTreeRoot {',
-  '  padding: 4px 0;',
+    'padding: 4px 0;',
   '}',
 
   '.blocklyTreeRoot:focus {',
-  '  outline: none;',
+    'outline: none;',
   '}',
 
   '.blocklyTreeRow {',
-  '  line-height: 22px;',
-  '  height: 22px;',
-  '  padding-right: 1em;',
-  '  white-space: nowrap;',
+    'height: 22px;',
+    'line-height: 22px;',
+    'margin-bottom: 3px;',
+    'padding-right: 8px;',
+    'white-space: nowrap;',
   '}',
 
   '.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {',
-  '  padding-right: 0;',
-  '  padding-left: 1em !important;',
+    'padding-right: 0;',
+    'padding-left: 8px !important;',
   '}',
 
-  '.blocklyTreeRow:hover {',
-  '  background-color: #e4e4e4;',
+  '.blocklyTreeRow:not(.blocklyTreeSelected):hover {',
+    'background-color: #e4e4e4;',
   '}',
 
   '.blocklyTreeSeparator {',
-  '  border-bottom: solid #e5e5e5 1px;',
-  '  height: 0px;',
-  '  margin: 5px 0;',
+    'border-bottom: solid #e5e5e5 1px;',
+    'height: 0px;',
+    'margin: 5px 0;',
   '}',
 
   '.blocklyTreeIcon {',
-  '  background-image: url(<<<PATH>>>/sprites.png);',
-  '  height: 16px;',
-  '  vertical-align: middle;',
-  '  width: 16px;',
+    'background-image: url(<<<PATH>>>/sprites.png);',
+    'height: 16px;',
+    'vertical-align: middle;',
+    'width: 16px;',
   '}',
 
   '.blocklyTreeIconClosedLtr {',
-  '  background-position: -32px -1px;',
+    'background-position: -32px -1px;',
   '}',
 
   '.blocklyTreeIconClosedRtl {',
-  '  background-position: 0px -1px;',
+    'background-position: 0px -1px;',
   '}',
 
   '.blocklyTreeIconOpen {',
-  '  background-position: -16px -1px;',
+    'background-position: -16px -1px;',
   '}',
 
   '.blocklyTreeSelected>.blocklyTreeIconClosedLtr {',
-  '  background-position: -32px -17px;',
+    'background-position: -32px -17px;',
   '}',
 
   '.blocklyTreeSelected>.blocklyTreeIconClosedRtl {',
-  '  background-position: 0px -17px;',
+    'background-position: 0px -17px;',
   '}',
 
   '.blocklyTreeSelected>.blocklyTreeIconOpen {',
-  '  background-position: -16px -17px;',
+    'background-position: -16px -17px;',
   '}',
 
   '.blocklyTreeIconNone,',
   '.blocklyTreeSelected>.blocklyTreeIconNone {',
-  '  background-position: -48px -1px;',
+    'background-position: -48px -1px;',
   '}',
 
   '.blocklyTreeLabel {',
-  '  cursor: default;',
-  '  font-family: sans-serif;',
-  '  font-size: 16px;',
-  '  padding: 0 3px;',
-  '  vertical-align: middle;',
-  '}',
-
-  '.blocklyTreeSelected  {',
-  '  background-color: #57e !important;',
+    'cursor: default;',
+    'font-family: sans-serif;',
+    'font-size: 16px;',
+    'padding: 0 3px;',
+    'vertical-align: middle;',
   '}',
 
   '.blocklyTreeSelected .blocklyTreeLabel {',
-  '  color: #fff;',
+    'color: #fff;',
   '}',
 
   /* Copied from: goog/css/colorpicker-simplegrid.css */
@@ -494,40 +491,40 @@ Blockly.Css.CONTENT = [
     NOTE: without CSS scoping this will override styles defined in palette.css
   */
   '.blocklyWidgetDiv .goog-palette {',
-  '  outline: none;',
-  '  cursor: default;',
+    'outline: none;',
+    'cursor: default;',
   '}',
 
   '.blocklyWidgetDiv .goog-palette-table {',
-  '  border: 1px solid #666;',
-  '  border-collapse: collapse;',
+    'border: 1px solid #666;',
+    'border-collapse: collapse;',
   '}',
 
   '.blocklyWidgetDiv .goog-palette-cell {',
-  '  height: 13px;',
-  '  width: 15px;',
-  '  margin: 0;',
-  '  border: 0;',
-  '  text-align: center;',
-  '  vertical-align: middle;',
-  '  border-right: 1px solid #666;',
-  '  font-size: 1px;',
+    'height: 13px;',
+    'width: 15px;',
+    'margin: 0;',
+    'border: 0;',
+    'text-align: center;',
+    'vertical-align: middle;',
+    'border-right: 1px solid #666;',
+    'font-size: 1px;',
   '}',
 
   '.blocklyWidgetDiv .goog-palette-colorswatch {',
-  '  position: relative;',
-  '  height: 13px;',
-  '  width: 15px;',
-  '  border: 1px solid #666;',
+    'position: relative;',
+    'height: 13px;',
+    'width: 15px;',
+    'border: 1px solid #666;',
   '}',
 
   '.blocklyWidgetDiv .goog-palette-cell-hover .goog-palette-colorswatch {',
-  '  border: 1px solid #FFF;',
+    'border: 1px solid #FFF;',
   '}',
 
   '.blocklyWidgetDiv .goog-palette-cell-selected .goog-palette-colorswatch {',
-  '  border: 1px solid #000;',
-  '  color: #fff;',
+    'border: 1px solid #000;',
+    'color: #fff;',
   '}',
 
   /* Copied from: goog/css/menu.css */
@@ -545,20 +542,20 @@ Blockly.Css.CONTENT = [
    */
 
   '.blocklyWidgetDiv .goog-menu {',
-  '  background: #fff;',
-  '  border-color: #ccc #666 #666 #ccc;',
-  '  border-style: solid;',
-  '  border-width: 1px;',
-  '  cursor: default;',
-  '  font: normal 13px Arial, sans-serif;',
-  '  margin: 0;',
-  '  outline: none;',
-  '  padding: 4px 0;',
-  '  position: absolute;',
-  '  overflow-y: auto;',
-  '  overflow-x: hidden;',
-  '  max-height: 100%;',
-  '  z-index: 20000;',  /* Arbitrary, but some apps depend on it... */
+    'background: #fff;',
+    'border-color: #ccc #666 #666 #ccc;',
+    'border-style: solid;',
+    'border-width: 1px;',
+    'cursor: default;',
+    'font: normal 13px Arial, sans-serif;',
+    'margin: 0;',
+    'outline: none;',
+    'padding: 4px 0;',
+    'position: absolute;',
+    'overflow-y: auto;',
+    'overflow-x: hidden;',
+    'max-height: 100%;',
+    'z-index: 20000;',  /* Arbitrary, but some apps depend on it... */
   '}',
 
   /* Copied from: goog/css/menuitem.css */
@@ -591,27 +588,27 @@ Blockly.Css.CONTENT = [
    * #noflip to .goog-menuitem.
    */
   '.blocklyWidgetDiv .goog-menuitem {',
-  '  color: #000;',
-  '  font: normal 13px Arial, sans-serif;',
-  '  list-style: none;',
-  '  margin: 0;',
+    'color: #000;',
+    'font: normal 13px Arial, sans-serif;',
+    'list-style: none;',
+    'margin: 0;',
      /* 28px on the left for icon or checkbox; 7em on the right for shortcut. */
-  '  padding: 4px 7em 4px 28px;',
-  '  white-space: nowrap;',
+    'padding: 4px 7em 4px 28px;',
+    'white-space: nowrap;',
   '}',
 
   /* BiDi override for the resting state. */
   /* #noflip */
   '.blocklyWidgetDiv .goog-menuitem.goog-menuitem-rtl {',
      /* Flip left/right padding for BiDi. */
-  '  padding-left: 7em;',
-  '  padding-right: 28px;',
+    'padding-left: 7em;',
+    'padding-right: 28px;',
   '}',
 
   /* If a menu doesn't have checkable items or items with icons, remove padding. */
   '.blocklyWidgetDiv .goog-menu-nocheckbox .goog-menuitem,',
   '.blocklyWidgetDiv .goog-menu-noicon .goog-menuitem {',
-  '  padding-left: 12px;',
+    'padding-left: 12px;',
   '}',
 
   /*
@@ -619,49 +616,49 @@ Blockly.Css.CONTENT = [
    * submenu arrows, if they are rendered.
    */
   '.blocklyWidgetDiv .goog-menu-noaccel .goog-menuitem {',
-  '  padding-right: 20px;',
+    'padding-right: 20px;',
   '}',
 
   '.blocklyWidgetDiv .goog-menuitem-content {',
-  '  color: #000;',
-  '  font: normal 13px Arial, sans-serif;',
+    'color: #000;',
+    'font: normal 13px Arial, sans-serif;',
   '}',
 
   /* State: disabled. */
   '.blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-accel,',
   '.blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-content {',
-  '  color: #ccc !important;',
+    'color: #ccc !important;',
   '}',
 
   '.blocklyWidgetDiv .goog-menuitem-disabled .goog-menuitem-icon {',
-  '  opacity: 0.3;',
-  '  -moz-opacity: 0.3;',
-  '  filter: alpha(opacity=30);',
+    'opacity: 0.3;',
+    '-moz-opacity: 0.3;',
+    'filter: alpha(opacity=30);',
   '}',
 
   /* State: hover. */
   '.blocklyWidgetDiv .goog-menuitem-highlight,',
   '.blocklyWidgetDiv .goog-menuitem-hover {',
-  '  background-color: #d6e9f8;',
+    'background-color: #d6e9f8;',
      /* Use an explicit top and bottom border so that the selection is visible',
       * in high contrast mode. */
-  '  border-color: #d6e9f8;',
-  '  border-style: dotted;',
-  '  border-width: 1px 0;',
-  '  padding-bottom: 3px;',
-  '  padding-top: 3px;',
+    'border-color: #d6e9f8;',
+    'border-style: dotted;',
+    'border-width: 1px 0;',
+    'padding-bottom: 3px;',
+    'padding-top: 3px;',
   '}',
 
   /* State: selected/checked. */
   '.blocklyWidgetDiv .goog-menuitem-checkbox,',
   '.blocklyWidgetDiv .goog-menuitem-icon {',
-  '  background-repeat: no-repeat;',
-  '  height: 16px;',
-  '  left: 6px;',
-  '  position: absolute;',
-  '  right: auto;',
-  '  vertical-align: middle;',
-  '  width: 16px;',
+    'background-repeat: no-repeat;',
+    'height: 16px;',
+    'left: 6px;',
+    'position: absolute;',
+    'right: auto;',
+    'vertical-align: middle;',
+    'width: 16px;',
   '}',
 
   /* BiDi override for the selected/checked state. */
@@ -669,47 +666,47 @@ Blockly.Css.CONTENT = [
   '.blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-checkbox,',
   '.blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-icon {',
      /* Flip left/right positioning. */
-  '  left: auto;',
-  '  right: 6px;',
+    'left: auto;',
+    'right: 6px;',
   '}',
 
   '.blocklyWidgetDiv .goog-option-selected .goog-menuitem-checkbox,',
   '.blocklyWidgetDiv .goog-option-selected .goog-menuitem-icon {',
      /* Client apps may override the URL at which they serve the sprite. */
-  '  background: url(//ssl.gstatic.com/editor/editortoolbar.png) no-repeat -512px 0;',
+    'background: url(//ssl.gstatic.com/editor/editortoolbar.png) no-repeat -512px 0;',
   '}',
 
   /* Keyboard shortcut ("accelerator") style. */
   '.blocklyWidgetDiv .goog-menuitem-accel {',
-  '  color: #999;',
+    'color: #999;',
      /* Keyboard shortcuts are untranslated; always left-to-right. */
      /* #noflip */
-  '  direction: ltr;',
-  '  left: auto;',
-  '  padding: 0 6px;',
-  '  position: absolute;',
-  '  right: 0;',
-  '  text-align: right;',
+    'direction: ltr;',
+    'left: auto;',
+    'padding: 0 6px;',
+    'position: absolute;',
+    'right: 0;',
+    'text-align: right;',
   '}',
 
   /* BiDi override for shortcut style. */
   /* #noflip */
   '.blocklyWidgetDiv .goog-menuitem-rtl .goog-menuitem-accel {',
      /* Flip left/right positioning and text alignment. */
-  '  left: 0;',
-  '  right: auto;',
-  '  text-align: left;',
+    'left: 0;',
+    'right: auto;',
+    'text-align: left;',
   '}',
 
   /* Mnemonic styles. */
   '.blocklyWidgetDiv .goog-menuitem-mnemonic-hint {',
-  '  text-decoration: underline;',
+    'text-decoration: underline;',
   '}',
 
   '.blocklyWidgetDiv .goog-menuitem-mnemonic-separator {',
-  '  color: #999;',
-  '  font-size: 12px;',
-  '  padding-left: 4px;',
+    'color: #999;',
+    'font-size: 12px;',
+    'padding-left: 4px;',
   '}',
 
   /* Copied from: goog/css/menuseparator.css */
@@ -727,9 +724,9 @@ Blockly.Css.CONTENT = [
    */
 
   '.blocklyWidgetDiv .goog-menuseparator {',
-  '  border-top: 1px solid #ccc;',
-  '  margin: 4px 0;',
-  '  padding: 0;',
+    'border-top: 1px solid #ccc;',
+    'margin: 4px 0;',
+    'padding: 0;',
   '}',
 
   ''
diff --git a/core/toolbox.js b/core/toolbox.js
index 327a0d9e5..0b0566ea4 100644
--- a/core/toolbox.js
+++ b/core/toolbox.js
@@ -137,6 +137,7 @@ Blockly.Toolbox.prototype.init = function() {
   tree.setSelectedItem(null);
   this.populate_(workspace.options.languageTree);
   tree.render(this.HtmlDiv);
+  this.addColour_(tree);
   this.position();
 };
 
@@ -206,6 +207,9 @@ Blockly.Toolbox.prototype.populate_ = function(newTree) {
           } else {
             syncTrees(childIn, childOut);
           }
+          var hue = childIn.getAttribute('colour');
+          childOut.hexColour = goog.isString(hue) ?
+              Blockly.makeColour(hue) : '';
           if (childIn.getAttribute('expanded') == 'true') {
             if (childOut.blocks.length) {
               rootOut.setSelectedItem(childOut);
@@ -232,6 +236,24 @@ Blockly.Toolbox.prototype.populate_ = function(newTree) {
   Blockly.fireUiEvent(window, 'resize');
 };
 
+/**
+ * Recursively add colours to this toolbox.
+ * @param {!Blockly.Toolbox.TreeNode}
+ * @private
+ */
+Blockly.Toolbox.prototype.addColour_ = function(tree) {
+  var children = tree.getChildren();
+  for (var i = 0, child; child = children[i]; i++) {
+    var border = '8px solid ' + (child.hexColour || '#ddd');
+    if (this.workspace_.RTL) {
+      child.getElement().style.borderLeft = border;
+    } else {
+      child.getElement().style.borderRight = border;
+    }
+    this.addColour_(child);
+  }
+};
+
 /**
  * Unhighlight any previously specified option.
  */
@@ -325,11 +347,18 @@ Blockly.Toolbox.TreeControl.prototype.createNode = function(opt_html) {
  */
 Blockly.Toolbox.TreeControl.prototype.setSelectedItem = function(node) {
   Blockly.removeAllRanges();
-  if (this.selectedItem_ == node) {
+  var toolbox = this.toolbox_;
+  if (node == this.selectedItem_ || node == toolbox.tree_) {
     return;
   }
+  if (toolbox.lastCategory_) {
+    toolbox.lastCategory_.getElement().style.backgroundColor = '';
+  }
+  if (node) {
+    var hexColour = node.hexColour || '#57e';
+    node.getElement().style.backgroundColor = hexColour;
+  }
   goog.ui.tree.TreeControl.prototype.setSelectedItem.call(this, node);
-  var toolbox = this.toolbox_;
   if (node && node.blocks && node.blocks.length) {
     toolbox.flyout_.show(node.blocks);
     // Scroll the flyout to the top if the category has changed.
diff --git a/tests/playground.html b/tests/playground.html
index 849725b3e..278db90a9 100644
--- a/tests/playground.html
+++ b/tests/playground.html
@@ -221,7 +221,7 @@ h1 {
   <div id="blocklyDiv"></div>
 
   <xml id="toolbox" style="display: none">
-    <category name="Logic">
+    <category name="Logic" colour="210">
       <block type="controls_if"></block>
       <block type="logic_compare"></block>
       <block type="logic_operation"></block>
@@ -230,7 +230,7 @@ h1 {
       <block type="logic_null"></block>
       <block type="logic_ternary"></block>
     </category>
-    <category name="Loops">
+    <category name="Loops" colour="120">
       <block type="controls_repeat_ext">
         <value name="TIMES">
           <shadow type="math_number">
@@ -259,7 +259,7 @@ h1 {
       <block type="controls_forEach"></block>
       <block type="controls_flow_statements"></block>
     </category>
-    <category name="Math">
+    <category name="Math" colour="230">
       <block type="math_number"></block>
       <block type="math_arithmetic">
         <value name="A">
@@ -353,7 +353,7 @@ h1 {
       </block>
       <block type="math_random_float"></block>
     </category>
-    <category name="Text">
+    <category name="Text" colour="160">
       <block type="text"></block>
       <block type="text_join"></block>
       <block type="text_append">
@@ -430,7 +430,7 @@ h1 {
         </value>
       </block>
     </category>
-    <category name="Lists">
+    <category name="Lists" colour="260">
       <block type="lists_create_with">
         <mutation items="0"></mutation>
       </block>
@@ -480,7 +480,7 @@ h1 {
         </value>
       </block>
     </category>
-    <category name="Colour">
+    <category name="Colour" colour="20">
       <block type="colour_picker"></block>
       <block type="colour_random"></block>
       <block type="colour_rgb">
@@ -519,8 +519,8 @@ h1 {
       </block>
     </category>
     <sep></sep>
-    <category name="Variables" custom="VARIABLE"></category>
-    <category name="Functions" custom="PROCEDURE"></category>
+    <category name="Variables" colour="330" custom="VARIABLE"></category>
+    <category name="Functions" colour="290" custom="PROCEDURE"></category>
   </xml>
 
   <h1>Blockly Playground</h1>