# Custom user sign in screen -for new project

**URL:** https://community.glideapps.com/t/custom-user-sign-in-screen-for-new-project/81832
**Category:** Ask for Help
**Created:** [May 12, 2025, 6:28am UTC](https://community.glideapps.com/t/custom-user-sign-in-screen-for-new-project/81832 "2025-05-12T06:28:39Z")
**Posts on this page:** 2
**Page:** 1

<div class="post-metadata">

### Author: ![JIJO\_THOMAS](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/jijo_thomas/32/88038_2.png) [@JIJO\_THOMAS](https://community.glideapps.com/u/JIJO_THOMAS)
#### Post date: [May 12, 2025, 6:28am UTC](https://community.glideapps.com/t/custom-user-sign-in-screen-for-new-project/81832/1 "2025-05-12T06:28:39Z")

</div>

Hi there ,  
its my 1st ever attempt at this . Almost at the end of my movie app .  
need help with enlarging the logo in the user sign in screen .  
the same file size is working well on the home screen , but i believe its something to do with a glide UI limitation.. or may be im wrong .

tried this custom css -but no success .  
/\* Only affect logo on the user sign-in screen _/  
.auth-screen-wrapper img {  
height: 50vh !important; /_ 50% of viewport height \*/  
width: auto !important;  
max-width: 90% !important;  
margin: 0 auto 16px auto !important;  
object-fit: contain !important;  
display: block !important;  
}

Task -  
Logo to occupy atleast half of the screen . need to be more prominent -like in any real world app .  
if its solved thru a custom CSS , then pls help with that here.  
Screenshot attached .

 ![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/d/f/df383be31fc73bead8b9f281aad6ba4b43057b15.png)

this is the img src from inspect . Not sure, if its needed or is accurate.  
`<img src="https://res.cloudinary.com/glide/image/fetch/f_auto,w_150,h_150,c_lfill/https%3A%2F%2Ffirebasestorage.googleapis.com%2F...">`

can someone pls help  
cant keep calm - im just at the final stages before sharing with my frnds .  
pls help make this happen ..

Regards  
Jijo Thomas  
+91-9880210339  
India

---

<div class="post-metadata">

### Author: ![Nicolas\_Joseph](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/nicolas_joseph/32/76105_2.png) [@Nicolas\_Joseph](https://community.glideapps.com/u/Nicolas_Joseph)
#### Post date: [May 12, 2025, 5:14pm UTC](https://community.glideapps.com/t/custom-user-sign-in-screen-for-new-project/81832/2 "2025-05-12T17:14:25Z")

</div>

Hi @JIJO_THOMAS 🙂

Custom CSS must be used with caution, as mentioned in the documentation (cf. [https://www.glideapps.com/docs/css-for-apps](https://www.glideapps.com/docs/css-for-apps)), and may break from time to time.

If you’ve taken this into consideration, here is one possible way to make it work:

```css
div[class^="sign-in-branding"] img {
  max-height: 288px;
  max-width: 288px;
}

```

This targets the `img` tag (containing the logo) inside any `div` whose class name starts with _sign-in-branding_.  
It then forces the `max-height` and `max-width` properties to 288px. Feel free to adjust these values as needed.

No guarantee this will remain stable or is the best way to handle it — just a valid option at the time of writing 😄

 ![Sign-in screen with big logo](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/6/6/66710018147e70404a872711cbcb2a39bad16581.png)

  

Hopefully this points you in the right direction!
