svg+css实现页面滚动彩虹生长动画效果代码

代码语言:html

所属分类:加载滚动

代码描述:svg+css实现页面滚动彩虹生长动画效果代码

代码标签: svg css 页面 滚动 彩虹 生长 动画

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  
  
  
<style>
:root {
  --surf--color--background: #fff9e7;
  --surf--color--foreground: #091a24;
  --surf--color--active: #00a3a3;
  --surf--color--input: #214154;
  --surf--color--navy: #102d3e;
  --surf--color--blue: #1e3c4e;
  --surf--color--teal: #25bbbb;
  --surf--color--yellow: #f0dac2;
  --surf--color--orange: #f7c03e;
  --surf--color--red: #d94a4a;
  --surf--font-family--display: noka, sans-serif;
  --surf--font-family--heading: niveau-grotesk, sans-serif;
  --surf--font-family--body: nitti-grotesk, sans-serif;
  --surf--font-family--light: nitti-grotesk-light, sans-serif;
  --modifier: 0.1;
}

body {
  font-family: sans-serif;
  min-height: 500vh;
  background: linear-gradient(#eee, #f0dac2);
}
body svg.spiral__vector {
  position: fixed;
  top: 0;
  height: 70vw;
  right: 0;
}

#spiral-rainbow-orange-path {
  fill: none;
  fill-rule: evenodd;
  stroke: var(--surf--color--orange);
  stroke-miterlimit: 10;
  stroke-width: 63px;
  animation: grow-progress linear forwards;
  animation-timeline: scroll();
}

#spiral-rainbow-yellow-path,
#spiral-rainbow-teal-path,
#spiral-rainbow-blue-path,
#spiral-rainbow-red-path {
  animation: grow-progress linear forwards;
  animation-timeline: scroll();
}

#spiral-rainbow-blue-path {
  --modifier: 0.15;
}

#spiral-rainbow-teal-path {
  --modifier: 0.13;
}

#spiral-rainbow-yellow-path {
  --modifier: 0.11;
}

#spiral-rainbow-orange-path {
  --modifier: 0.09;
}

#spiral-rainbow-red-path {
  --modifier: 0.07;
}

@keyframes grow-progress {
  from {
    stroke-dashoffset: 0.02;
    stroke-dasharray: 0px, 999999px;
  }
  to {
    stroke-dashoffset: 0.00002;
    stroke-dasharray: calc(var(--modifier) * 13215.4px), calc(var(--modifier) * 28.5938px);
  }
}
h2 {
  font-size: 8vw;
  position: fixed;
  top: 45vh;
  left: 15vw;
}

svg.intro__ribbon {
  margin-top: 350vh;
}
</style>

  
</head>

