diff --git a/static_src/elements/issue-list/mr-grid-page/mr-grid-dropdown.js b/static_src/elements/issue-list/mr-grid-page/mr-grid-dropdown.js
new file mode 100644
index 0000000..2fc05b6
--- /dev/null
+++ b/static_src/elements/issue-list/mr-grid-page/mr-grid-dropdown.js
@@ -0,0 +1,72 @@
+// Copyright 2019 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+import {LitElement, html, css} from 'lit-element';
+import {equalsIgnoreCase} from 'shared/helpers.js';
+
+/**
+ * `<mr-grid-dropdown>`
+ *
+ * Component used by the user to select what grid options to use.
+ */
+export class MrGridDropdown extends LitElement {
+  /** @override */
+  render() {
+    return html`
+      ${this.text}:
+      <select
+        class="drop-down"
+        @change=${this._optionChanged}
+      >
+        ${(this.items).map((item) => html`
+          <option .selected=${equalsIgnoreCase(item, this.selection)}>
+            ${item}
+          </option>
+        `)}
+      </select>
+      `;
+  }
+
+  /** @override */
+  static get properties() {
+    return {
+      text: {type: String},
+      items: {type: Array},
+      selection: {type: String},
+    };
+  };
+
+  /** @override */
+  constructor() {
+    super();
+    this.items = [];
+    this.selection = 'None';
+  };
+
+  /** @override */
+  static get styles() {
+    return css`
+      :host {
+        font-size: var(--chops-large-font-size);
+      }
+      .drop-down {
+        font-size: var(--chops-large-font-size);
+      }
+    `;
+  };
+
+  /**
+   * Syncs values when the user updates their selection.
+   * @param {Event} e
+   * @fires CustomEvent#change
+   * @private
+   */
+  _optionChanged(e) {
+    this.selection = e.target.value;
+    this.dispatchEvent(new CustomEvent('change'));
+  };
+};
+
+customElements.define('mr-grid-dropdown', MrGridDropdown);
+