diff --git a/src/assets/images/login/bg3.png b/src/assets/images/login/bg3.png
index 8ae3c5c..8828ca0 100644
Binary files a/src/assets/images/login/bg3.png and b/src/assets/images/login/bg3.png differ
diff --git a/src/assets/images/login/logo3.png b/src/assets/images/login/logo3.png
new file mode 100644
index 0000000..5c34ae6
Binary files /dev/null and b/src/assets/images/login/logo3.png differ
diff --git a/src/components/verification/index.vue b/src/components/verification/index.vue
index 81d3271..144db75 100644
--- a/src/components/verification/index.vue
+++ b/src/components/verification/index.vue
@@ -78,7 +78,7 @@ const verificationSuccess = () => {
 .mi-captcha {
   width: 100%;
   flex: 1;
-  height: 2.625rem;
+  height: 40px;
   font-family: "Pingfang SC", "Microsoft YaHei", "Monospaced Number",
     "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
     "PingFang SC", "Hiragino Sans GB", "Helvetica Neue", Helvetica, Arial,
diff --git a/src/router/index.js b/src/router/index.js
index d08b373..8c2ab27 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -56,7 +56,7 @@ const routes = [
   {
     path: "/api",
     name: "/api",
-    meta: { title: "api", isBreadcrumb: false, isMenu: false },
+    meta: { title: "api", isBreadcrumb: false, isMenu: false, isLogin: false },
     component: () => import("@/views/api/index"),
   },
   {
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index cbe7f8c..e71afd9 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -1,10 +1,10 @@
 <template>
   <div class="login login-container">
-    <!-- <div class="logo"> -->
-    <!-- <img src="/src/assets/images/login/logo.png" alt="" width="500" /> -->
-    <!-- </div> -->
-    <div class="btn">
-      <el-button class="mr-10 mt-5">跳转API</el-button>
+    <div class="logo">
+      <img src="/src/assets/images/login/logo3.png" alt="" />
+      <div>
+        <span class="btn" @click="router.push({ path: '/api' })">查看API</span>
+      </div>
     </div>
 
     <div class="form">
@@ -16,34 +16,26 @@
         @submit.prevent="fnLogin"
       >
         <el-form-item prop="username">
+          <div class="mb-5 form-item">用户名</div>
           <el-input
             v-model="form.username"
             placeholder="请输入用户名"
             tabindex="1"
           >
-            <template #prepend>
-              <icon-people theme="filled" size="16" fill="#909399" />
-            </template>
           </el-input>
         </el-form-item>
-        <el-form-item prop="password">
+        <el-form-item prop="password" class="mt-20">
+          <div class="mb-5 form-item">密码</div>
           <el-input
             v-model="form.password"
             type="password"
             placeholder="请输入密码"
             tabindex="2"
+            show-password
           >
-            <template #prepend>
-              <icon-lock
-                theme="filled"
-                size="16"
-                fill="#909399"
-                :stroke-width="3"
-              />
-            </template>
           </el-input>
         </el-form-item>
-        <el-form-item>
+        <el-form-item class="mt-30">
           <verification v-model:verification-pass="verificationPass" />
         </el-form-item>
         <el-form-item class="button">
@@ -134,66 +126,69 @@ const fnSubmitLogin = async () => {
   overflow: hidden;
   background-image: url(../../assets/images/login/bg3.png);
   background-repeat: no-repeat;
-  background-size: 100% 100%;
+  background-size: cover;
 }
 .login {
   width: 100%;
-  max-width: 1920px;
   margin: 0 auto;
   height: 100vh;
   position: relative;
   background-color: #fff;
 
   .logo {
-    margin-top: 20px;
-    margin-left: 20px;
-    width: 100%;
-    pointer-events: none;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 30px 80px 0 20px;
   }
   .btn {
-    display: flex;
-    justify-content: end;
+    border-radius: 4px;
+    border: 1px solid #3a83fc;
+    color: #3a83fc;
+    padding: 5px 8px;
+    cursor: pointer;
   }
   .form {
-    border-radius: 5px;
-    box-shadow: 0 0 20px rgb(109 109 109 / 40%);
+    border-radius: 20px;
+    box-shadow: 0px 5px 20px 0px rgba(137, 149, 174, 0.2);
     position: absolute;
-    right: 230px;
-    top: 50%;
+    right: 270px;
+    top: 55%;
     transform: translateY(-50%);
-    width: 400px;
-    height: 490px;
-    // height: 675px;
+    width: 506px;
+    height: 590px;
     padding: 4px 30px;
     background-color: #fff;
     z-index: 1;
 
-    &:after {
-      content: "";
-      position: absolute;
-      top: 40px;
-      left: -30px;
-      width: calc(100% + 60px);
-      height: calc(100% - 80px);
-      border-radius: 10px;
-      background-color: rgba(255, 255, 255, 0.3);
-      z-index: -1;
-    }
+    // &:after {
+    //   content: "";
+    //   position: absolute;
+    //   top: 40px;
+    //   left: -30px;
+    //   width: calc(100% + 60px);
+    //   height: calc(100% - 80px);
+    //   border-radius: 10px;
+    //   background-color: rgba(255, 255, 255, 0.3);
+    //   z-index: -1;
+    // }
 
-    &:before {
-      content: "";
-      position: absolute;
-      top: 20px;
-      left: -15px;
-      width: calc(100% + 30px);
-      height: calc(100% - 40px);
-      border-radius: 10px;
-      background-color: rgba(255, 255, 255, 0.5);
-      z-index: -2;
+    // &:before {
+    //   content: "";
+    //   position: absolute;
+    //   top: 20px;
+    //   left: -15px;
+    //   width: calc(100% + 30px);
+    //   height: calc(100% - 40px);
+    //   border-radius: 10px;
+    //   background-color: rgba(255, 255, 255, 0.5);
+    //   z-index: -2;
+    // }
+    .form-item {
+      font-size: 20px;
     }
-
     .title {
-      font-size: 24px;
+      font-size: 30px;
       color: #3b4f70;
       font-weight: bold;
       line-height: 60px;
@@ -206,6 +201,9 @@ const fnSubmitLogin = async () => {
     }
 
     .button {
+      position: absolute;
+      bottom: 30px;
+      width: 445px;
       .el-button {
         background: #0a7dfe;
         height: 45px;