diff --git a/scm-ui-components/packages/ui-components/src/Notification.js b/scm-ui-components/packages/ui-components/src/Notification.js
index b48ae16851..46b6b8edcf 100644
--- a/scm-ui-components/packages/ui-components/src/Notification.js
+++ b/scm-ui-components/packages/ui-components/src/Notification.js
@@ -2,11 +2,18 @@
 import * as React from "react";
 import classNames from "classnames";
 
-type NotificationType = "primary" | "info" | "success" | "warning" | "danger";
+type NotificationType =
+  | "primary"
+  | "info"
+  | "success"
+  | "warning"
+  | "danger"
+  | "inherit";
 
 type Props = {
   type: NotificationType,
   onClose?: () => void,
+  className?: string,
   children?: React.Node
 };
 
@@ -24,9 +31,12 @@ class Notification extends React.Component<Props> {
   }
 
   render() {
-    const { type, children } = this.props;
+    const { type, className, children } = this.props;
+
+    const color = type !== "inherit" ? "is-" + type : "";
+
     return (
-      <div className={classNames("notification", "is-" + type)}>
+      <div className={classNames("notification", color, className)}>
         {this.renderCloseButton()}
         {children}
       </div>