How to create this type of UI

Hello everyone,

I want to know that how to create this type of Login Screen.


This is a translucent login screen so I also want to create this type of UI Design

Please help me​:pray:

1 Like

Exist one extension …

Looks like it’s a card view with frosty background. See what Vishwas has to say about it :point_down:

The extension make the dialogue’s background transparent which will not look same like shown in the image above

1 Like

I think @Rogerio_Rios is saying right and I should use this extension. Thanks :+1::blush:

You can try but :point_down:

Oh yes,
Let’s wait for someone else :slightly_smiling_face:

Maybe you can just use a simple verticle arrangement and reduce it’s opacity.
Here is an image of one of my old project of Appybuilder

But how can I create it.

To Make This

Step 1 : Get Image From Web Upload To Asset Set And Set As Screen Background

Step 2 : Add Card View Set The Color To Transparent

Step 3 : Add Textbox and Radio Button , Label

Step 4 : Add Card View Set Radius Set Backgroud To Grey To 100 Add Textbox And a Arrangment And Add Label inside The arrangement Set Font To Material icons Set Text As Icon

Step 5 : Repeat The Step 4 Just Change The Text Box To password Input

Goto background colour option of the vertical arrangement and chose white colour and then slide the opacity slider to left (according to your taste)


Thanks @Ansh_Anand

Now I got the idea how to create that

1 Like

I marked @Ansh_Anand 's answer as my solution because it is clear.

its to easy

You were saying on an topic that it is having no animation and see your app it is also not having no animation.:thinking:

1 Like

you mean me?

Yes you are right

if i said its high quality login page/ui then then u can say that…but its simple actually no block behind just designer