diff --git a/app/soapbox/actions/auth.js b/app/soapbox/actions/auth.js
index a8d6d5f0fc..8beb9c1eb5 100644
Binary files a/app/soapbox/actions/auth.js and b/app/soapbox/actions/auth.js differ
diff --git a/app/soapbox/actions/filters.js b/app/soapbox/actions/filters.js
index cff647de3c..3448e391cb 100644
Binary files a/app/soapbox/actions/filters.js and b/app/soapbox/actions/filters.js differ
diff --git a/app/soapbox/actions/mfa.js b/app/soapbox/actions/mfa.js
new file mode 100644
index 0000000000..0a8a706ebc
Binary files /dev/null and b/app/soapbox/actions/mfa.js differ
diff --git a/app/soapbox/actions/settings.js b/app/soapbox/actions/settings.js
index 0c2f35a8b7..e9b3a0c851 100644
Binary files a/app/soapbox/actions/settings.js and b/app/soapbox/actions/settings.js differ
diff --git a/app/soapbox/actions/timelines.js b/app/soapbox/actions/timelines.js
index f1213c3010..7ae27b8af0 100644
Binary files a/app/soapbox/actions/timelines.js and b/app/soapbox/actions/timelines.js differ
diff --git a/app/soapbox/components/display_name.js b/app/soapbox/components/display_name.js
index 30dbce9a2f..7ab8b9e607 100644
Binary files a/app/soapbox/components/display_name.js and b/app/soapbox/components/display_name.js differ
diff --git a/app/soapbox/components/sidebar_menu.js b/app/soapbox/components/sidebar_menu.js
index f338023715..a82dfe5194 100644
Binary files a/app/soapbox/components/sidebar_menu.js and b/app/soapbox/components/sidebar_menu.js differ
diff --git a/app/soapbox/components/status.js b/app/soapbox/components/status.js
index b7f21a2fd5..d94de8fc9d 100644
Binary files a/app/soapbox/components/status.js and b/app/soapbox/components/status.js differ
diff --git a/app/soapbox/components/status_action_bar.js b/app/soapbox/components/status_action_bar.js
index 1ee84ca00a..5796171454 100644
Binary files a/app/soapbox/components/status_action_bar.js and b/app/soapbox/components/status_action_bar.js differ
diff --git a/app/soapbox/features/account/components/header.js b/app/soapbox/features/account/components/header.js
index 17ebb36b6f..a26ff710f0 100644
Binary files a/app/soapbox/features/account/components/header.js and b/app/soapbox/features/account/components/header.js differ
diff --git a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap
index 6c34feba79..646a96d498 100644
--- a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap
+++ b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_form-test.js.snap
@@ -3,11 +3,8 @@
 exports[`<LoginForm /> renders correctly 1`] = `
 <form
   className="simple_form new_user"
-  onSubmit={[Function]}
 >
-  <fieldset
-    disabled={false}
-  >
+  <fieldset>
     <div
       className="fields-group"
     >
diff --git a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap
index 35adf1d297..69885fe7bc 100644
--- a/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap
+++ b/app/soapbox/features/auth_login/components/__tests__/__snapshots__/login_page-test.js.snap
@@ -1,6 +1,6 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`<LoginPage /> renders correctly 1`] = `
+exports[`<LoginPage /> renders correctly on load 1`] = `
 <form
   className="simple_form new_user"
   onSubmit={[Function]}
@@ -59,4 +59,4 @@ exports[`<LoginPage /> renders correctly 1`] = `
 </form>
 `;
 
-exports[`<LoginPage /> renders correctly 2`] = `null`;
+exports[`<LoginPage /> renders correctly on load 2`] = `null`;
diff --git a/app/soapbox/features/auth_login/components/__tests__/login_page-test.js b/app/soapbox/features/auth_login/components/__tests__/login_page-test.js
index f0e3d7901c..27393c6c31 100644
Binary files a/app/soapbox/features/auth_login/components/__tests__/login_page-test.js and b/app/soapbox/features/auth_login/components/__tests__/login_page-test.js differ
diff --git a/app/soapbox/features/auth_login/components/__tests__/otp_auth_form-test.js b/app/soapbox/features/auth_login/components/__tests__/otp_auth_form-test.js
new file mode 100644
index 0000000000..799a5e8199
Binary files /dev/null and b/app/soapbox/features/auth_login/components/__tests__/otp_auth_form-test.js differ
diff --git a/app/soapbox/features/auth_login/components/login_form.js b/app/soapbox/features/auth_login/components/login_form.js
index 1b669063b1..0a964f4492 100644
Binary files a/app/soapbox/features/auth_login/components/login_form.js and b/app/soapbox/features/auth_login/components/login_form.js differ
diff --git a/app/soapbox/features/auth_login/components/login_page.js b/app/soapbox/features/auth_login/components/login_page.js
index 2de7daa8f5..934ce12ea7 100644
Binary files a/app/soapbox/features/auth_login/components/login_page.js and b/app/soapbox/features/auth_login/components/login_page.js differ
diff --git a/app/soapbox/features/auth_login/components/otp_auth_form.js b/app/soapbox/features/auth_login/components/otp_auth_form.js
new file mode 100644
index 0000000000..21655f4929
Binary files /dev/null and b/app/soapbox/features/auth_login/components/otp_auth_form.js differ
diff --git a/app/soapbox/features/community_timeline/components/column_settings.js b/app/soapbox/features/community_timeline/components/column_settings.js
index d46dd01767..6ac69bcf2e 100644
Binary files a/app/soapbox/features/community_timeline/components/column_settings.js and b/app/soapbox/features/community_timeline/components/column_settings.js differ
diff --git a/app/soapbox/features/compose/components/action_bar.js b/app/soapbox/features/compose/components/action_bar.js
index 411a30f17d..d24cf8032e 100644
Binary files a/app/soapbox/features/compose/components/action_bar.js and b/app/soapbox/features/compose/components/action_bar.js differ
diff --git a/app/soapbox/features/compose/components/upload_button.js b/app/soapbox/features/compose/components/upload_button.js
index 24a83a527a..04d2c74cd8 100644
Binary files a/app/soapbox/features/compose/components/upload_button.js and b/app/soapbox/features/compose/components/upload_button.js differ
diff --git a/app/soapbox/features/edit_profile/components/profile_preview.js b/app/soapbox/features/edit_profile/components/profile_preview.js
index 6b4166d22d..808f18a555 100644
Binary files a/app/soapbox/features/edit_profile/components/profile_preview.js and b/app/soapbox/features/edit_profile/components/profile_preview.js differ
diff --git a/app/soapbox/features/edit_profile/index.js b/app/soapbox/features/edit_profile/index.js
index a9ba5bcfd7..bcb3d71ea5 100644
Binary files a/app/soapbox/features/edit_profile/index.js and b/app/soapbox/features/edit_profile/index.js differ
diff --git a/app/soapbox/features/filters/index.js b/app/soapbox/features/filters/index.js
index 7ae71daac7..60b406a823 100644
Binary files a/app/soapbox/features/filters/index.js and b/app/soapbox/features/filters/index.js differ
diff --git a/app/soapbox/features/forms/index.js b/app/soapbox/features/forms/index.js
index 471a173f86..e4f7a955a2 100644
Binary files a/app/soapbox/features/forms/index.js and b/app/soapbox/features/forms/index.js differ
diff --git a/app/soapbox/features/home_timeline/components/column_settings.js b/app/soapbox/features/home_timeline/components/column_settings.js
index d37e70f1c0..da553e779f 100644
Binary files a/app/soapbox/features/home_timeline/components/column_settings.js and b/app/soapbox/features/home_timeline/components/column_settings.js differ
diff --git a/app/soapbox/features/notifications/components/column_settings.js b/app/soapbox/features/notifications/components/column_settings.js
index c48b72fbf3..f53ba70c8d 100644
Binary files a/app/soapbox/features/notifications/components/column_settings.js and b/app/soapbox/features/notifications/components/column_settings.js differ
diff --git a/app/soapbox/features/notifications/components/multi_setting_toggle.js b/app/soapbox/features/notifications/components/multi_setting_toggle.js
new file mode 100644
index 0000000000..392369edcb
Binary files /dev/null and b/app/soapbox/features/notifications/components/multi_setting_toggle.js differ
diff --git a/app/soapbox/features/public_layout/components/header.js b/app/soapbox/features/public_layout/components/header.js
index 9f018cc3cf..70c20dcaaa 100644
Binary files a/app/soapbox/features/public_layout/components/header.js and b/app/soapbox/features/public_layout/components/header.js differ
diff --git a/app/soapbox/features/public_timeline/components/column_settings.js b/app/soapbox/features/public_timeline/components/column_settings.js
index d46dd01767..1d7bd73596 100644
Binary files a/app/soapbox/features/public_timeline/components/column_settings.js and b/app/soapbox/features/public_timeline/components/column_settings.js differ
diff --git a/app/soapbox/features/security/index.js b/app/soapbox/features/security/index.js
index f69c31f6d1..b13305dd15 100644
Binary files a/app/soapbox/features/security/index.js and b/app/soapbox/features/security/index.js differ
diff --git a/app/soapbox/features/security/mfa_form.js b/app/soapbox/features/security/mfa_form.js
new file mode 100644
index 0000000000..572579d530
Binary files /dev/null and b/app/soapbox/features/security/mfa_form.js differ
diff --git a/app/soapbox/features/status/components/action_bar.js b/app/soapbox/features/status/components/action_bar.js
index c5db0cab59..de3969f270 100644
Binary files a/app/soapbox/features/status/components/action_bar.js and b/app/soapbox/features/status/components/action_bar.js differ
diff --git a/app/soapbox/features/ui/components/features_panel.js b/app/soapbox/features/ui/components/features_panel.js
new file mode 100644
index 0000000000..b77eeb677e
Binary files /dev/null and b/app/soapbox/features/ui/components/features_panel.js differ
diff --git a/app/soapbox/features/ui/components/profile_info_panel.js b/app/soapbox/features/ui/components/profile_info_panel.js
index e26dc01256..592d60ee02 100644
Binary files a/app/soapbox/features/ui/components/profile_info_panel.js and b/app/soapbox/features/ui/components/profile_info_panel.js differ
diff --git a/app/soapbox/features/ui/components/user_panel.js b/app/soapbox/features/ui/components/user_panel.js
index 7358306224..1ba4e3efca 100644
Binary files a/app/soapbox/features/ui/components/user_panel.js and b/app/soapbox/features/ui/components/user_panel.js differ
diff --git a/app/soapbox/features/ui/containers/status_list_container.js b/app/soapbox/features/ui/containers/status_list_container.js
index 307dff09d8..f54cd2eee4 100644
Binary files a/app/soapbox/features/ui/containers/status_list_container.js and b/app/soapbox/features/ui/containers/status_list_container.js differ
diff --git a/app/soapbox/features/ui/index.js b/app/soapbox/features/ui/index.js
index 7ca9f788f8..e0cc6c5992 100644
Binary files a/app/soapbox/features/ui/index.js and b/app/soapbox/features/ui/index.js differ
diff --git a/app/soapbox/features/ui/util/async-components.js b/app/soapbox/features/ui/util/async-components.js
index 48f36a954c..e6c468ea06 100644
Binary files a/app/soapbox/features/ui/util/async-components.js and b/app/soapbox/features/ui/util/async-components.js differ
diff --git a/app/soapbox/pages/home_page.js b/app/soapbox/pages/home_page.js
index eeeafede96..81f2c93e3b 100644
Binary files a/app/soapbox/pages/home_page.js and b/app/soapbox/pages/home_page.js differ
diff --git a/app/soapbox/reducers/instance.js b/app/soapbox/reducers/instance.js
index 9809510314..f2fc6b5ca8 100644
Binary files a/app/soapbox/reducers/instance.js and b/app/soapbox/reducers/instance.js differ
diff --git a/app/styles/about.scss b/app/styles/about.scss
index 27a02f0119..77d93917e4 100644
--- a/app/styles/about.scss
+++ b/app/styles/about.scss
@@ -34,6 +34,7 @@ $small-breakpoint: 960px;
     flex-wrap: nowrap;
     padding: 14px 0;
     box-sizing: border-box;
+    position: relative;
 
     @media screen and (max-width: 1024px) {
       padding: 14px 20px;
@@ -1712,7 +1713,40 @@ $small-breakpoint: 960px;
   .header,
   .container {
     position: relative;
-    z-index: 1;
+  }
+
+  .otp-form-overlay__container {
+    z-index: 9998;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    background: rgba($base-overlay-background, 0.7);
+
+    .otp-form-overlay__form {
+      @include standard-panel-shadow;
+      border-radius: 10px;
+      z-index: 9999;
+      margin: 0 auto;
+      max-width: 800px;
+      position: relative;
+      padding: 20px;
+      background-color: var(--background-color);
+      display: flex;
+      flex-direction: column;
+
+      .simple_form {
+        padding: 30px 50px 50px;
+      }
+
+      .otp-form-overlay__close {
+        align-self: flex-end;
+      }
+    }
   }
 }
 
@@ -1725,3 +1759,10 @@ $small-breakpoint: 960px;
   bottom: 0;
   right: 0;
 }
+
+h1.otp-login {
+  font-size: 16px;
+  line-height: 24px;
+  font-weight: 800;
+  padding: 10px 0;
+}
diff --git a/app/styles/accounts.scss b/app/styles/accounts.scss
index b25f0d4771..4b09808500 100644
--- a/app/styles/accounts.scss
+++ b/app/styles/accounts.scss
@@ -13,7 +13,7 @@
     &:active,
     &:focus {
       .card__bar {
-        background: var(--brand-color--med);
+        background: var(--foreground-color);
       }
     }
   }
@@ -92,6 +92,11 @@
         overflow: hidden;
         text-overflow: ellipsis;
       }
+
+      bdi,
+      span.verified-icon {
+        display: inline-block;
+      }
     }
   }
 }
@@ -584,7 +589,7 @@ a .account__avatar {
 }
 
 .account__section-headline {
-  background: var(--accent-color--faint);
+  background: var(--foreground-color);
 
   button,
   a {
diff --git a/app/styles/application.scss b/app/styles/application.scss
index b040685c9e..c42cff3e4e 100644
--- a/app/styles/application.scss
+++ b/app/styles/application.scss
@@ -72,3 +72,5 @@
 @import 'components/video-player';
 @import 'components/audio-player';
 @import 'components/profile_hover_card';
+@import 'components/filters';
+@import 'components/mfa_form';
diff --git a/app/styles/components/account-header.scss b/app/styles/components/account-header.scss
index bfd61aa8ca..930a1fd3f8 100644
--- a/app/styles/components/account-header.scss
+++ b/app/styles/components/account-header.scss
@@ -19,7 +19,7 @@
     overflow: hidden;
     height: 350px;
     position: relative;
-    background: var(--accent-color--med);
+    background: var(--accent-color--faint);
     @media screen and (max-width: 895px) {height: 225px;}
     &--none {height: 125px;}
 
@@ -58,7 +58,7 @@
     min-height: 74px;
     width: 100%;
     position: relative;
-    background: var(--accent-color--med);
+    background: var(--background-color);
     @media (min-width: 895px) {height: 74px;}
   }
 
diff --git a/app/styles/components/buttons.scss b/app/styles/components/buttons.scss
index fd664d06dc..49070ad6ca 100644
--- a/app/styles/components/buttons.scss
+++ b/app/styles/components/buttons.scss
@@ -102,7 +102,7 @@ button {
     &:focus,
     &:hover {
       border-color: var(--brand-color);
-      color: var(--primary-text-color);
+      color: var(--background-color);
     }
 
     &:disabled {
diff --git a/app/styles/components/columns.scss b/app/styles/components/columns.scss
index 1410831dbb..d8034e4974 100644
--- a/app/styles/components/columns.scss
+++ b/app/styles/components/columns.scss
@@ -205,7 +205,7 @@
 }
 
 .column-back-button {
-  background: var(--accent-color--med);
+  background: var(--accent-color--faint);
   color: var(--highlight-text-color);
   cursor: pointer;
   flex: 0 0 auto;
diff --git a/app/styles/components/filters.scss b/app/styles/components/filters.scss
new file mode 100644
index 0000000000..769954a4d5
--- /dev/null
+++ b/app/styles/components/filters.scss
@@ -0,0 +1,101 @@
+.filter-settings-panel {
+  h1 {
+    font-size: 18px;
+    line-height: 1.25;
+    color: var(--primary-text-color);
+    font-weight: 400;
+    margin: 20px auto;
+  }
+
+  .item-list article {
+    border-bottom: 1px solid var(--primary-text-color--faint);
+
+    &:last-child {
+      border-bottom: 0;
+    }
+  }
+
+  .fields-group .two-col {
+    display: flex;
+    align-items: flex-start;
+    width: 100%;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+
+    div.input {
+      width: 45%;
+      margin-right: 20px;
+
+      .label_input {
+        width: 100%;
+      }
+    }
+
+    @media(max-width: 485px) {
+      div.input {
+        width: 100%;
+        margin-right: 5px;
+
+        .label_input {
+          width: auto;
+        }
+      }
+    }
+  }
+
+  .filter__container {
+    padding: 20px;
+    display: flex;
+    justify-content: space-between;
+    font-size: 14px;
+
+    .filter__phrase,
+    .filter__contexts,
+    .filter__details {
+      padding: 5px 0;
+    }
+
+    span.filter__list-label {
+      padding-right: 5px;
+      color: var(--primary-text-color--faint);
+    }
+
+    span.filter__list-value span {
+      padding-right: 5px;
+      text-transform: capitalize;
+
+      &::after {
+        content: ',';
+      }
+
+      &:last-of-type {
+        &::after {
+          content: '';
+        }
+      }
+    }
+
+    .filter__delete {
+      display: flex;
+      margin: 10px;
+      align-items: baseline;
+      cursor: pointer;
+      height: 20px;
+
+      span.filter__delete-label {
+        color: var(--primary-text-color--faint);
+        font-size: 14px;
+        font-weight: 800;
+      }
+
+      .filter__delete-icon {
+        background: none;
+        color: var(--primary-text-color--faint);
+        padding: 0 5px;
+        margin: 0 auto;
+        font-size: 16px;
+      }
+    }
+
+  }
+}
diff --git a/app/styles/components/mfa_form.scss b/app/styles/components/mfa_form.scss
new file mode 100644
index 0000000000..80e16da1eb
--- /dev/null
+++ b/app/styles/components/mfa_form.scss
@@ -0,0 +1,81 @@
+.security-settings-panel {
+  margin: 20px;
+
+  h1.security-settings-panel__setup-otp {
+    font-size: 20px;
+    line-height: 1.25;
+    color: var(--primary-text-color);
+    font-weight: 600;
+  }
+
+  h2.security-settings-panel__setup-otp {
+      display: block;
+      font-size: 16px;
+      line-height: 1.5;
+      color: var(--primary-text-color--faint);
+      font-weight: 400;
+    }
+
+  div {
+    display: block;
+    margin: 10px 0;
+  }
+
+  .security-warning {
+    color: var(--primary-text-color);
+    padding: 15px 20px;
+    font-size: 14px;
+    background-color: var(--warning-color--faint);
+    margin: 5px 20px;
+    border-radius: 8px;
+    margin: 20px auto;
+  }
+
+  .backup_codes {
+    margin: 20px;
+    font-weight: bold;
+    padding: 15px 20px;
+    font-size: 14px;
+    background-color: var(--brand-color--faint);
+    border-radius: 8px;
+    margin: 20px;
+    text-align: center;
+    position: relative;
+    min-height: 125px;
+
+    .backup_code {
+      margin: 5px auto;
+    }
+
+    .loading-indicator {
+      position: absolute;
+    }
+  }
+
+  .security-settings-panel__setup-otp__buttons {
+    margin: 20px;
+    display: flex;
+    justify-content: space-between;
+
+    .button {
+      min-width: 182px;
+    }
+  }
+
+  div.confirm-key {
+    display: block;
+    font-size: 16px;
+    line-height: 1.5;
+    color: var(--primary-text-color--faint);
+    font-weight: 400;
+    margin: 0 0 20px 20px;
+  }
+}
+
+form.otp-auth {
+  .error-box {
+    width: 100%;
+    text-align: center;
+    color: $error-red;
+  }
+}
diff --git a/app/styles/components/react-toggle.scss b/app/styles/components/react-toggle.scss
index 699b6e86d3..e2be2ef14b 100644
--- a/app/styles/components/react-toggle.scss
+++ b/app/styles/components/react-toggle.scss
@@ -32,7 +32,7 @@
   height: 24px;
   padding: 0;
   border-radius: 30px;
-  background-color: var(--foreground-color);
+  background-color: hsla(var(--brand-color_h), var(--brand-color_s), var(--brand-color_l), 0.35);
   transition: background-color 0.2s ease;
 }
 
diff --git a/app/styles/components/tabs-bar.scss b/app/styles/components/tabs-bar.scss
index 02dac4e2b8..76920534b3 100644
--- a/app/styles/components/tabs-bar.scss
+++ b/app/styles/components/tabs-bar.scss
@@ -255,9 +255,9 @@
     display: block;
     margin-right: 30px;
     border: 0;
-    height: 50px;
+    height: 40px;
     overflow: hidden;
-    padding: 10px 0;
+    padding: 13px 0 0;
     box-sizing: border-box;
     filter: brightness(0%) grayscale(100%) invert(100%);
     & span {display: none !important;}
diff --git a/app/styles/components/theme-toggle.scss b/app/styles/components/theme-toggle.scss
index c0cadc68f4..1f2697b89a 100644
--- a/app/styles/components/theme-toggle.scss
+++ b/app/styles/components/theme-toggle.scss
@@ -9,6 +9,10 @@
     .react-toggle {
       vertical-align: middle;
 
+      &-track {
+        background-color: var(--foreground-color);
+      }
+
       &-track-check,
       &-track-x {
         display: flex;
diff --git a/app/styles/components/user-panel.scss b/app/styles/components/user-panel.scss
index b0c6564557..cb44672304 100644
--- a/app/styles/components/user-panel.scss
+++ b/app/styles/components/user-panel.scss
@@ -4,12 +4,21 @@
   width: 265px;
   flex-direction: column;
 
+  .user-panel__account__name {
+    display: inline;
+  }
+
+  .verified-icon {
+    opacity: 1;
+  }
+
   &,
   .user-panel__account__name,
   .user-panel__account__username {
     overflow: hidden;
     text-overflow: ellipsis;
     white-space: nowrap;
+    color: var(--primary-text-color--faint);
   }
 
   &__header {
@@ -49,13 +58,13 @@
   &__meta {
     display: block;
     padding: 6px 20px 17px;
-    opacity: 0.6;
+    // opacity: 0.6;
   }
 
   &__account {
     a {
       text-decoration: none;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
     }
 
     &__name {
@@ -63,7 +72,7 @@
       font-size: 20px;
       font-weight: bold;
       line-height: 24px;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
     }
 
     &:hover & {
@@ -96,7 +105,7 @@
 
     a {
       text-decoration: none;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
 
       &:hover {
         opacity: 0.8;
@@ -106,7 +115,7 @@
     &__value {
       display: block;
       width: 100%;
-      color: var(--primary-text-color);
+      color: var(--primary-text-color--faint);
       font-size: 20px;
       font-weight: 800;
       line-height: 24px;
diff --git a/app/styles/components/wtf-panel.scss b/app/styles/components/wtf-panel.scss
index 37566af47a..a555e9490f 100644
--- a/app/styles/components/wtf-panel.scss
+++ b/app/styles/components/wtf-panel.scss
@@ -8,6 +8,10 @@
   box-sizing: border-box;
   background: var(--foreground-color);
 
+  &:first-child {
+    margin-top: 0;
+  }
+
   &:not(:last-of-type) {
     margin-bottom: 10px;
   }
diff --git a/app/styles/donations.scss b/app/styles/donations.scss
index b108949c1a..bb4798f1de 100644
--- a/app/styles/donations.scss
+++ b/app/styles/donations.scss
@@ -169,7 +169,7 @@ body.admin {
 }
 
 .funding-panel {
-  margin: 20px 0;
+  margin-top: 15px;
 
   strong {
     font-weight: bold;
diff --git a/app/styles/forms.scss b/app/styles/forms.scss
index 6cf1f5f0ff..1ec3ceb7d4 100644
--- a/app/styles/forms.scss
+++ b/app/styles/forms.scss
@@ -342,6 +342,15 @@ code {
     }
   }
 
+  input[type=text][disabled],
+  input[type=number][disabled],
+  input[type=email][disabled],
+  input[type=password][disabled],
+  textarea[disabled] {
+    color: var(--primary-text-color--faint);
+    border-color: var(--primary-text-color--faint);
+  }
+
   .input.field_with_errors {
     label {
       color: lighten($error-red, 12%);
diff --git a/app/styles/polls.scss b/app/styles/polls.scss
index 0952de91c0..33b6454899 100644
--- a/app/styles/polls.scss
+++ b/app/styles/polls.scss
@@ -200,7 +200,7 @@
   }
 
   .icon-button.disabled {
-    color: var(--foreground-color);
+    color: var(--brand-color);
   }
 }
 
diff --git a/app/styles/themes.scss b/app/styles/themes.scss
index 1a717e2436..13d952b17a 100644
--- a/app/styles/themes.scss
+++ b/app/styles/themes.scss
@@ -30,12 +30,14 @@ body {
   --accent-color: hsl(var(--accent-color_hsl));
   --primary-text-color: hsl(var(--primary-text-color_hsl));
   --background-color: hsl(var(--background-color_hsl));
+  --warning-color: hsla(var(--warning-color_hsl));
 
   // Meta-variables
   --brand-color_hsl: var(--brand-color_h), var(--brand-color_s), var(--brand-color_l);
   --accent-color_hsl: var(--accent-color_h), var(--accent-color_s), var(--accent-color_l);
   --primary-text-color_hsl: var(--primary-text-color_h), var(--primary-text-color_s), var(--primary-text-color_l);
   --background-color_hsl: var(--background-color_h), var(--background-color_s), var(--background-color_l);
+  --warning-color_hsl: var(--warning-color_h), var(--warning-color_s), var(--warning-color_l);
   --accent-color_h: calc(var(--brand-color_h) - 15);
   --accent-color_s: 86%;
   --accent-color_l: 44%;
@@ -51,6 +53,7 @@ body {
     calc(var(--accent-color_l) + 3%)
   );
   --primary-text-color--faint: hsla(var(--primary-text-color_hsl), 0.6);
+  --warning-color--faint: hsla(var(--warning-color_hsl), 0.5);
 }
 
 body.theme-mode-light {
@@ -69,6 +72,9 @@ body.theme-mode-light {
   --background-color_h: 0;
   --background-color_s: 0%;
   --background-color_l: 94.9%;
+  --warning-color_h: 0;
+  --warning-color_s: 100%;
+  --warning-color_l: 66%;
 
   // Modifiers
   --brand-color--hicontrast: hsl(
@@ -94,6 +100,9 @@ body.theme-mode-dark {
   --background-color_h: 0;
   --background-color_s: 0%;
   --background-color_l: 20%;
+  --warning-color_h: 0;
+  --warning-color_s: 100%;
+  --warning-color_l: 66%;
 
   // Modifiers
   --brand-color--hicontrast: hsl(
diff --git a/app/styles/ui.scss b/app/styles/ui.scss
index 7eab8edb9b..a0ad254bfc 100644
--- a/app/styles/ui.scss
+++ b/app/styles/ui.scss
@@ -654,6 +654,7 @@
 
       &::after {
         bottom: -1px;
+        border-color: transparent transparent var(--foreground-color);
       }
     }
   }
diff --git a/package.json b/package.json
index 9682ef3094..ad53a512de 100644
--- a/package.json
+++ b/package.json
@@ -100,6 +100,7 @@
     "postcss-object-fit-images": "^1.1.2",
     "prop-types": "^15.5.10",
     "punycode": "^2.1.0",
+    "qrcode.react": "^1.0.0",
     "rails-ujs": "^5.2.3",
     "react": "^16.13.1",
     "react-dom": "^16.13.1",
diff --git a/yarn.lock b/yarn.lock
index c6908bd86a..4968718442 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9320,6 +9320,20 @@ q@^1.1.2:
   resolved "https://registry.yarnpkg.com/q/-/q-1.5.1.tgz#7e32f75b41381291d04611f1bf14109ac00651d7"
   integrity sha1-fjL3W0E4EpHQRhHxvxQQmsAGUdc=
 
+qr.js@0.0.0:
+  version "0.0.0"
+  resolved "https://registry.yarnpkg.com/qr.js/-/qr.js-0.0.0.tgz#cace86386f59a0db8050fa90d9b6b0e88a1e364f"
+  integrity sha1-ys6GOG9ZoNuAUPqQ2baw6IoeNk8=
+
+qrcode.react@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/qrcode.react/-/qrcode.react-1.0.0.tgz#7e8889db3b769e555e8eb463d4c6de221c36d5de"
+  integrity sha512-jBXleohRTwvGBe1ngV+62QvEZ/9IZqQivdwzo9pJM4LQMoCM2VnvNBnKdjvGnKyDZ/l0nCDgsPod19RzlPvm/Q==
+  dependencies:
+    loose-envify "^1.4.0"
+    prop-types "^15.6.0"
+    qr.js "0.0.0"
+
 qs@6.7.0:
   version "6.7.0"
   resolved "https://registry.yarnpkg.com/qs/-/qs-6.7.0.tgz#41dc1a015e3d581f1621776be31afb2876a9b1bc"