[ZukerCup]

Here We Gooo... Today I'm Gonna Share With You a very simple login & register pages for your UCP or whatever...
You can easily edit the colors and its very fast in loading...
Here Is some pictures

Login page! http://imgur.com/a/NRbY2
Register page! http://imgur.com/a/gIumh

I Used FontAwesome Library Only

*Download*
Source File ===> https://www.mediafire.com/file/ltca3...ter_Design.zip

NOTE:I'm Just a Web Designer And If You'er Making A UCP and you need me for the designs you can pm or contact me at fb https://*******/elmoshaghb2019 , And Sorry for My Bad English.

[Awide]

Clean interface. Thank you!

[prineside]

You have a few things to do:

1. Background image is not correctly positioned. On large screens background image will be asymmetrically repeated (https://imgur.com/I7cCb5D)
2. X coordinate of orange circle with black user icon depends on screen resolution. It is centered only in your case, anyone with higher screen resolution will see this circle on the right side of the form, with lower - on the left. On mobile devices this circle will move out of screen (see my previous image link)
3. On screens with low vertical resolution the emptiness above the form will look like a waste of space and will force user to scroll the page. On big screens this form will appear higher than screen center.
4. Default fonts. On different OS and in different browsers you'll get different fonts. Default font for Chrome on Windows (which is used by most SA-MP players) is Times New Roman, which is OK for documents & papers and looks ugly on sites. You should use custom font (Open Sans / Roboto or at least just "sans-serif")
5. Form fields are not properly centered and appear closer to the right side of form
6. When input is focused, it's lower border slowly becomes larger, moving everything beneath it down (and also moves everything up when focus is lost). It is critical for input elements to always stay at the same place (except situations when form elements must be added / removed)
7. Don't write each word with a capital letter, this is a mistake
8. Black text on black background is hardly visible. If you use background image with lower brightness, it will become even worse
9. Border-radius for form background is way too large / not proportional to any other page element. But it is a matter of taste, so it is OK if you like it
10. Black user icon on orange circle is not properly centered vertically
11. Don't redefine classes from FontAwesome, you will break everything. If you add one more user icon to your page, it will look like your orange... thing. You should encapsulate clean tags with "fa-..." classes into tags with your styles, something like this:
    
    
    HTML Code:

    <div class="orange-thingy">
        <i class="fa fa-user"></i>
    </div>
    <style>
        .orange-thingy {
            background: orange;
        }
        .orange-thingy i.fa {
            font-size:28px;
        }
    </style>

12. Don't change style of default tags (I'm talking about input) to fit just your form, there are other places where such tags will be used and your styles will not fit. Add a class and change it's styles instead
13. Don't use style sellectors like "a[href=register.html]", they are slow and work wrong. You should consider a place where this link is put, not page it links to. Links "Forget password?" and "Register now!" must look the same for user to understand they both are links
14. Input placeholders are not visible when fields are filled with something or focused, use labels to give a hint for user
15. Button looks good, but it not behaves like a button when you click it or move cursor over it. It must change its color or change cursor shape to something like "pointer" when hovered. Currently it does nothing and makes user think it is not possible to click on it

Keep working & learning and some day you'll get the rank of web designer By the way, I'm not a web designer.