diff --git a/web/src/index.css b/web/src/index.css
index ef6569c2..49fe9403 100644
--- a/web/src/index.css
+++ b/web/src/index.css
@@ -1,13 +1,126 @@
+@font-face {
+    font-family: 'CZL';
+    src: url('https://cdn-r2.czl.net/fonts/CZL/CZL_Sans_SC_Thin.woff2') format('woff2');
+    font-weight: 100;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'CZL';
+    src: url('https://cdn-r2.czl.net/fonts/CZL/CZL_Sans_SC_Black.woff2') format('woff2');
+    font-weight: 900;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'CZL';
+    src: url('https://cdn-r2.czl.net/fonts/CZL/CZL_Sans_SC_Bold.woff2') format('woff2');
+    font-weight: bold;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'CZL';
+    src: url('https://cdn-r2.czl.net/fonts/CZL/CZL_Sans_SC_Light.woff2') format('woff2');
+    font-weight: 300;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'CZL';
+    src: url('https://cdn-r2.czl.net/fonts/CZL/CZL_Sans_SC_Medium.woff2') format('woff2');
+    font-weight: 500;
+    font-style: normal;
+    font-display: swap;
+}
+
+@font-face {
+    font-family: 'CZL';
+    src: url('https://cdn-r2.czl.net/fonts/CZL/CZL_Sans_SC_Regular.woff2') format('woff2');
+    font-weight: normal;
+    font-style: normal;
+    font-display: swap;
+}
+
 body {
     margin: 0;
     padding-top: 55px;
     overflow-y: scroll;
-    font-family: -apple-system,BlinkMacSystemFont,'Helvetica Neue',Helvetica,Segoe UI,Arial,Roboto,'PingFang SC',miui,'Hiragino Sans GB','Microsoft Yahei',sans-serif ;
+    font-family: "CZL", -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', miui, 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
     -webkit-font-smoothing: antialiased;
     -moz-osx-font-smoothing: grayscale;
     scrollbar-width: none;
 }
 
+html,
+body,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+a,
+p,
+span,
+input,
+div,
+label,
+pre,
+select,
+option,
+textarea,
+th,
+td,
+li,
+em,
+strong,
+cite,
+q,
+dfn,
+abbr,
+time,
+var,
+samp,
+kbd,
+sub,
+sup,
+i,
+b,
+u,
+mark,
+ruby,
+rt,
+rp,
+bdi,
+bdo,
+s,
+small,
+del,
+ins,
+caption,
+figure,
+figcaption,
+main,
+nav,
+article,
+section,
+header,
+footer,
+aside,
+details,
+summary，code {
+    font-family: "CZL", -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', miui, 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif;
+}
+
+button {
+    font-family: "CZL", -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Segoe UI, Arial, Roboto, 'PingFang SC', miui, 'Hiragino Sans GB', 'Microsoft Yahei', sans-serif !important;
+}
+
 body::-webkit-scrollbar {
     display: none;
 }