diff --git a/web/app.react.js b/web/app.react.js
--- a/web/app.react.js
+++ b/web/app.react.js
@@ -3,6 +3,7 @@
 import 'basscss/css/basscss.min.css';
 import './theme.css';
 import { config as faConfig } from '@fortawesome/fontawesome-svg-core';
+import classnames from 'classnames';
 import _isEqual from 'lodash/fp/isEqual';
 import * as React from 'react';
 import { DndProvider } from 'react-dnd';
@@ -187,12 +188,17 @@
       navigationArrows = <NavigationArrows />;
     }
 
+    const headerClasses = classnames({
+      [css['header']]: true,
+      [css['electron-draggable']]: electron,
+    });
+
     return (
       <div className={css.layout}>
         <DisconnectedBarVisibilityHandler />
         <DisconnectedBar />
         <header
-          className={css['header']}
+          className={headerClasses}
           onDoubleClick={this.onHeaderDoubleClick}
         >
           <div className={css['main-header']}>
diff --git a/web/components/navigation-arrows.css b/web/components/navigation-arrows.css
--- a/web/components/navigation-arrows.css
+++ b/web/components/navigation-arrows.css
@@ -7,6 +7,7 @@
   color: var(--fg);
   display: flex;
   align-items: center;
+  -webkit-app-region: no-drag;
 }
 
 .disabled {
diff --git a/web/style.css b/web/style.css
--- a/web/style.css
+++ b/web/style.css
@@ -85,6 +85,12 @@
 .wordmark > a {
   color: inherit;
 }
+.electron-draggable {
+  -webkit-app-region: drag;
+}
+.electron-draggable .wordmark {
+  -webkit-app-region: no-drag;
+}
 
 div.main-content-container {
   position: relative;