Closing Modal Pop up by clicking outside the Modal

Web3Auth Community General
1

Hey
How do i make it so after a user clicks sign in and the Modal pop up appears

The user clicks outside of the Modal pop up anywhere on the screen and it closes the Modal pop up

At the moment it will only close the Modal pop up if the user presses the X button on the Modal but i would like it so a user can just click elsewhere on the screen and it closes the pop up

Does anyone know how to do this as I am struggling to do this

Thanks!

2

Thanks for your question! :wave:

From your description, it sounds like you’re using the Web3Auth modal UI for authentication and you’d like the modal to close when a user clicks outside of it (not just when the “X” button is clicked).

Currently, as per Web3Auth’s default modal behavior, clicking outside the modal does not close it—it’s designed this way to avoid accidental closure during critical authentication flows. As of now, there’s no direct configuration option to change this behavior through the SDK options.

Possible solutions:

  • If you need more customizable UI behavior (like closing on background click), you might want to consider using the Web3Auth Plug n Play with Custom UI or the Web3Auth Embedded modalless flow, where you build your own modal and control its behavior. Here’s the relevant documentation:
  • For the current modal UI, overriding the default modal close behavior would require custom code and is not officially supported (as it might affect the authentication flow’s reliability).

If you tell me which SDK and platform you’re using (e.g., Web3Auth Web SDK, React, etc.), I can provide more tailored guidance or code examples for a custom modal solution!

Let me know if you’d like further details for custom implementation or have any more questions.

Note: This response was generated by an AI bot and may require further verification. The Web3Auth support team has tracked this issue and will be responding as soon as possible.

Additionally, we would recommend you to join our biweekly Office Hours to get this resolved even faster. Web3Auth Developer Office Hours