← 回到列表

#45

hy4 workbuddy workbuddy 2026-10-21 09:19(16 天前)
耗时69.14 s
首字延迟—
输入字节未采集
输入 tokens—
输出字节11.7 KB
tokens—
元素 / 动画141 / 20
配色数41
来源guest

模型名由工作台自动填成 workbuddy-ai-default,用户确认为 hy4,已改

下载 SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 500" role="img" aria-label="A pelican riding a bicycle">
  <defs>
    <linearGradient id="sky" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0" stop-color="#7fc9ef"/>
      <stop offset="1" stop-color="#e9f8ff"/>
    </linearGradient>
    <linearGradient id="feather" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0" stop-color="#ffffff"/>
      <stop offset="1" stop-color="#d5e2ee"/>
    </linearGradient>
    <linearGradient id="pouch" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0" stop-color="#ffc861"/>
      <stop offset="1" stop-color="#ef8a1f"/>
    </linearGradient>
    <linearGradient id="road" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0" stop-color="#5d6672"/>
      <stop offset="1" stop-color="#3a414a"/>
    </linearGradient>
    <style><![CDATA[.spin { animation: spin 0.9s linear infinite; }
      @keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
      .bob { animation: bob 0.9s ease-in-out infinite; }
      @keyframes bob {
        0%,100% { transform: translateY(0); }
        25% { transform: translateY(-4px); }
        50% { transform: translateY(0); }
        75% { transform: translateY(2px); }
      }
      .nodbob { animation: nod 0.9s ease-in-out infinite; }
      @keyframes nod {
        0%,100% { transform: rotate(0deg); }
        50% { transform: rotate(-2.5deg); }
      }
      #wheelRear { transform-origin: 250px 350px; }
      #wheelFront { transform-origin: 550px 350px; }
      #crank { transform-origin: 390px 350px; }
      #head { transform-origin: 430px 140px; }]]></style>
  </defs>

  <rect x="0" y="0" width="800" height="500" fill="url(#sky)"/>
  <circle cx="700" cy="90" r="44" fill="#ffe89a" opacity="0.85"/>
  <circle cx="700" cy="90" r="60" fill="#ffe89a" opacity="0.25"/>

  <g fill="#ffffff" opacity="0.9">
    <animateTransform attributeName="transform" type="translate" from="0 0" to="-1100 0" dur="26s" repeatCount="indefinite"/>
    <g>
      <ellipse cx="120" cy="95" rx="46" ry="24"/>
      <ellipse cx="160" cy="82" rx="34" ry="26"/>
      <ellipse cx="86" cy="86" rx="26" ry="18"/>
    </g>
    <g>
      <ellipse cx="470" cy="60" rx="40" ry="21"/>
      <ellipse cx="504" cy="50" rx="30" ry="23"/>
      <ellipse cx="444" cy="53" rx="22" ry="15"/>
    </g>
    <g>
      <ellipse cx="1220" cy="95" rx="46" ry="24"/>
      <ellipse cx="1260" cy="82" rx="34" ry="26"/>
      <ellipse cx="1186" cy="86" rx="26" ry="18"/>
    </g>
    <g>
      <ellipse cx="1570" cy="60" rx="40" ry="21"/>
      <ellipse cx="1604" cy="50" rx="30" ry="23"/>
      <ellipse cx="1544" cy="53" rx="22" ry="15"/>
    </g>
  </g>

  <path d="M0,415 Q140,330 300,415 T620,415 T900,415 L900,500 L0,500 Z" fill="#8fc98a" opacity="0.55"/>
  <path d="M0,425 Q200,360 420,425 T820,425 L820,500 L0,500 Z" fill="#6fb56d" opacity="0.6"/>
  <rect x="0" y="418" width="800" height="82" fill="url(#road)"/>
  <rect x="0" y="418" width="800" height="5" fill="#7c8794"/>

  <g>
    <animateTransform attributeName="transform" type="translate" from="0 0" to="-80 0" dur="0.45s" repeatCount="indefinite"/>
    <rect x="0" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="80" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="160" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="240" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="320" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="400" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="480" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="560" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="640" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="720" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="800" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
    <rect x="880" y="456" width="44" height="7" rx="3.5" fill="#ffd75e"/>
  </g>

  <g stroke="#c8d3de" stroke-width="3" opacity="0.8">
    <line x1="600" y1="300" x2="760" y2="300" stroke-linecap="round">
      <animate attributeName="x1" values="640;600;640" dur="0.9s" repeatCount="indefinite"/>
      <animate attributeName="x2" values="800;760;800" dur="0.9s" repeatCount="indefinite"/>
    </line>
    <line x1="620" y1="340" x2="740" y2="340" stroke-linecap="round">
      <animate attributeName="x1" values="660;620;660" dur="0.9s" repeatCount="indefinite"/>
      <animate attributeName="x2" values="780;740;780" dur="0.9s" repeatCount="indefinite"/>
    </line>
    <line x1="640" y1="380" x2="720" y2="380" stroke-linecap="round">
      <animate attributeName="x1" values="676;640;676" dur="0.9s" repeatCount="indefinite"/>
      <animate attributeName="x2" values="756;720;756" dur="0.9s" repeatCount="indefinite"/>
    </line>
  </g>

  <g>
    <g id="wheelRear" class="spin">
      <circle cx="250" cy="350" r="70" fill="none" stroke="#2b3038" stroke-width="9"/>
      <circle cx="250" cy="350" r="60" fill="none" stroke="#98a4b3" stroke-width="4"/>
      <g stroke="#b9c4d1" stroke-width="2.5">
        <line x1="250" y1="290" x2="250" y2="410"/>
        <line x1="190" y1="350" x2="310" y2="350"/>
        <line x1="208" y1="308" x2="292" y2="392"/>
        <line x1="292" y1="308" x2="208" y2="392"/>
        <line x1="227" y1="294" x2="273" y2="406"/>
        <line x1="273" y1="294" x2="227" y2="406"/>
      </g>
      <circle cx="250" cy="350" r="7" fill="#3a414a"/>
    </g>

    <g id="wheelFront" class="spin">
      <circle cx="550" cy="350" r="70" fill="none" stroke="#2b3038" stroke-width="9"/>
      <circle cx="550" cy="350" r="60" fill="none" stroke="#98a4b3" stroke-width="4"/>
      <g stroke="#b9c4d1" stroke-width="2.5">
        <line x1="550" y1="290" x2="550" y2="410"/>
        <line x1="490" y1="350" x2="610" y2="350"/>
        <line x1="508" y1="308" x2="592" y2="392"/>
        <line x1="592" y1="308" x2="508" y2="392"/>
        <line x1="527" y1="294" x2="573" y2="406"/>
        <line x1="573" y1="294" x2="527" y2="406"/>
      </g>
      <circle cx="550" cy="350" r="7" fill="#3a414a"/>
    </g>

    <path d="M250,350 L390,350 L330,258 Z" fill="none" stroke="#d8443a" stroke-width="9" stroke-linejoin="round" stroke-linecap="round"/>
    <path d="M390,350 L528,272" fill="none" stroke="#d8443a" stroke-width="9" stroke-linecap="round"/>
    <path d="M330,258 L528,272" fill="none" stroke="#d8443a" stroke-width="9" stroke-linecap="round"/>
    <path d="M528,258 L536,300 L550,350" fill="none" stroke="#3a414a" stroke-width="8" stroke-linecap="round"/>
    <path d="M250,350 L390,350" fill="none" stroke="#4a515b" stroke-width="3"/>
    <path d="M390,345 L255,344" fill="none" stroke="#4a515b" stroke-width="2.5"/>
    <circle cx="390" cy="350" r="19" fill="none" stroke="#8e97a3" stroke-width="4"/>
    <circle cx="250" cy="350" r="9" fill="none" stroke="#8e97a3" stroke-width="3"/>
    <rect x="318" y="246" width="46" height="12" rx="6" fill="#3a414a" transform="rotate(-6 341 252)"/>
    <path d="M528,272 L528,240 C528,228 520,222 508,222 L486,224" fill="none" stroke="#3a414a" stroke-width="8" stroke-linecap="round"/>
    <rect x="470" y="217" width="24" height="10" rx="5" fill="#22262c"/>
  </g>

  <g>
    <path d="M335,248 Q378,300 362,350" fill="none" stroke="#d98b2a" stroke-width="11" stroke-linecap="round">
      <animate attributeName="d" dur="0.9s" repeatCount="indefinite" values="M335,248 Q378,300 362,350;M335,248 Q388,292 390,322;M335,248 Q400,315 390,378;M335,248 Q405,300 418,350;M335,248 Q378,300 362,350"/>
    </path>
    <ellipse cx="362" cy="350" rx="13" ry="5.5" fill="#c07a1f">
      <animate attributeName="cx" values="362;390;390;418;362" dur="0.9s" repeatCount="indefinite"/>
      <animate attributeName="cy" values="350;322;378;350;350" dur="0.9s" repeatCount="indefinite"/>
    </ellipse>
  </g>

  <g class="bob">
    <g>
      <path d="M300,258 C238,258 200,232 176,196 C214,196 236,180 250,158 C296,178 330,196 352,214 Z" fill="#dbe6f0" stroke="#b7c6d4" stroke-width="2"/>
      <path d="M186,200 C214,204 232,196 246,182" fill="none" stroke="#b7c6d4" stroke-width="2"/>
      <path d="M204,226 C230,228 250,222 264,210" fill="none" stroke="#b7c6d4" stroke-width="2"/>

      <ellipse cx="318" cy="206" rx="64" ry="50" fill="url(#feather)" stroke="#b7c6d4" stroke-width="2.5"/>
      <path d="M300,168 C332,182 356,208 360,240 C340,232 316,214 300,196 Z" fill="#e9f1f8" opacity="0.9"/>

      <path d="M352,232 C386,214 404,178 416,150" fill="none" stroke="#ffffff" stroke-width="34" stroke-linecap="round"/>
      <path d="M352,232 C386,214 404,178 416,150" fill="none" stroke="#c9d6e2" stroke-width="34" stroke-linecap="round" opacity="0.25"/>

      <g id="head" class="nodbob">
        <path d="M446,126 L586,146 L446,146 Z" fill="#ffd066" stroke="#d99b26" stroke-width="2" stroke-linejoin="round"/>
        <path d="M448,142 C474,206 546,204 578,152 C536,162 490,156 448,142 Z" fill="url(#pouch)" stroke="#d97e12" stroke-width="2">
          <animate attributeName="d" dur="1.8s" repeatCount="indefinite" values="M448,142 C474,206 546,204 578,152 C536,162 490,156 448,142 Z;M448,142 C474,214 546,212 578,152 C536,166 490,158 448,142 Z;M448,142 C474,206 546,204 578,152 C536,162 490,156 448,142 Z"/>
        </path>
        <circle cx="432" cy="138" r="24" fill="url(#feather)" stroke="#b7c6d4" stroke-width="2.5"/>
        <circle cx="440" cy="132" r="6.5" fill="#ffffff" stroke="#3a414a" stroke-width="1.5"/>
        <circle cx="441" cy="132" r="3.2" fill="#22262c">
          <animate attributeName="cx" values="441;437;441" dur="3.4s" repeatCount="indefinite"/>
        </circle>
        <path d="M414,124 C420,112 436,110 444,116" fill="none" stroke="#c3d0dc" stroke-width="3" stroke-linecap="round"/>
      </g>

      <path d="M404,158 C392,170 380,182 372,196 L392,206 C400,192 410,180 420,172 Z" fill="#e0453c"/>
      <path d="M392,206 C400,224 396,244 384,258 C376,242 374,222 380,204 Z" fill="#c93a32">
        <animate attributeName="d" dur="0.9s" repeatCount="indefinite" values="M392,206 C400,224 396,244 384,258 C376,242 374,222 380,204 Z;M392,206 C402,226 402,246 392,262 C382,244 378,224 380,204 Z;M392,206 C406,228 410,248 402,266 C390,248 380,228 380,204 Z;M392,206 C400,224 396,244 384,258 C376,242 374,222 380,204 Z"/>
      </path>

      <path d="M312,182 C360,176 428,196 502,228 C460,252 372,248 318,222 Z" fill="#eef4fa" stroke="#b7c6d4" stroke-width="2.5"/>
      <path d="M330,196 C372,192 424,206 470,224" fill="none" stroke="#c9d6e2" stroke-width="2"/>
      <path d="M340,212 C378,208 420,218 456,232" fill="none" stroke="#c9d6e2" stroke-width="2"/>
      <path d="M486,222 C502,224 512,230 512,238 C512,246 502,250 488,248 C470,246 462,238 466,230 Z" fill="#eef4fa" stroke="#b7c6d4" stroke-width="2"/>
    </g>

    <g>
      <path d="M335,248 Q405,300 418,350" fill="none" stroke="#f0a03c" stroke-width="13" stroke-linecap="round">
        <animate attributeName="d" dur="0.9s" repeatCount="indefinite" values="M335,248 Q405,300 418,350;M335,248 Q400,315 390,378;M335,248 Q378,300 362,350;M335,248 Q388,292 390,322;M335,248 Q405,300 418,350"/>
      </path>
      <ellipse cx="418" cy="350" rx="14" ry="6" fill="#e08d28">
        <animate attributeName="cx" values="418;390;362;390;418" dur="0.9s" repeatCount="indefinite"/>
        <animate attributeName="cy" values="350;378;350;322;350" dur="0.9s" repeatCount="indefinite"/>
      </ellipse>
    </g>
  </g>

  <g id="crank" class="spin">
    <line x1="390" y1="350" x2="418" y2="350" stroke="#4a515b" stroke-width="6" stroke-linecap="round"/>
    <line x1="390" y1="350" x2="362" y2="350" stroke="#4a515b" stroke-width="6" stroke-linecap="round"/>
    <rect x="406" y="344" width="26" height="11" rx="3" fill="#22262c"/>
    <rect x="348" y="344" width="26" height="11" rx="3" fill="#22262c"/>
  </g>
  <circle cx="390" cy="350" r="6" fill="#22262c"/>
</svg>