# Custom login user interface

**URL:** <https://forum.solidproject.org/t/custom-login-user-interface/2478>\
**Category:** Ideas for Solid Apps\
**Created:** [November 29, 2019, 2:20pm UTC](https://forum.solidproject.org/t/custom-login-user-interface/2478 "2019-11-29T14:20:08Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![ivanpl98](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/ivanpl98/32/1340_2.png) [@ivanpl98](https://forum.solidproject.org/u/ivanpl98)\
**Post date:** [November 29, 2019, 2:20pm UTC](https://forum.solidproject.org/t/custom-login-user-interface/2478/1 "2019-11-29T14:20:08Z")

</div>

Hello everyone, I’m trying to develop a new Solid React application. For some days, I’ve been struggling with the idea of creating a custom provider login view, to improve the user interface, I don’t know if this is even possible with the solid-auth-client. I know you can create a custom login view, but once you click the button of login with a provider, instead of the popup of solid.community, having my own view. Does anyone know if this is possible??  
Thanks in advance.

---

<div class="post-metadata">

**Author:** ![happybeing](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/happybeing/32/59_2.png) [@happybeing](https://forum.solidproject.org/u/happybeing)\
**Post date:** [November 29, 2019, 2:28pm UTC](https://forum.solidproject.org/t/custom-login-user-interface/2478/2 "2019-11-29T14:28:30Z")

</div>

I haven’t done it but am sure you can. I think you should look for the ‘default popup’ in solid-auth-client and see how that is passed. I think you can make your own as part of your app and pass that to solid-auth-client, maybe as part of the loginOptions passed to the login funciton?

---

<div class="post-metadata">

**Author:** ![Vincent](https://avatars.discourse-cdn.com/v4/letter/v/e9bcb4/32.png) [@Vincent](https://forum.solidproject.org/u/Vincent)\
**Post date:** [November 29, 2019, 3:37pm UTC](https://forum.solidproject.org/t/custom-login-user-interface/2478/3 "2019-11-29T15:37:02Z")

</div>

Hi @ivanpl98, certainly this is possible. In the end, all that’s needed is that you have a way of obtaining a URL to an identity provider (e.g. [https://inrupt.net](https://inrupt.net) or [https://solid.community](https://solid.community)), which you can then pass to solid-auth-client.

For more detail on that, see [the tutorial on solidproject.org about authentication](https://solidproject.org/for-developers/apps/first-app/1-authentication).

It also includes a [link to an example](https://codesandbox.io/s/romantic-wood-0i6z7?module=%2Fsrc%2Findex.js) that uses its own (ugly, but it proves the point) interface to select a provider - in this case, the interface is a plain text box in which the user can type the URL of their provider.

---

<div class="post-metadata">

**Author:** ![A\_A](https://dub1.discourse-cdn.com/flex017/user_avatar/forum.solidproject.org/a_a/32/786_2.png) [@A\_A](https://forum.solidproject.org/u/A_A)\
**Post date:** [November 29, 2019, 3:55pm UTC](https://forum.solidproject.org/t/custom-login-user-interface/2478/4 "2019-11-29T15:55:03Z")

</div>

Is it also possible to show a different login page (the one with username and password)? As it is possible to login via the command line, I’m pretty confident it is possible, but in your example it also forwards me to [inrupt.net/login](http://inrupt.net/login).

---

<div class="post-metadata">

**Author:** ![Vincent](https://avatars.discourse-cdn.com/v4/letter/v/e9bcb4/32.png) [@Vincent](https://forum.solidproject.org/u/Vincent)\
**Post date:** [November 29, 2019, 4:10pm UTC](https://forum.solidproject.org/t/custom-login-user-interface/2478/5 "2019-11-29T16:10:37Z")

</div>

The login page is provided by the Pod server, so it’s under control of the Pod provider. You can compare it to websites with “Connect to Facebook” buttons: if you click that, it will send you to Facebook, and if you’re not logged in to Facebook yet, you will end up at Facebook’s login screen.

(At least, that is the case for usual flow, which I _think_ is WebID-OIDC - it might be that you use WebID-TLS on the command line? This is outside my area of expertise, but the exact method of login is chosen by the user, I think, so an app developer cannot force the login screen to look a certain way.)
