Customize the login screen
-
Hi!
I think what I'm trying to do should be very easy, but I can't figure out how to do it. I want logins to my tenant apps to allow for passwordless login, or Login with Google, or Login with Microsoft, and that's it, no passwords, and no signups allowed (user has to exist already to be able to sign in).
But even though I've turned on Passwordless and only the Google IdP for now, the login screen still shows everything for email/password. Then I tried to make a Simple theme, but it didn't allow me to turn the password related things off. Then I tried to make a template (which I'd rather not), and I see that I could take the password related elements off, but I have no access to manipulate the passwordless option or the IdP buttons; is that right?
Let's say I want this dialog from your own homepage sample screenshots, how do I achieve this exact login layout?
https://cdn.prod.website-files.com/664cfafd1b780dd90b9bc416/66cc9e6ab66b7479fd4ead34_enterprise-secure-authentication-image 2.png
OR
https://cdn.prod.website-files.com/664cfafd1b780dd90b9bc416/66ea66292c02554dc34ce752_FA Hero Animation - Loop.svgThanks,
Laura -
@laurahernandez, Have you tried the advanced theme? You can try to hide the password fields from the login page using custom themes and hiding the password input. This approach is commonly suggested, but it is not foolproof, as users may be able to workaround it if the try and still see default login form with password fields present. Therefore, this is not a fully secure method to disable password logins entirely for all scenarios.
-
@mark-robustelli geometry vibes said in Customize the login screen:
@laurahernandez, Have you tried the advanced theme? You can try to hide the password fields from the login page using custom themes and hiding the password input. This approach is commonly suggested, but it is not foolproof, as users may be able to workaround it if the try and still see default login form with password fields present. Therefore, this is not a fully secure method to disable password logins entirely for all scenarios.
So what will be the safe and correct solution.
-
@josephbeckley99 As far as I can tell, hiding the password input with an advance theme is the best workaround. Just be aware that with a little knowledge and some hacking a use may be able to expose the password field and use it if they are really focused on doing so.
-
@mark-robustelli I’m aiming for a modern, seamless passwordless login experience (with some IdP buttons), but the default theme doesn't have a quick way to hide password fields, and the flow could be improved. I don't think leaving the possibility of an open hole is a solution. Are there plans for a dedicated passwordless mode and theme? One in which passwords are not expected and the server could reject passwords when passwordless is enabled.
I’ll try customizing a theme next week, but I’m concerned about the complexity. I didn’t expect this during evaluation of FusionAuth, assuming your UI would match Clerk or Stytch component approach. Do you have any planned upcoming UI enhancements?
Thanks for the guidance!
P.S. I saw on "Preview" mode of a theme, I can choose to "Hide Password Field" (or something like that) - is that available during design mode? If it is, I couldn't find it. -
@laurahernandez I hope you are able to achieve the look and feel you are going for. I understand you would like to be able to show and hide the password dialog in simple themes and you are not the only one. Please be sure to upvote the issue here.
I understand using advanced themes may require more work, but ultimately it is more flexible that simple themes. Good Luck.
