diff --git a/ui/src/chronograf/components/Panel.js b/ui/src/chronograf/components/Panel.js
index 8a4ea1dfe6..3dbec819fc 100644
--- a/ui/src/chronograf/components/Panel.js
+++ b/ui/src/chronograf/components/Panel.js
@@ -90,16 +90,16 @@ const Panel = React.createClass({
     const {panel, isExpanded} = this.props;
 
     return (
-      <div className={classNames('explorer', {active: isExpanded})}>
-        <div className="explorer--header" onClick={this.handleSelectPanel}>
-          <div className="explorer--name">
+      <div className={classNames('panel', {active: isExpanded})}>
+        <div className="panel--header" onClick={this.handleSelectPanel}>
+          <div className="panel--name">
             <span className="icon caret-right"></span>
             {panel.name || "Graph"}
           </div>
-          <div className="explorer--actions">
-            <div title="Export Queries to Dashboard" className="explorer--action"><span className="icon export"></span></div>
-            <div title="Rename Graph" className="explorer--action" onClick={this.openRenamePanelModal}><span className="icon pencil"></span></div>
-            <div title="Delete Graph" className="explorer--action" onClick={this.handleDeletePanel}><span className="icon trash"></span></div>
+          <div className="panel--actions">
+            <div title="Export Queries to Dashboard" className="panel--action"><span className="icon export"></span></div>
+            <div title="Rename Graph" className="panel--action" onClick={this.openRenamePanelModal}><span className="icon pencil"></span></div>
+            <div title="Delete Graph" className="panel--action" onClick={this.handleDeletePanel}><span className="icon trash"></span></div>
           </div>
         </div>
         {this.renderQueryTabList()}
@@ -143,7 +143,7 @@ const Panel = React.createClass({
       return null;
     }
     return (
-      <div className="explorer--tabs">
+      <div className="panel--tabs">
         {queries.map((q) => {
           const queryTabText = (q.measurement && q.fields.length !== 0) ? `${q.measurement}.${q.fields[0].field}` : 'Query';
           return (
@@ -176,7 +176,7 @@ const Panel = React.createClass({
     }
 
     return (
-      <div className="explorer--tab" onClick={this.toggleAddQueryOptions}>
+      <div className="panel--tab" onClick={this.toggleAddQueryOptions}>
         <span className="icon plus"></span>
       </div>
     );
diff --git a/ui/src/chronograf/components/QueryEditor.js b/ui/src/chronograf/components/QueryEditor.js
index f391afa8ae..d3bcf4d7e6 100644
--- a/ui/src/chronograf/components/QueryEditor.js
+++ b/ui/src/chronograf/components/QueryEditor.js
@@ -97,7 +97,7 @@ const QueryEditor = React.createClass({
 
   render() {
     return (
-      <div className="explorer--tab-contents">
+      <div className="panel--tab-contents">
         {this.renderQuery()}
         {this.renderLists()}
       </div>
diff --git a/ui/src/chronograf/components/QueryTabItem.js b/ui/src/chronograf/components/QueryTabItem.js
index ab16e8692f..60eda42e00 100644
--- a/ui/src/chronograf/components/QueryTabItem.js
+++ b/ui/src/chronograf/components/QueryTabItem.js
@@ -23,9 +23,9 @@ const QueryTabItem = React.createClass({
 
   render() {
     return (
-      <div className={classNames('explorer--tab', {active: this.props.isActive})} onClick={this.handleSelect}>
-        <span className="explorer--tab-label">{this.props.query.rawText ? 'Raw Text' : this.props.queryTabText}</span>
-        <span className="explorer--tab-delete" onClick={this.handleDelete}></span>
+      <div className={classNames('panel--tab', {active: this.props.isActive})} onClick={this.handleSelect}>
+        <span className="panel--tab-label">{this.props.query.rawText ? 'Raw Text' : this.props.queryTabText}</span>
+        <span className="panel--tab-delete" onClick={this.handleDelete}></span>
       </div>
     );
   },