/* 彩虹动画 */ @keyframes rainbow { 0% { --rainbow-prev: #009ff7; --rainbow-next: #c76dd1; } 1.25% { --rainbow-prev: #009dfa; --rainbow-next: #cf69c9; } 2.5% { --rainbow-prev: #009bfc; --rainbow-next: #d566c2; } 3.75% { --rainbow-prev: #0098fd; --rainbow-next: #dc63ba; } 5% { --rainbow-prev: #0096fd; --rainbow-next: #e160b3; } 6.25% { --rainbow-prev: #0093fd; --rainbow-next: #e65eab; } 7.5% { --rainbow-prev: #2e90fc; --rainbow-next: #e95ca2; } 8.75% { --rainbow-prev: #4d8dfa; --rainbow-next: #ed5a9a; } 10% { --rainbow-prev: #638af8; --rainbow-next: #ef5992; } 11.25% { --rainbow-prev: #7587f5; --rainbow-next: #f15989; } 12.5% { --rainbow-prev: #8583f1; --rainbow-next: #f25981; } 13.75% { --rainbow-prev: #9280ed; --rainbow-next: #f25a79; } 15% { --rainbow-prev: #9f7ce9; --rainbow-next: #f25c71; } 16.25% { --rainbow-prev: #aa78e3; --rainbow-next: #f15e69; } 17.5% { --rainbow-prev: #b574dd; --rainbow-next: #ef6061; } 18.75% { --rainbow-prev: #be71d7; --rainbow-next: #ed635a; } 20% { --rainbow-prev: #c76dd1; --rainbow-next: #eb6552; } 21.25% { --rainbow-prev: #cf69c9; --rainbow-next: #e8694b; } 22.5% { --rainbow-prev: #d566c2; --rainbow-next: #e46c44; } 23.75% { --rainbow-prev: #dc63ba; --rainbow-next: #e06f3d; } 25% { --rainbow-prev: #e160b3; --rainbow-next: #db7336; } 26.25% { --rainbow-prev: #e65eab; --rainbow-next: #d77630; } 27.5% { --rainbow-prev: #e95ca2; --rainbow-next: #d17a2a; } 28.75% { --rainbow-prev: #ed5a9a; --rainbow-next: #cc7d24; } 30% { --rainbow-prev: #ef5992; --rainbow-next: #c6811e; } 31.25% { --rainbow-prev: #f15989; --rainbow-next: #bf8418; } 32.5% { --rainbow-prev: #f25981; --rainbow-next: #b98713; } 33.75% { --rainbow-prev: #f25a79; --rainbow-next: #b28a0f; } 35% { --rainbow-prev: #f25c71; --rainbow-next: #ab8d0c; } 36.25% { --rainbow-prev: #f15e69; --rainbow-next: #a3900b; } 37.5% { --rainbow-prev: #ef6061; --rainbow-next: #9c920d; } 38.75% { --rainbow-prev: #ed635a; --rainbow-next: #949510; } 40% { --rainbow-prev: #eb6552; --rainbow-next: #8b9715; } 41.25% { --rainbow-prev: #e8694b; --rainbow-next: #83991b; } 42.5% { --rainbow-prev: #e46c44; --rainbow-next: #7a9b21; } 43.75% { --rainbow-prev: #e06f3d; --rainbow-next: #719d27; } 45% { --rainbow-prev: #db7336; --rainbow-next: #679e2e; } 46.25% { --rainbow-prev: #d77630; --rainbow-next: #5da035; } 47.5% { --rainbow-prev: #d17a2a; --rainbow-next: #51a13c; } 48.75% { --rainbow-prev: #cc7d24; --rainbow-next: #44a244; } 50% { --rainbow-prev: #c6811e; --rainbow-next: #34a44b; } 51.25% { --rainbow-prev: #bf8418; --rainbow-next: #1ba553; } 52.5% { --rainbow-prev: #b98713; --rainbow-next: #00a65b; } 53.75% { --rainbow-prev: #b28a0f; --rainbow-next: #00a663; } 55% { --rainbow-prev: #ab8d0c; --rainbow-next: #00a76c; } 56.25% { --rainbow-prev: #a3900b; --rainbow-next: #00a874; } 57.5% { --rainbow-prev: #9c920d; --rainbow-next: #00a87d; } 58.75% { --rainbow-prev: #949510; --rainbow-next: #00a985; } 60% { --rainbow-prev: #8b9715; --rainbow-next: #00a98e; } 61.25% { --rainbow-prev: #83991b; --rainbow-next: #00a996; } 62.5% { --rainbow-prev: #7a9b21; --rainbow-next: #00a99f; } 63.75% { --rainbow-prev: #719d27; --rainbow-next: #00a9a7; } 65% { --rainbow-prev: #679e2e; --rainbow-next: #00a9b0; } 66.25% { --rainbow-prev: #5da035; --rainbow-next: #00a9b8; } 67.5% { --rainbow-prev: #51a13c; --rainbow-next: #00a9c0; } 68.75% { --rainbow-prev: #44a244; --rainbow-next: #00a8c7; } 70% { --rainbow-prev: #34a44b; --rainbow-next: #00a8cf; } 71.25% { --rainbow-prev: #1ba553; --rainbow-next: #00a7d5; } 72.5% { --rainbow-prev: #00a65b; --rainbow-next: #00a6dc; } 73.75% { --rainbow-prev: #00a663; --rainbow-next: #00a6e2; } 75% { --rainbow-prev: #00a76c; --rainbow-next: #00a4e7; } 76.25% { --rainbow-prev: #00a874; --rainbow-next: #00a3ec; } 77.5% { --rainbow-prev: #00a87d; --rainbow-next: #00a2f1; } 78.75% { --rainbow-prev: #00a985; --rainbow-next: #00a0f4; } 80% { --rainbow-prev: #00a98e; --rainbow-next: #009ff7; } 81.25% { --rainbow-prev: #00a996; --rainbow-next: #009dfa; } 82.5% { --rainbow-prev: #00a99f; --rainbow-next: #009bfc; } 83.75% { --rainbow-prev: #00a9a7; --rainbow-next: #0098fd; } 85% { --rainbow-prev: #00a9b0; --rainbow-next: #0096fd; } 86.25% { --rainbow-prev: #00a9b8; --rainbow-next: #0093fd; } 87.5% { --rainbow-prev: #00a9c0; --rainbow-next: #2e90fc; } 88.75% { --rainbow-prev: #00a8c7; --rainbow-next: #4d8dfa; } 90% { --rainbow-prev: #00a8cf; --rainbow-next: #638af8; } 91.25% { --rainbow-prev: #00a7d5; --rainbow-next: #7587f5; } 92.5% { --rainbow-prev: #00a6dc; --rainbow-next: #8583f1; } 93.75% { --rainbow-prev: #00a6e2; --rainbow-next: #9280ed; } 95% { --rainbow-prev: #00a4e7; --rainbow-next: #9f7ce9; } 96.25% { --rainbow-prev: #00a3ec; --rainbow-next: #aa78e3; } 97.5% { --rainbow-prev: #00a2f1; --rainbow-next: #b574dd; } 98.75% { --rainbow-prev: #00a0f4; --rainbow-next: #be71d7; } 100% { --rainbow-prev: #009ff7; --rainbow-next: #c76dd1; } } /* 彩虹色卡 */ :root,.dark { animation: rainbow 8s linear infinite; } :root { /* hero标题渐变色 */ --vp-home-hero-name-color: transparent; --vp-home-hero-name-background: -webkit-linear-gradient(120deg, var(--rainbow-prev) 30%, var(--rainbow-next)); /*hero logo背景渐变色 */ --vp-home-hero-image-background-image: linear-gradient(-45deg, var(--rainbow-prev) 30%, var(--rainbow-next)); --vp-home-hero-image-filter: blur(80px); } @media (min-width: 640px) { :root { --vp-home-hero-image-filter: blur(120px); } } @media (min-width: 960px) { :root { --vp-home-hero-image-filter: blur(120px); } } /* Safari has a very bad performance on gradient and filter */ .browser-safari, .browser-firefox { --vp-home-hero-image-background-image: transparent; --vp-home-hero-image-filter: ''; }