diff --git a/ui-ngx/src/app/modules/login/pages/login/login.component.html b/ui-ngx/src/app/modules/login/pages/login/login.component.html
index f1eb24ec8a..3f5438dcd3 100644
--- a/ui-ngx/src/app/modules/login/pages/login/login.component.html
+++ b/ui-ngx/src/app/modules/login/pages/login/login.component.html
@@ -56,7 +56,7 @@
                 <div class="line"><mat-divider></mat-divider></div>
               </div>
               <ng-container *ngFor="let oauth2Client of oauth2Clients">
-                <a mat-raised-button color="primary" class="centered" href="{{ oauth2Client.url }}">
+                <a mat-raised-button color="warn" class="centered" href="{{ oauth2Client.url }}">
                   <mat-icon svgIcon="{{ oauth2Client.icon }}"></mat-icon>
                   {{ 'login.login-with' | translate: {name: oauth2Client.name} }}
                 </a>
diff --git a/ui-ngx/src/app/modules/login/pages/login/login.component.scss b/ui-ngx/src/app/modules/login/pages/login/login.component.scss
index 2127439234..c0fbb519f3 100644
--- a/ui-ngx/src/app/modules/login/pages/login/login.component.scss
+++ b/ui-ngx/src/app/modules/login/pages/login/login.component.scss
@@ -70,6 +70,7 @@
         display: flex;
         justify-content: center;
         align-items: center;
+        text-transform: uppercase;
       }
     }
   }