diff --git a/app/soapbox/actions/snackbar.js b/app/soapbox/actions/snackbar.js
new file mode 100644
index 000000000..bcf0ef5bc
--- /dev/null
+++ b/app/soapbox/actions/snackbar.js
@@ -0,0 +1,25 @@
+import { ALERT_SHOW } from './alerts';
+
+const showAlert = (severity, message) => ({
+  type: ALERT_SHOW,
+  message,
+  severity,
+});
+
+export function info(message) {
+  return showAlert('info', message);
+};
+
+export function success(message) {
+  return showAlert('success', message);
+};
+
+export function error(message) {
+  return showAlert('error', message);
+};
+
+export default {
+  info,
+  success,
+  error,
+};
diff --git a/app/soapbox/reducers/alerts.js b/app/soapbox/reducers/alerts.js
index 089d920c3..9a0a7ccaf 100644
--- a/app/soapbox/reducers/alerts.js
+++ b/app/soapbox/reducers/alerts.js
@@ -14,6 +14,7 @@ export default function alerts(state = initialState, action) {
       key: state.size > 0 ? state.last().get('key') + 1 : 0,
       title: action.title,
       message: action.message,
+      severity: action.severity || 'info',
     }));
   case ALERT_DISMISS:
     return state.filterNot(item => item.get('key') === action.alert.key);
diff --git a/app/soapbox/selectors/index.js b/app/soapbox/selectors/index.js
index bbf0b54c5..2a7438955 100644
--- a/app/soapbox/selectors/index.js
+++ b/app/soapbox/selectors/index.js
@@ -124,6 +124,8 @@ export const getAlerts = createSelector([getAlertsBase], (base) => {
       message: item.get('message'),
       title: item.get('title'),
       key: item.get('key'),
+      className: `snackbar snackbar--${item.get('severity', 'info')}`,
+      activeClassName: 'snackbar--active',
       dismissAfter: 5000,
       barStyle: {
         zIndex: 200,
diff --git a/app/styles/application.scss b/app/styles/application.scss
index fdce329ad..5320e27c7 100644
--- a/app/styles/application.scss
+++ b/app/styles/application.scss
@@ -76,3 +76,4 @@
 @import 'components/profile_hover_card';
 @import 'components/filters';
 @import 'components/mfa_form';
+@import 'components/snackbar';
diff --git a/app/styles/components/snackbar.scss b/app/styles/components/snackbar.scss
new file mode 100644
index 000000000..4aa32e658
--- /dev/null
+++ b/app/styles/components/snackbar.scss
@@ -0,0 +1,5 @@
+.snackbar {
+  &--success {
+    background-color: $success-green !important;
+  }
+}