<body translate="no">
  <svg viewBox="0 0 1410 521.18" class="spiral__vector">
  <defs>
    <clipPath id="spiral-4-mask">
      <path d="M1614.97,171.21c-.49,80.2-29.97,157.93-82.91,218.18-39.25,44.81-90.6,78.89-147.27,97.28-29.82,9.7-61.09,15.18-92.43,16.11-47.81,1.9-96.2-9-138.24-31.86-84.7-45.55-139.17-134.57-140.16-230.82-2.68-116.93,91.36-215.74,208.43-217.95,32.48-.95,65.2,7.39,93.05,24.16,54.98,32.63,88.06,95.25,82.62,159.11-2.19,25.55-11.96,50.39-27.51,70.76-8.3,10.78-18.19,20.45-29.27,28.33-9.97,7.2-21.09,12.96-32.61,17.21-2.21.81-5.01,1.69-7.25,2.42-8.51,2.51-17.38,4.26-26.19,5.13-3.33.26-6.8.53-10.15.55-.75-.01-3.06.07-3.81.06-1.47-.02-3.66-.12-5.13-.16-58.12-2.76-104.81-52.25-103.73-110.48,0-1,.11-2.91.13-3.85.17-1.95.32-4.46.63-6.39l.34-2.54c.28-1.44.63-3.62.98-5.04.25-1.07.65-2.75.91-3.74.28-1.02.8-2.7,1.08-3.7,9.1-28.88,33.03-51.41,62.46-58.61.84-.18,2.91-.66,3.73-.83,2.83-.6,5.93-.95,8.81-1.3,1.52-.09,3.59-.29,5.07-.32,12.82-.56,25.78,2.32,37.04,8.51,23.97,12.99,38.65,39.67,36.2,66.89-2.52,28.59-27.52,51.17-56.21,50.69-17.22,0-33.73-10.79-40.59-26.57-7.21-16.22-4.57-35.06,9.72-46.45,9.28-7.4,22.65-10.16,33.73-5.4,11.18,4.76,18.4,16.66,17.2,28.78-.93,10.34-9.58,19.26-19.89,20.43-2.96.39-6.03.18-8.87-.78-4.47-1.5-8.29-4.77-10.47-8.95-2.76-5.27-2.93-12.12.66-17.05,5.07-7.28,16.59-8.78,21.86-.92,1.41,2.14,2.12,4.75,1.93,7.3-.27,4.12-3.52,7.75-7.57,8.52-3.7.8-7.53-1.05-8.92-4.64-.63-1.59-.72-3.43-.08-5.04,1.21-3.26,5.67-5.03,8.55-2.84,2.13,1.5,2.75,4.98.7,6.79-2.08,1.98-5.71.99-5.79-2.07-.1-1.82,2.14-3.3,3.7-2.2,1.16.77,1.19,2.73-.23,3.22-.85.37-1.94-.32-1.88-1.27,0-.71.81-1.27,1.46-.95.72.32.62,1.49-.23,1.5v-.2c.17,0,.33-.09.42-.23.19-.29.02-.73-.29-.87-.49-.23-1.13.21-1.11.75-.03.78.82,1.29,1.52.99.73-.24,1.04-1.1.78-1.8-.53-1.59-2.79-1.44-3.49-.02-.91,1.78.82,3.96,2.75,3.67,1.94-.14,3.38-2.09,3.01-3.98-.25-1.88-1.9-3.44-3.79-3.59-3.12-.27-5.93,2.46-5.69,5.6.21,4.3,4.25,7.13,8.39,6.16,4.49-.98,7.3-5.37,6.43-9.86-.85-5.45-6.07-9.31-11.53-8.65-7.04.62-12.5,7.17-11.74,14.22l.04.57.09.56c.06.38.11.76.19,1.13.34,1.46.88,2.94,1.59,4.27,3.07,5.66,9.17,8.98,15.57,8.54,3.62-.22,7.18-1.41,10.18-3.44,15.61-10.7,9.53-34.07-6.75-40.62-3.86-1.6-8.11-2.19-12.26-1.82-13.45.87-25.47,11.13-28.56,24.2-1.28,5.19-1.13,10.64-.07,15.86,3.73,18.38,20.57,32.07,39.33,31.82,25.21.04,47.14-19.69,49.55-44.8,1.74-18.3-5.4-37.07-18.52-49.88-11.66-11.5-27.88-18.07-44.26-17.86-22.16.22-43.03,9.67-57.83,26.16-2.98,3.42-5.82,7.1-8.18,10.97-.72,1.08-1.65,2.8-2.3,3.94-.15.24-.41.75-.53,1.01-4.05,7.72-6.74,16.17-8.03,24.79-.12,1.09-.35,2.89-.47,3.95-.06,1.04-.2,2.94-.27,3.97-.57,17.2,3.43,34.58,11.64,49.68,18.76,34.63,55.72,54.5,94.91,51.09,9.9-.71,19.8-2.67,29.23-5.76,1.08-.38,3.25-1.13,4.33-1.51,1.64-.6,3.69-1.48,5.33-2.12,10.14-4.36,19.85-10.05,28.43-16.99,23.91-18.93,40.2-46.98,44.66-77.15.34-2.12.55-4.64.84-6.77.11-2.05.37-4.75.43-6.81l.08-4.55.02-1.14c-.05-2.59-.13-5.47-.28-8.06-2.17-38.24-19.37-75.27-47.18-101.59-29.2-28.07-69.41-43.5-109.9-42.09-97.07,1.75-179.57,79.95-185.9,176.9-4.43,69.26,22.9,138.3,72.98,186.2,49.22,47.42,115.36,70.85,183.41,65.98,29.04-1.81,57.86-7.83,85.15-17.92,50.21-18.47,95.09-50.79,128.77-92.33,9.51-11.81,18.33-24.43,25.95-37.55,19.2-32.77,31.93-69.29,37.39-106.86,2.12-15.01,3.17-30.2,3.06-45.36h38.9,0Z" style="fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-3-mask">
      <path d="M1554.03,177.83c-.6,95.79-50.79,184.9-132.32,235.15-22.85,14.13-47.85,24.93-73.82,31.84-31.44,8.32-64.42,11.37-96.79,7.97-111.27-11.85-198.08-107.64-198.02-219.65-1.31-98.14,79.39-180.2,177.64-179.77,2.36.01,6.11.13,8.54.23,2.03.16,4.35.34,6.4.52,2.46.2,6.05.78,8.49,1.1,2.41.46,6.03,1.07,8.4,1.65,1.95.48,4.32.99,6.23,1.54,1.56.42,4.67,1.38,6.16,1.82,1.14.37,4.84,1.7,6.06,2.1,2.27.83,4.69,1.9,6.94,2.79,4.23,1.89,8.38,3.92,12.45,6.14,2.19,1.34,5.24,2.97,7.32,4.39l3.57,2.33c1.61,1.09,3.62,2.57,5.21,3.71,1.03.65,3.97,3.14,5.03,3.94.55.45,1.12.88,1.65,1.35l1.6,1.41,3.2,2.82,3.06,2.96c.3.28,1.63,1.59,1.91,1.85l.36.39.73.77c.56.54,3.12,3.36,3.63,3.88.34.38,1.69,1.99,2.07,2.43,2.16,2.46,4.65,5.7,6.62,8.32.69,1.02,2.92,4.14,3.65,5.23,2.53,3.85,4.87,7.82,7.09,11.85,6.45,12.2,11.16,25.33,13.89,38.84.37,1.89.76,4.35,1.09,6.27.27,1.28.62,4.93.81,6.3.31,2.34.5,6.04.67,8.44.11,1.93.1,4.39.14,6.34,0,.62.04,1.51,0,2.12-.04.85-.15,4.6-.18,5.35-.13,1.52-.31,3.8-.45,5.33-.12,1.35-.66,4.96-.84,6.37-5.31,32.68-24.8,61.7-53.05,78.98-9.62,5.95-20.23,10.36-31.17,13.19-1.91.51-4.27.96-6.2,1.41-1.03.17-3.15.54-4.18.71-1.55.33-4.73.59-6.3.82-1.96.23-4.36.3-6.33.46-2.12.05-4.22.1-6.35.1l-4.28-.14-4.27-.36c-1.3-.12-2.96-.4-4.25-.55-43.29-6.29-77.11-44.66-77.36-88.46-.1-3.14.09-6.47.39-9.59.06-.75.34-2.4.42-3.18.16-1.22.54-2.98.76-4.21.64-2.75,1.35-5.59,2.29-8.24.41-1.22,1-2.84,1.49-4.01.22-.57.57-1.42.83-1.97,8.55-19.55,26.04-34.91,46.59-40.68,6.78-1.96,13.88-2.87,20.93-2.8.49.03,2.25.07,2.67.09,1.83.13,4.02.36,5.85.64,21.01,3.3,39.03,18.36,45.92,38.48,2.43,7.01,3.5,14.52,3.12,21.93-1.27,24.28-21.94,44.06-46.28,43.99-20.84.32-38.24-17.07-37.77-37.94.16-16.28,14.08-29.79,30.36-29.37,11.67.07,22.02,9.33,23.33,20.91.56,4.23-.15,8.68-2.25,12.41-2.28,4.02-6.01,7.23-10.39,8.72-.66.26-1.37.43-2.04.59l-.52.13c-.17.04-.35.06-.53.08-1.38.23-2.84.34-4.24.24-6.94-.38-12.87-5.64-14.12-12.48-.22-1.38-.34-2.85-.18-4.24.52-4.63,3.86-8.81,8.31-10.23,5.74-2,12,.87,13.47,6.91.73,2.78,0,5.9-2.08,7.92-2.03,1.98-5.23,2.88-7.91,1.79-2.69-1.06-4.42-4.09-3.82-6.94,1.07-4.87,8.28-5.6,9-.23.16,1.45-.77,2.93-2.16,3.39-.68.24-1.45.27-2.12-.02-1.36-.54-2.08-2.39-1.2-3.62.9-1.31,3.07-1.17,3.39.51.17.73-.36,1.54-1.11,1.64-.75.18-1.54-.58-1.3-1.35.11-.37.47-.63.85-.63.39-.01.75.34.73.73h-.18c0-.29-.26-.55-.55-.53-.29,0-.57.21-.65.5-.08.28.02.61.23.81.76.71,1.94-.18,1.7-1.12-.27-1.39-2.12-1.46-2.83-.36-1.09,1.85.97,3.83,2.88,3.02,1.19-.42,1.94-1.68,1.79-2.92-.28-2.79-3.35-3.97-5.65-2.59-2.32,1.31-2.77,4.31-1.47,6.52,1.66,2.93,5.41,3.46,8.18,1.83,4.18-2.42,4.36-7.88,1.48-11.39-1.57-1.94-4.03-3.11-6.51-3.13-5.49-.1-10.31,4.21-10.83,9.68-.47,5.8,2.89,11.25,8.24,13.51,3.32,1.39,7.16,1.26,10.56.13.24-.09,1.06-.4,1.32-.5.52-.28,1.2-.55,1.68-.86l.8-.5c.24-.12.56-.37.77-.54,11.18-8.21,7.74-25.18-3.43-31.67-4.31-2.6-9.51-3.44-14.46-2.67-10.02,1.33-18.8,8.92-21.57,18.62-2.12,7.26-.94,15.24,2.31,21.98,3.33,6.75,9.01,12.32,15.86,15.44,13.87,6.37,31.04,2.03,41.89-8.2,7.82-7.25,12.55-17.62,12.97-28.25.22-6.76-.92-13.59-3.28-19.92-6.54-17.42-22.41-30.26-40.86-32.85-3.04-.4-6.28-.61-9.35-.45-5.98.17-11.96,1.25-17.66,3.04-17.99,5.74-33.07,19.71-40.07,37.25-1.52,3.75-2.66,7.69-3.47,11.65-.42,2.38-.83,5-.98,7.42-1.02,15.06,2.46,30.46,9.73,43.66,13.93,25.64,41.7,42.14,70.88,41.83,2.47-.05,5.1-.12,7.57-.35,3.6-.26,7.71-.82,11.25-1.53,31.23-5.94,58.19-26.96,71.83-55.64.26-.47.55-1.22.78-1.71.7-1.6,1.59-3.54,2.17-5.19.37-1,1-2.5,1.3-3.52.71-2.06,1.64-5.08,2.17-7.17.65-2.41,1.18-4.85,1.62-7.31l.63-3.69.44-3.72.11-.93.06-.46.03-.47.12-1.87c.04-1.01.23-2.72.2-3.74l.06-3.74v-.47s0-.47,0-.47l-.03-.95c-.04-.93-.09-2.86-.13-3.79.01-1.43-.33-4.25-.42-5.67-.08-1.03-.24-2.74-.41-3.77-1.85-15-6.46-29.71-13.53-43.05-2.3-4.47-4.99-8.75-7.79-12.92-.6-.79-2.71-3.76-3.32-4.58-1.36-1.72-3.31-4.21-4.75-5.85-.87-.95-2.25-2.56-3.12-3.53-1.05-1.08-3.21-3.32-4.26-4.4-1.27-1.2-3.24-3.01-4.47-4.18l-2.87-2.44c-1.68-1.52-4.12-3.28-5.89-4.68-1.42-1.11-3.15-2.2-4.61-3.25-1.49-1.09-3.3-2.1-4.75-3.04-1.19-.81-2.06-1.23-3.24-1.91l-3.27-1.84-3.36-1.69c-2.49-1.32-5.11-2.35-7.67-3.52-1.98-.75-4.14-1.62-6.13-2.34-.97-.29-4.35-1.44-5.34-1.75-2.1-.58-5.12-1.46-7.24-1.93-1.63-.33-3.84-.89-5.49-1.19-1.03-.17-4.49-.76-5.54-.94-1.83-.25-4.68-.54-6.51-.77-2.1-.11-4.43-.32-6.54-.42-86.62-3.19-160.98,66.83-162.41,153.55-2.17,107.94,84.91,198.72,192.96,200.27,36.59.48,73.26-7.25,106.47-22.59,33.1-15.28,62.77-38.01,86.1-66.03,24.09-28.79,41.48-63.23,50.17-99.75,1.12-4.71,2.22-9.89,3.04-14.67,2.59-14.74,3.78-29.76,3.67-44.72,5.77,0,11.55,0,17.32,0,6.11,0,12.23,0,18.34,0,0,0-.01,0-.02,0Z" style="fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-2-mask">
      <path d="M1492.48,184.5c-.81,118.65-95.84,216.84-214.61,220.41-102.63,4.5-189-79.78-185.46-182.68,2.27-75.62,65.25-137.32,140.98-137.33,58.58-.71,108.58,43.7,114.44,102.04.16,1.05.3,3.93.39,5.05l.11,1.68.03,1.69c0,1.23.1,3.89.03,5.07-.02.86-.09,2.56-.12,3.42-.11,1.71-.28,3.41-.43,5.11-2.8,25.07-16.13,48.12-36.42,63.1-13.61,10.07-30.08,16.25-46.97,17.46-3.23.26-6.9.33-10.14.19-1.01.01-2.4-.15-3.41-.22l-1.7-.15-1.7-.23c-32-3.95-58.69-30.74-62.42-62.75-1.17-8.99-.66-18.25,2.08-26.92,5.09-16.36,17.52-29.91,33.35-36.44,8.35-3.4,17.51-4.94,26.51-4.16,14.81,1.22,28.56,10.04,36,22.82,6.81,11.64,8.74,26.68,3,39.12-7.34,16.7-28.14,26.56-45.37,19.52-12.28-4.98-20.12-18.28-18.1-31.44,1.47-9.62,9.3-17.78,18.86-19.57,4.42-.89,9.21-.5,13.26,1.58,13.3,6.49,14.89,26.81-.4,31.76-3.25.93-6.9.87-9.93-.75-3.03-1.54-5.36-4.41-6.22-7.7-.58-2.18-.6-4.57.24-6.68,1.58-4.31,6.44-7.09,10.93-6.07,3.37.76,5.96,3.89,6.03,7.34.23,3.52-2.81,6.66-6.33,6.56-2.31,0-4.43-1.77-4.86-4.03-.61-2.65,1.53-5.27,4.29-4.99,1.43.15,2.67,1.34,2.83,2.77.33,1.77-1.44,3.45-3.19,2.91-1.85-.56-1.98-3.46.17-3.62,1.29-.1,2,1.8.69,2.33-.55.24-1.25-.18-1.23-.8h.13c0,.52.57.85,1.04.64,1.1-.46.44-2.06-.63-1.95-1.06.03-1.65,1.26-1.16,2.16.43.94,1.61,1.24,2.51.8,1.46-.62,1.64-2.62.66-3.74-1.73-2.13-5.24-.64-5.55,1.9-.22,1.46.44,3.01,1.58,3.92,2.41,1.95,6.2.65,7.5-1.98,1.87-3.65-.84-8.36-4.74-9.1-1.93-.4-3.99.04-5.69,1.01-2.79,1.59-4.48,4.85-4.16,8.04,0,.42.13,1.05.19,1.47.88,4.14,4.31,7.49,8.49,8.2,5.91,1,12.07-2.68,14.18-8.24,1.44-3.67,1.04-7.91-.5-11.49-9.85-20.33-42.1-6.85-34.75,18.09,3.37,11.69,14.81,19.54,26.93,18.49,11.88-.7,22.93-8.5,27.55-19.45,6.31-14.66.78-32.67-10.92-42.99-9.03-8.1-20.84-11.4-32.77-9.87-15.32,1.78-29.28,10.75-37.27,23.94-6.54,10.56-8.57,23.22-6.64,35.41,3.26,23.56,20.9,44.26,43.65,51.13,5.13,1.6,10.48,2.51,15.84,2.78,1.13.05,2.53.05,3.66.06.41-.02,3.22-.12,3.72-.13,1.95-.14,3.98-.3,5.92-.58,38.44-5,68.03-37.87,68.59-76.67.81-52.55-40.09-97-92.63-100.07-62.1-3.46-118.38,42.15-127.85,103.58-.33,1.66-.58,4.12-.78,5.81-.1.87-.26,2.05-.31,2.91-.7,8.81-.57,17.78.37,26.56,4.89,51.27,37.41,98.59,83.33,121.74,20.93,10.76,44.25,16.49,67.74,16.79,23.74.22,47.55-3.92,69.78-12.24,61.12-22.45,108.75-77.63,121.41-141.57.99-4.71,1.79-9.67,2.39-14.45,1.11-8.72,1.59-17.52,1.52-26.32h32.42Z" style="fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-1-mask">
      <path d="M1441.47,190.1c-.86,98.98-83.95,178.64-183.05,173.97-1.74-.02-6.27-.5-8.08-.63-2.04-.23-4.65-.63-6.7-.9-2.47-.38-5.52-1.01-7.97-1.48-.68-.13-5.71-1.4-6.56-1.59-1-.25-5.58-1.67-6.48-1.91-1.85-.61-4.53-1.58-6.37-2.22-2.16-.82-4.73-1.91-6.88-2.77-1.32-.63-5.45-2.49-6.71-3.15-1.83-.97-4.15-2.14-5.95-3.15-2.25-1.34-4.75-2.72-6.91-4.17-19.58-12.51-36.05-29.98-47.28-50.32l-1.31-2.33c-.6-1.19-1.8-3.59-2.4-4.79-.85-1.57-2.53-5.64-3.29-7.32-1.81-4.53-3.5-9.19-4.88-13.86-.4-1.44-1.01-3.71-1.4-5.15-.51-1.75-1.34-6.04-1.75-7.82-.32-1.89-.78-4.68-1.1-6.58-.27-2.46-.7-5.49-.88-7.95-.11-1.87-.45-6.16-.43-7.97-2.07-52.86,33.38-100.63,84.73-113.5,12.33-3.08,25.17-4.12,37.81-2.82,10.51,1.22,20.81,4.24,30.26,8.97,3.11,1.59,6.42,3.46,9.31,5.4,4.11,2.65,7.99,5.82,11.62,9.1.56.54,2.29,2.23,2.89,2.81,1.06,1.09,2.18,2.31,3.21,3.42,1.87,2.14,3.78,4.51,5.47,6.78.89,1.32,2.21,3.09,3.01,4.43l1.42,2.27c.63,1.04,1.38,2.42,1.99,3.49.77,1.34,1.72,3.39,2.42,4.77.31.71,1.28,2.91,1.61,3.67,3.69,9.04,5.97,18.74,6.53,28.5,1.11,15.37-2.47,30.67-10.6,43.78-8.47,13.69-21.62,24.42-36.79,29.86-7.53,2.69-15.53,4.15-23.53,4.19-13.49.27-27.03-4.44-37.42-13.01-13.94-11.25-22.03-29.22-21.05-47.11.79-18.08,13.19-34.81,30.22-40.83,8.38-3.01,17.75-3.77,26.34-1.22,15.33,4.42,26.4,19.04,26.35,35.01.35,15.25-11.92,28.76-27.13,29.77-7.16.68-14.59-1.99-19.51-7.26-6.16-6.4-8.56-16.76-4.42-24.83.61-1.28,1.52-2.54,2.4-3.65,1.4-1.59,3.01-3.03,4.86-4.08,1.81-1.11,3.84-1.81,5.91-2.26.62-.08,1.69-.28,2.31-.29,6.16-.56,12.2,2.83,14.91,8.38,1.39,2.8,1.9,6.04,1.31,9.13-1.12,5.84-6.85,10.19-12.77,9.61-7.72-.6-12.16-10.8-5.63-15.87,2.14-1.6,5.23-2.06,7.61-.75,2.77,1.48,4.19,5.35,2.42,8.1-1.7,2.82-6.23,3.26-7.77.07-1.12-2.14.19-4.89,2.71-4.94,2.6-.13,3.8,3.69,1.11,4.54-1.43.47-2.86-1.25-1.83-2.47.64-.75,2.01-.48,2.04.6.03.47-.39.9-.86.89v-.16c.94-.05.83-1.35,0-1.51-.78-.17-1.47.65-1.22,1.4.56,1.8,3.11.94,3-.75-.02-.77-.48-1.48-1.14-1.83-1.37-.71-3.22.28-3.55,1.76-.18.72-.06,1.53.29,2.2,1.23,2.44,4.66,2.24,6.21.24,1.36-1.65,1.11-4.17-.17-5.79-1.88-2.58-5.79-2.58-8.14-.66-3.24,2.46-3.19,7.16-.77,10.19,1.38,1.8,3.56,2.96,5.83,3.11,5.01.38,9.85-3.43,10.66-8.37,1.26-7.39-4.85-14.59-12.33-14.61-.34-.05-.8.02-1.14.03-.33.02-.82.04-1.15.09l-1.13.19-.28.05-.28.07c-.93.22-1.83.54-2.72.89-5.37,2.42-8.94,7.32-9.53,13.19-.74,8.92,4.97,17.54,13.44,20.39,5.79,1.99,12.32,1.09,17.73-1.59,9.93-5.01,15.19-15.68,13.48-26.58-2.3-17.06-18.15-29.02-35.16-26.79-15.65,1.54-29.6,13.39-33.54,28.6-1.44,5.12-1.63,10.54-1.03,15.81,2.4,22.39,21.09,41.04,43.54,43.07.63.09,1.62.12,2.26.17,1.49.1,3.05.09,4.55.04,1.78-.04,3.97-.21,5.74-.44,1.05-.15,2.37-.3,3.41-.53,18.83-3.32,35.62-16.04,43.95-33.24,4.73-9.5,6.75-20.25,6.08-30.83-.04-1.36-.28-3.23-.37-4.59-.42-2.99-.85-6.13-1.61-9.05l-.54-2.23-.65-2.2c-1.74-5.83-4.25-11.52-7.36-16.75-.86-1.55-2.1-3.35-3.08-4.82-.52-.73-1.52-2.06-2.02-2.77-.84-.98-2.02-2.6-2.89-3.54l-1.52-1.71-.38-.43c-.91-.91-1.88-1.95-2.8-2.85-.5-.5-2.01-1.84-2.51-2.33-3.71-3.24-7.73-6.19-11.97-8.69-9.62-5.64-20.51-9.12-31.61-10.13-10.84-.85-21.88.32-32.35,3.19-42.29,11.52-71.91,51.6-69.99,95.41.07,1.37.08,3.26.21,4.61l.41,4.59c.2,2.11.65,4.73.92,6.84.31,1.63.77,4.02,1.08,5.65.33,1.53,1.24,5.18,1.66,6.69.44,1.47,1.04,3.49,1.47,4.95,1.72,5.14,3.84,10.51,6.23,15.4.88,1.91,2.2,4.22,3.16,6.1.58.98,1.75,2.96,2.33,3.94l.58.99.63.96c11.45,17.95,27.77,32.84,46.77,42.43.93.47,2.65,1.31,3.56,1.77l.52.23,4.16,1.82c.61.3,1.48.58,2.11.83.71.28,2.49.94,3.18,1.21.82.35,2.39.79,3.23,1.08,1.23.41,3.08,1.03,4.33,1.34l4.38,1.18c.88.2,4.75,1.02,5.53,1.21.87.18,2.48.41,3.35.56.81.15,2.56.44,3.36.53.79.1,2.58.28,3.37.39,2.09.31,5.79.43,7.9.6,1.63.02,4.03.05,5.66.07,2.21,0,4.69-.1,6.91-.22,58.95-2.84,112.04-41.9,132.3-97.32,3.69-9.92,6.26-20.24,7.74-30.71,1.02-7.48,1.51-15.04,1.42-22.58h29.17,0Z" style="fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-rainbow-red-mask">
      <path d="M976.38,112.47L-37.96,421.48l26.57,69.98c335.93-112.16,670.68-218.98,1010.14-347,105.44-22.43,201.06-14.49,249.86,65.51.62,1.01-.6-1.04,0,0h0c-.45-.8.46.79,0,0-57.36-97.82-159.85-140.17-272.23-97.5Z" style="clip-rule: evenodd; fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-rainbow-orange-mask">
      <path d="M981.62,144.17L-13.65,485.51l21.96,57.83L994.56,175.86c75-22.51,198.71-41.56,254.05,34.11h0c-51.21-88.24-165.87-104.19-266.99-65.8Z" style="clip-rule: evenodd; fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-rainbow-yellow-mask">
      <path d="M1007.21,171.25L7.62,541.53l17.05,44.9L1013.15,196.79c60.7-30.29,188.01-48.71,235.45,13.18h0c-51.67-73.92-157.26-70.67-241.4-38.72Z" style="clip-rule: evenodd; fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-rainbow-teal-mask">
      <path d="M1027.53,188.51c-49.47,20.63-618.93,245.65-1003.09,397.31l13.95,36.74L1078.71,194.37c49.95-18.97,133.11-24.27,169.9,15.6h0c-38.44-49.08-123.74-62.05-221.08-21.46Z" style="clip-rule: evenodd; fill: none;"></path>
    </clipPath>
    <clipPath id="spiral-rainbow-blue-mask">
      <path d="M1078.85,192.65L37.4,619.97l11.17,29.43L1081.46,211.15c48.7-20.01,131.25-31.25,167.15-1.18h0c-39.63-43.49-118.28-37.19-169.75-17.32Z" style="clip-rule: evenodd; fill: none;"></path>
    </clipPath>
  </defs>
  <g id="spiral">
    <g id="spiral-4">
      <g style="clip-path: url(&quot;#spiral-4-mask&quot;);">
        <path id="spiral-4-path-4" d="M1250.52,212.59c-.25.12-1.36.63-2.62.18-.26-.09-.98-.36-1.49-1.11-.21-.3-.81-1.33-.36-2.45.29-.71.94-1.3,1.74-1.44.2-.04,1-.19,1.66.36.05.04.8.67.66,1.6-.01.1-.15.9-.86,1.22-.09.04-.61.26-1.15-.01-.12-.06-.68-.37-.69-.96,0-.42.26-.83.65-.97.07-.03.44-.16.77.07.18.13.38.39.32.7-.06.3-.35.54-.7.55" style="fill: none; stroke: var(--surf--color--navy); stroke-miterlimit: 10; stroke-width: 1px; stroke-dashoffset: 0; stroke-dasharray: none;"></path>
        <path id="spiral-4-path-3" d="M1271.76,201.15c.62,2.94,1.84,10.83-3.1,18.1-.75,1.1-5.14,7.34-13.39,9.05-1.8.37-6.44,1.27-11.62-.98-1.32-.57-5.74-.........完整代码请登录后点击上方下载按钮下载查看

网友评论0