diff --git a/app/assets/javascripts/discourse/app/components/modal/create-account.hbs b/app/assets/javascripts/discourse/app/components/modal/create-account.hbs
index 8d172440c32..9cf8fb4fdbd 100644
--- a/app/assets/javascripts/discourse/app/components/modal/create-account.hbs
+++ b/app/assets/javascripts/discourse/app/components/modal/create-account.hbs
@@ -281,7 +281,11 @@
         {{loading-spinner size="large"}}
       {{/if}}
     </div>
-    {{#if (and this.hasAtLeastOneLoginButton this.site.desktopView)}}
+
+    {{#if this.hasAtLeastOneLoginButton}}
+      {{#if this.site.mobileView}}
+        <div class="login-or-separator"><span>
+            {{i18n "login.or"}}</span></div>{{/if}}
       <div class="login-right-side">
         <LoginButtons
           @externalLogin={{this.externalLogin}}
diff --git a/app/assets/stylesheets/mobile/login-modal.scss b/app/assets/stylesheets/mobile/login-modal.scss
index 68769ee8d09..e4c503cf363 100644
--- a/app/assets/stylesheets/mobile/login-modal.scss
+++ b/app/assets/stylesheets/mobile/login-modal.scss
@@ -25,6 +25,29 @@
       padding: 1rem;
     }
 
+    .login-right-side {
+      padding: 1rem 0 0;
+      background: unset;
+    }
+
+    .login-or-separator {
+      border-top: 1px solid var(--primary-low);
+      position: relative;
+      margin-block: 1rem;
+
+      span {
+        transform: translate(-50%, -50%);
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        background: var(--secondary);
+        padding-inline: 0.5rem;
+        color: var(--primary-medium);
+        font-size: var(--font-down-1-rem);
+        text-transform: uppercase;
+      }
+    }
+
     #login-buttons {
       flex-direction: row;
       flex-wrap: wrap;