diff --git a/ui/src/dashboards/components/DashboardHeaderEdit.js b/ui/src/dashboards/components/DashboardHeaderEdit.js
new file mode 100644
index 0000000000..987ed02f87
--- /dev/null
+++ b/ui/src/dashboards/components/DashboardHeaderEdit.js
@@ -0,0 +1,36 @@
+import React, {PropTypes} from 'react'
+
+const DashboardEditHeader = ({
+  dashboard,
+  onSave,
+}) => (
+  <div className="page-header full-width">
+    <div className="page-header__container">
+      <div className="page-header__left">
+        <input
+          className="chronograf-header__editing"
+          autoFocus={true}
+          defaultValue={dashboard && dashboard.name}
+          placeholder="Dashboard name"
+        />
+      </div>
+      <div className="page-header__right">
+        <div className="btn btn-sm btn-success" onClick={onSave}>
+          Save
+        </div>
+      </div>
+    </div>
+  </div>
+)
+
+const {
+  shape,
+  func,
+} = PropTypes
+
+DashboardEditHeader.propTypes = {
+  dashboard: shape({}),
+  onSave: func.isRequired,
+}
+
+export default DashboardEditHeader