diff --git a/application/admin/view/index/login.html b/application/admin/view/index/login.html
index a21d420..34ef5cc 100755
--- a/application/admin/view/index/login.html
+++ b/application/admin/view/index/login.html
@@ -5,140 +5,204 @@
 
     <style type="text/css">
         body {
-            color: #999;
-            background-color: #f1f4fd;
+            background-color: #FAFAFA;
             background-size: cover;
         }
 
-        a {
-            color: #444;
+        .container {
+            width: 100%;
+            height: 100%;
+            background: url("/assets/img/login-background.png") no-repeat center / 100%;
         }
 
-
-        .login-screen {
-            max-width: 430px;
-            padding: 0;
-            margin: 100px auto 0 auto;
-
+        .login-ctr {
+            width: 1073px;
+            height: 642px;
+            background: #FFFFFF;
+            box-shadow: 0px 4px 8px 2px rgba(0, 0, 0, 0.04), 0px 2px 6px 0px rgba(0, 0, 0, 0.06), 0px 0px 4px 0px rgba(0, 0, 0, 0.08);
+            border-radius: 12px;
         }
 
-        .login-screen .well {
-            border-radius: 3px;
-            -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
-            box-shadow: 0 0 30px rgba(0, 0, 0, 0.1);
-            background: rgba(255, 255, 255, 1);
-            border: none;
-            /*overflow: hidden;*/
-            padding: 0;
+        .flex-c {
+            display: flex;
+            justify-content: center;
+            align-items: center;
         }
 
-        @media (max-width: 767px) {
-            .login-screen {
-                padding: 0 20px;
-            }
+        .flex-r {
+            display: flex;
+            justify-content: flex-end;
+            align-items: center;
         }
 
-        .profile-img-card {
+        .flex-l {
+            display: flex;
+            justify-content: flex-start;
+            align-items: center;
+        }
+
+        .flex-sb {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+        }
+
+        .container .login-ctr .left {
+            width: 400px;
+            height: 360px;
+            background: url("/assets/img/login-image.png") no-repeat center / 100%;
+        }
+
+        .container .login-ctr .right {
+            width: 392px;
+            height: 445px;
+        }
+
+        .container .login-ctr .right {
+            margin-left: 120px;
+        }
+
+        .container .login-ctr .right .title {
+            height: 67px;
+            font-weight: 700;
+            font-size: 40px;
+            color: rgba(0, 0, 0, 0.9);
+        }
+
+        .container .login-ctr .right .form {
+            padding-top: 20px;
+            box-sizing: border-box;
+        }
+
+        .form .item {
+            margin-bottom: 10px;
+        }
+
+        .item .name {
+            height: 34px;
+            font-weight: 400;
+            font-size: 18px;
+            color: rgba(0, 0, 0, 0.9);
+            margin-bottom: 4px;
+        }
+
+        .item .form-control {
+            width: 393px;
+            height: 40px;
+            border-radius: 4px;
+            border: 1px solid rgba(0, 0, 0, 0.1);
+            font-weight: 400;
+            font-size: 15px;
+            color: rgba(0, 0, 0, 0.9);
+        }
+
+        .item .captcha {
+            width: 280px;
+        }
+
+        .item .input-group-addon {
             width: 100px;
-            height: 100px;
-            display: block;
-            -moz-border-radius: 50%;
-            -webkit-border-radius: 50%;
-            border-radius: 50%;
-            margin: -93px auto 30px;
-            border: 5px solid #fff;
+            height: 40px;
         }
 
-        .profile-name-card {
-            text-align: center;
+        .right .keep-login {
+            height: 40px;
+            font-weight: 400;
+            font-size: 14px;
+            color: rgba(0,0,0,0.5);
         }
 
-        .login-head {
-            background: #899fe1;
-            border-radius: 3px 3px 0 0;
+        .keep-login .text {
+            margin-left: 4px;
+            font-weight: 400 !important;
         }
 
-        .login-form {
-            padding: 40px 30px;
-            position: relative;
-            z-index: 99;
+        .keep-login .inline {
+            height: 100%;
+            width: 100px;
         }
 
-        #login-form {
-            margin-top: 20px;
+        .keep-login .checkbox {
+            margin: 0;
         }
 
-        #login-form .input-group {
-            margin-bottom: 15px;
+        .captcha-ctr {
+            display: flex;
+            justify-content: space-between;
         }
-
-        #login-form .form-control {
-            font-size: 13px;
+        .captcha-ctr .msg-box {
+            width: 100%;
+        }
+        .btn-lg {
+            width: 393px;
+            height: 40px;
+            border-radius: 4px;
+            font-weight: 400;
+            font-size: 15px;
+            color: #FFFFFF;
+            margin-top: 10px;
         }
 
     </style>
-    <!--@formatter:off-->
-    {if $background}
-        <style type="text/css">
-            body{
-                background-image: url('{$background|htmlentities}');
-            }
-        </style>
-    {/if}
-    <!--@formatter:on-->
 </head>
 <body>
-<div class="container">
-    <div class="login-wrapper">
-        <div class="login-screen">
-            <div class="well">
-                <div class="login-head">
-                    <img src="__CDN__/assets/img/login-head.png" style="width:100%;"/>
+<div class="container flex-c">
+    <div class="login-ctr flex-c">
+        <div class="left"></div>
+        <form action="" method="post" id="login-form">
+            <!--@AdminLoginFormBegin-->
+            <div id="errtips" class="hide"></div>
+            {:token()}
+            <div class="right">
+                <div class="title">
+                    欢迎登录超邦手后台
                 </div>
-                <div class="login-form">
-                    <img id="profile-img" class="profile-img-card" src="__CDN__/assets/img/avatar.png"/>
-                    <p id="profile-name" class="profile-name-card"></p>
+                <div class="form">
+                    <div class="item">
+                        <div class="name flex-l">用户名</div>
+                        <input type="text" class="form-control" id="pd-form-username" placeholder="请输入用户名"
+                               name="username" autocomplete="off" value=""
+                               data-rule="{:__('Username')}:required;username"/>
+                    </div>
+                    <div class="item">
+                        <div class="name flex-l">密码</div>
+                        <input type="password" class="form-control" id="pd-form-password" placeholder="请输入密码"
+                               name="password" autocomplete="off" value=""
+                               data-rule="{:__('Password')}:required;password"/>
+                    </div>
+                    <!--@CaptchaBegin-->
+                    {if $Think.config.fastadmin.login_captcha}
+                    <div class="item">
+                        <div class="name flex-l">验证码</div>
+                        <div class="captcha-ctr">
+                            <div>
+                                <input type="text" name="captcha" class="form-control captcha"
+                                       placeholder="{:__('Captcha')}"
+                                       data-rule="{:__('Captcha')}:required;length({$Think.config.captcha.length|htmlentities})"
+                                       autocomplete="off"/>
+                            </div>
 
-                    <form action="" method="post" id="login-form">
-                        <!--@AdminLoginFormBegin-->
-                        <div id="errtips" class="hide"></div>
-                        {:token()}
-                        <div class="input-group">
-                            <div class="input-group-addon"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></div>
-                            <input type="text" class="form-control" id="pd-form-username" placeholder="{:__('Username')}" name="username" autocomplete="off" value="" data-rule="{:__('Username')}:required;username"/>
-                        </div>
-
-                        <div class="input-group">
-                            <div class="input-group-addon"><span class="glyphicon glyphicon-lock" aria-hidden="true"></span></div>
-                            <input type="password" class="form-control" id="pd-form-password" placeholder="{:__('Password')}" name="password" autocomplete="off" value="" data-rule="{:__('Password')}:required;password"/>
-                        </div>
-                        <!--@CaptchaBegin-->
-                        {if $Think.config.fastadmin.login_captcha}
-                        <div class="input-group">
-                            <div class="input-group-addon"><span class="glyphicon glyphicon-option-horizontal" aria-hidden="true"></span></div>
-                            <input type="text" name="captcha" class="form-control" placeholder="{:__('Captcha')}" data-rule="{:__('Captcha')}:required;length({$Think.config.captcha.length|htmlentities})" autocomplete="off"/>
                             <span class="input-group-addon" style="padding:0;border:none;cursor:pointer;">
-                                    <img src="{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha" width="100" height="30" onclick="this.src = '{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha&r=' + Math.random();"/>
+                                    <img src="{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha" width="100" height="40"
+                                         onclick="this.src = '{:rtrim('__PUBLIC__', '/')}/index.php?s=/captcha&r=' + Math.random();"/>
                             </span>
                         </div>
-                        {/if}
-                        <!--@CaptchaEnd-->
-                        {if $keeyloginhours>0}
-                        <div class="form-group checkbox">
-                            <label class="inline" for="keeplogin" data-toggle="tooltip" title="{:__('The duration of the session is %s hours', $keeyloginhours)}">
-                                <input type="checkbox" name="keeplogin" id="keeplogin" value="1"/>
-                                {:__('Keep login')}
-                            </label>
-                        </div>
-                        {/if}
-                        <div class="form-group">
-                            <button type="submit" class="btn btn-success btn-lg btn-block" style="background:#708eea;">{:__('Sign in')}</button>
-                        </div>
-                        <!--@AdminLoginFormEnd-->
-                    </form>
+                    </div>
+                    {/if}
+                    <!--@CaptchaEnd-->
                 </div>
+                {if $keeyloginhours>0}
+                <div class="keep-login">
+                    <label class="inline flex-l" for="keeplogin" data-toggle="tooltip" title="{:__('The duration of the session is %s hours', $keeyloginhours)}">
+                        <input type="checkbox" class="checkbox" name="keeplogin" id="keeplogin" value="1"/>
+                        <span class="text">保持会话</span>
+                    </label>
+                </div>
+                {/if}
+                <button type="submit" class="btn btn-success btn-lg btn-block" style="background:#2772F0;">{:__('Sign in')}</button>
             </div>
-        </div>
+            <!--@AdminLoginFormEnd-->
+        </form>
     </div>
 </div>
 {include file="common/script" /}
diff --git a/public/assets/img/login-background.png b/public/assets/img/login-background.png
new file mode 100644
index 0000000..ad74466
Binary files /dev/null and b/public/assets/img/login-background.png differ
diff --git a/public/assets/img/login-image.png b/public/assets/img/login-image.png
new file mode 100644
index 0000000..603e402
Binary files /dev/null and b/public/assets/img/login-image.png differ