diff --git a/scm-ui-components/packages/ui-components/src/buttons/ButtonGroup.js b/scm-ui-components/packages/ui-components/src/buttons/ButtonGroup.js
new file mode 100644
index 0000000000..9997e68a53
--- /dev/null
+++ b/scm-ui-components/packages/ui-components/src/buttons/ButtonGroup.js
@@ -0,0 +1,46 @@
+// @flow
+import React from "react";
+import Button from "./Button";
+
+type Props = {
+  firstlabel: string,
+  secondlabel: string,
+  firstColor: string,
+  secondColor: string,
+  firstAction?: (event: Event) => void,
+  secondAction?: (event: Event) => void,
+  firstIsSelected: boolean
+};
+
+class ButtonGroup extends React.Component<Props> {
+
+  render() {
+    const { firstlabel, secondlabel, firstColor, secondColor, firstAction, secondAction, firstIsSelected } = this.props;
+
+    let showFirstColor = firstColor;
+    let showSecondColor = secondColor;
+
+    if (firstIsSelected) {
+      showFirstColor += " is-selected";
+    } else {
+      showSecondColor += " is-selected";
+    }
+
+    return (
+      <div className="buttons has-addons">
+        <Button
+          label={firstlabel}
+          color={showFirstColor}
+          action={firstAction}
+        />
+        <Button
+          label={secondlabel}
+          color={showSecondColor}
+          action={secondAction}
+        />
+      </div>
+    );
+  }
+}
+
+export default ButtonGroup;