--- a/devtools/client/aboutdebugging-new/aboutdebugging.css
+++ b/devtools/client/aboutdebugging-new/aboutdebugging.css
@@ -1,16 +1,22 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
+@import "resource://devtools/client/themes/variables.css";
 @import "resource://devtools/client/aboutdebugging-new/src/components/App.css";
 @import "resource://devtools/client/aboutdebugging-new/src/components/RuntimesPane.css";
 @import "resource://devtools/client/aboutdebugging-new/src/components/runtime/RuntimeItem.css";
 
+:root {
+  --runtime-item-icon-color: var(--grey-30);
+  --runtime-item-selected-color: var(--blue-55);
+}
+
 html, body {
   margin: 0;
   padding: 0;
 }
 
 ul {
   list-style: none;
   margin: 0;

--- a/devtools/client/aboutdebugging-new/aboutdebugging.js
+++ b/devtools/client/aboutdebugging-new/aboutdebugging.js
@@ -7,44 +7,58 @@
 const { BrowserLoader } =
   ChromeUtils.import("resource://devtools/client/shared/browser-loader.js", {});
 const { require } = BrowserLoader({
   baseURI: "resource://devtools/client/aboutdebugging-new/",
   window,
 });
 const Services = require("Services");
 
+const { bindActionCreators } = require("devtools/client/shared/vendor/redux");
 const { createFactory } =
   require("devtools/client/shared/vendor/react");
 const { render, unmountComponentAtNode } =
   require("devtools/client/shared/vendor/react-dom");
+const Provider =
+  createFactory(require("devtools/client/shared/vendor/react-redux").Provider);
 
+const actions = require("./src/actions/index");
+const { configureStore } = require("./src/create-store");
 const ThisFirefox = require("./src/runtimes/this-firefox");
 
 const App = createFactory(require("./src/components/App"));
 
 const AboutDebugging = {
   init() {
     if (!Services.prefs.getBoolPref("devtools.enabled", true)) {
       // If DevTools are disabled, navigate to about:devtools.
       window.location = "about:devtools?reason=AboutDebugging";
       return;
     }
 
+    this.store = configureStore();
+    this.actions = bindActionCreators(actions, this.store.dispatch);
+
     const thisFirefox = new ThisFirefox();
-    render(App({ thisFirefox }), this.mount);
+    this.updateSelectedRuntime(thisFirefox);
+
+    render(Provider({ store: this.store }, App({ thisFirefox })), this.mount);
   },
 
   destroy() {
     unmountComponentAtNode(this.mount);
   },
 
   get mount() {
     return document.getElementById("mount");
   },
+
+  updateSelectedRuntime(runtime) {
+    this.actions.updateSelectedRuntime(runtime);
+  },
 };
 
 window.addEventListener("DOMContentLoaded", () => {
   AboutDebugging.init();
 }, { once: true });
 
 window.addEventListener("unload", () => {
   AboutDebugging.destroy();

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/actions/index.js
@@ -0,0 +1,9 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const runtimes = require("./runtimes");
+
+Object.assign(exports, runtimes);

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/actions/moz.build
@@ -0,0 +1,8 @@
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+    'index.js',
+    'runtimes.js',
+)

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/actions/runtimes.js
@@ -0,0 +1,20 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const {
+  UPDATE_SELECTED_RUNTIME,
+} = require("../constants");
+
+function updateSelectedRuntime(runtime) {
+  return {
+    type: UPDATE_SELECTED_RUNTIME,
+    runtime,
+  };
+}
+
+module.exports = {
+  updateSelectedRuntime,
+};

--- a/devtools/client/aboutdebugging-new/src/components/App.js
+++ b/devtools/client/aboutdebugging-new/src/components/App.js
@@ -1,34 +1,43 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 "use strict";
 
+const { connect } = require("devtools/client/shared/vendor/react-redux");
 const { createFactory, PureComponent } = require("devtools/client/shared/vendor/react");
 const dom = require("devtools/client/shared/vendor/react-dom-factories");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
 
+const Runtime = require("../runtimes/runtime");
 const ThisFirefox = require("../runtimes/this-firefox");
 
 const RuntimesPane = createFactory(require("./RuntimesPane"));
 
 class App extends PureComponent {
   static get propTypes() {
     return {
+      selectedRuntime: PropTypes.instanceOf(Runtime),
       thisFirefox: PropTypes.instanceOf(ThisFirefox).isRequired,
     };
   }
 
   render() {
-    const { thisFirefox } = this.props;
+    const { selectedRuntime, thisFirefox } = this.props;
 
     return dom.div(
       {
         className: "app",
       },
-      RuntimesPane({ thisFirefox })
+      RuntimesPane({ selectedRuntime, thisFirefox })
     );
   }
 }
 
-module.exports = App;
+const mapStateToProps = state => {
+  return {
+    selectedRuntime: state.runtimes.selectedRuntime,
+  };
+};
+
+module.exports = connect(mapStateToProps)(App);

--- a/devtools/client/aboutdebugging-new/src/components/RuntimesPane.js
+++ b/devtools/client/aboutdebugging-new/src/components/RuntimesPane.js
@@ -5,36 +5,39 @@
 "use strict";
 
 const { createFactory, PureComponent } = require("devtools/client/shared/vendor/react");
 const dom = require("devtools/client/shared/vendor/react-dom-factories");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
 
 const ThisFirefox = require("../runtimes/this-firefox");
 
+const Runtime = require("../runtimes/runtime");
 const RuntimeItem = createFactory(require("./runtime/RuntimeItem"));
 
 class RuntimesPane extends PureComponent {
   static get propTypes() {
     return {
+      selectedRuntime: PropTypes.instanceOf(Runtime),
       thisFirefox: PropTypes.instanceOf(ThisFirefox).isRequired,
     };
   }
 
   render() {
-    const { thisFirefox } = this.props;
+    const { selectedRuntime, thisFirefox } = this.props;
 
     return dom.section(
       {
         className: "runtimes-pane",
       },
       dom.ul(
         {},
         RuntimeItem({
           icon: thisFirefox.getIcon(),
+          isSelected: thisFirefox === selectedRuntime,
           name: thisFirefox.getName(),
         })
       )
     );
   }
 }
 
 module.exports = RuntimesPane;

--- a/devtools/client/aboutdebugging-new/src/components/runtime/RuntimeItem.css
+++ b/devtools/client/aboutdebugging-new/src/components/runtime/RuntimeItem.css
@@ -5,12 +5,22 @@
 .runtime-item {
   align-items: center;
   display: flex;
   font-size: 20px;
   margin-inline-start: 24px;
 }
 
 .runtime-item__icon {
+  fill: var(--runtime-item-icon-color);
   height: 24px;
   margin-inline-end: 9px;
   width: 24px;
+  -moz-context-properties: fill;
 }
+
+.runtime-item--selected {
+  color: var(--runtime-item-selected-color);
+}
+
+.runtime-item__icon--selected {
+  fill: var(--runtime-item-selected-color);
+}

--- a/devtools/client/aboutdebugging-new/src/components/runtime/RuntimeItem.js
+++ b/devtools/client/aboutdebugging-new/src/components/runtime/RuntimeItem.js
@@ -10,29 +10,31 @@ const PropTypes = require("devtools/clie
 
 /**
  * This component shows the runtime as item in RuntimesPane.
  */
 class RuntimeItem extends PureComponent {
   static get propTypes() {
     return {
       icon: PropTypes.string.isRequired,
+      isSelected: PropTypes.bool.isRequired,
       name: PropTypes.string.isRequired,
     };
   }
 
   render() {
-    const { icon, name } = this.props;
+    const { icon, isSelected, name } = this.props;
 
     return dom.li(
       {
-        className: "runtime-item",
+        className: "runtime-item" + (isSelected ? " runtime-item--selected" : ""),
       },
       dom.img({
-        className: "runtime-item__icon",
+        className: "runtime-item__icon" +
+                   (isSelected ? " runtime-item__icon--selected" : ""),
         src: icon,
       }),
       name
     );
   }
 }
 
 module.exports = RuntimeItem;

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/constants.js
@@ -0,0 +1,11 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const actionTypes = {
+  UPDATE_SELECTED_RUNTIME: "UPDATE_SELECTED_RUNTIME",
+};
+
+module.exports = Object.assign({}, actionTypes);

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/create-store.js
@@ -0,0 +1,18 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const { createStore } = require("devtools/client/shared/vendor/redux");
+
+const rootReducer = require("./reducers/index");
+const { RuntimesState } = require("./reducers/runtimes-state");
+
+exports.configureStore = function() {
+  const initialState = {
+    runtimes: new RuntimesState(),
+  };
+
+  return createStore(rootReducer, initialState);
+};

--- a/devtools/client/aboutdebugging-new/src/moz.build
+++ b/devtools/client/aboutdebugging-new/src/moz.build
@@ -1,8 +1,15 @@
 # This Source Code Form is subject to the terms of the Mozilla Public
 # License, v. 2.0. If a copy of the MPL was not distributed with this
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
 DIRS += [
+    'actions',
     'components',
     'runtimes',
+    'reducers',
 ]
+
+DevToolsModules(
+    'constants.js',
+    'create-store.js'
+)

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/reducers/index.js
@@ -0,0 +1,12 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const { combineReducers } = require("devtools/client/shared/vendor/redux");
+const { runtimesReducer } = require("./runtimes-state");
+
+module.exports = combineReducers({
+  runtimes: runtimesReducer,
+});

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/reducers/moz.build
@@ -0,0 +1,8 @@
+# This Source Code Form is subject to the terms of the Mozilla Public
+# License, v. 2.0. If a copy of the MPL was not distributed with this
+# file, You can obtain one at http://mozilla.org/MPL/2.0/.
+
+DevToolsModules(
+    'index.js',
+    'runtimes-state.js',
+)

new file mode 100644
--- /dev/null
+++ b/devtools/client/aboutdebugging-new/src/reducers/runtimes-state.js
@@ -0,0 +1,33 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const {
+  UPDATE_SELECTED_RUNTIME,
+} = require("../constants");
+
+function RuntimesState() {
+  return {
+    selectedRuntime: null,
+  };
+}
+
+function runtimesReducer(state = RuntimesState(), action) {
+  switch (action.type) {
+    case UPDATE_SELECTED_RUNTIME: {
+      return Object.assign({}, state, {
+        selectedRuntime: action.runtime,
+      });
+    }
+
+    default:
+      return state;
+  }
+}
+
+module.exports = {
+  RuntimesState,
+  runtimesReducer,
+};

--- a/devtools/client/themes/images/firefox-logo-glyph.svg
+++ b/devtools/client/themes/images/firefox-logo-glyph.svg
@@ -1,7 +1,7 @@
 <!-- This Source Code Form is subject to the terms of the Mozilla Public
    - License, v. 2.0. If a copy of the MPL was not distributed with this
    - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
 <svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
-  <path fill="#d7d7db"
+  <path fill="context-fill"
         d="M31.359,14.615h0c-.044-.289-.088-.459-.088-.459s-.113.131-.3.378A10.77,10.77,0,0,0,30.6,12.5a13.846,13.846,0,0,0-.937-2.411,10.048,10.048,0,0,0-.856-1.468q-.176-.263-.359-.51c-.57-.931-1.224-1.5-1.981-2.576a7.806,7.806,0,0,1-.991-2.685A10.844,10.844,0,0,0,25,4.607c-.777-.784-1.453-1.341-1.861-1.721C21.126,1.006,21.36.031,21.36.031h0S17.6,4.228,19.229,8.6a8.4,8.4,0,0,0,2.8,3.733c1.576,1.3,3.273,2.323,4.168,4.937a8.377,8.377,0,0,0-3.144-3.317,7.573,7.573,0,0,1,.6,3,7.124,7.124,0,0,1-8.711,6.94,6.561,6.561,0,0,1-1.765-.6,7.183,7.183,0,0,1-2.115-1.955l-.01-.017.126.046a6.5,6.5,0,0,0,.9.241,5.628,5.628,0,0,0,3.583-.423c1.126-.625,1.808-1.088,2.361-.905l.01,0c.54.172.966-.352.58-.9a2.94,2.94,0,0,0-2.848-1.112c-1.127.164-2.16.965-3.637.189a3.129,3.129,0,0,1-.277-.163c-.1-.057.317.087.22.022a7.33,7.33,0,0,1-.928-.554c-.022-.018.223.07.2.052a3.581,3.581,0,0,1-.968-.979,1.741,1.741,0,0,1-.066-1.554,1.371,1.371,0,0,1,.6-.564c.191.094.309.165.309.165s-.087-.16-.134-.244c.017-.006.032,0,.049-.011.167.072.537.26.732.375a1.016,1.016,0,0,1,.335.3s.067-.033.017-.173a.9.9,0,0,0-.346-.424l.016,0a2.94,2.94,0,0,1,.426.265,2.079,2.079,0,0,0,.17-.9,1.178,1.178,0,0,0-.069-.5c-.053-.1.03-.14.123-.035a.976.976,0,0,0-.079-.238v-.008h0s.053-.069.077-.094a1.43,1.43,0,0,1,.216-.176,9.973,9.973,0,0,1,1.465-.747c.414-.181.757-.319.827-.359a2.3,2.3,0,0,0,.293-.225,1.968,1.968,0,0,0,.66-1.14,1.6,1.6,0,0,0,.017-.178v-.05l0-.03v0l0-.012v0l0-.013h0c-.06-.225-.448-.394-2.476-.584a1.773,1.773,0,0,1-1.45-1.36l0,.009c-.029.074-.055.149-.081.225.026-.075.052-.15.081-.225l0-.016a5.138,5.138,0,0,1,1.986-2.466c.052-.042-.208.011-.156-.032a5.156,5.156,0,0,1,.53-.224c.091-.038-.39-.222-.815-.177a2.2,2.2,0,0,0-.756.178c.1-.086.4-.2.329-.2a4.865,4.865,0,0,0-1.542.583.314.314,0,0,1,.03-.14,2.4,2.4,0,0,0-.964.744,1.275,1.275,0,0,0,.01-.174,2.876,2.876,0,0,0-.473.444l-.009.007a6.285,6.285,0,0,0-3.517-.3l-.01-.009.012,0a2.943,2.943,0,0,1-.625-.7L6.1,5.852,6.081,5.83c-.077-.114-.156-.243-.237-.387-.058-.1-.117-.217-.176-.338,0-.008-.009-.011-.013-.012-.024,0-.041.111-.061.082l0-.006a4.308,4.308,0,0,1-.283-1.687l-.016.008a1.884,1.884,0,0,0-.714.934c-.061.137-.1.212-.14.287,0,.006,0-.01,0-.035.009-.069.039-.211.032-.2s-.012.019-.019.029a1.733,1.733,0,0,0-.251.372,2.355,2.355,0,0,0-.15.382c-.006.021,0-.018,0-.064s.009-.128,0-.111l-.022.043a9.5,9.5,0,0,0-.8,3.035A3.022,3.022,0,0,0,3.2,8.7v.016a6.628,6.628,0,0,0-.817,1.1,15.606,15.606,0,0,0-1.727,4.23,10.351,10.351,0,0,1,.925-1.621,15,15,0,0,0-1.045,5.5,14.233,14.233,0,0,1,.45-1.629A13.807,13.807,0,0,0,2.234,22.76a15.037,15.037,0,0,0,5.951,6.748h0a13.016,13.016,0,0,0,3.468,1.662c.162.059.326.117.494.173-.053-.021-.1-.044-.153-.067a15.7,15.7,0,0,0,4.5.662c5.394,0,7.175-2.054,7.339-2.259h0a2.73,2.73,0,0,0,.637-.856h0q.156-.064.315-.137l.067-.03.121-.057a11.312,11.312,0,0,0,2.277-1.426,5.5,5.5,0,0,0,2.123-3.1h0a1.938,1.938,0,0,0,.029-1.428q.083-.131.171-.28a12.706,12.706,0,0,0,1.907-6.181v-.006c0-.059,0-.118,0-.177A7.731,7.731,0,0,0,31.359,14.615Z"/>
 </svg>