查看 SVG 源码
<?xml version="1.0" encoding="UTF-8"?><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 650 500" width="100%" height="100%">
<defs>
<linearGradient id="skyGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#E0F2FE"></stop>
<stop offset="75%" stop-color="#F0F9FF"></stop>
<stop offset="100%" stop-color="#E2E8F0"></stop>
</linearGradient>
<linearGradient id="beakGrad" x1="0" y1="0" x2="1" y2="0">
<stop offset="0%" stop-color="#F59E0B"></stop>
<stop offset="100%" stop-color="#D97706"></stop>
</linearGradient>
<linearGradient id="pouchGrad" x1="0" y1="0" x2="0" y2="1">
<stop offset="0%" stop-color="#FDBA74"></stop>
<stop offset="100%" stop-color="#FB923C"></stop>
</linearGradient>
<linearGradient id="bodyShade" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#FFFFFF"></stop>
<stop offset="85%" stop-color="#F1F5F9"></stop>
<stop offset="100%" stop-color="#CBD5E1"></stop>
</linearGradient>
<linearGradient id="frameGrad" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#2DD4BF"></stop>
<stop offset="100%" stop-color="#0F766E"></stop>
</linearGradient>
<linearGradient id="rimGrad" x1="0" y1="0" x2="1" y2="1">
<stop offset="0%" stop-color="#94A3B8"></stop>
<stop offset="100%" stop-color="#475569"></stop>
</linearGradient>
<filter id="shadow" x="-5%" y="-20%" width="110%" height="150%">
<feDropShadow dx="0" dy="4" stdDeviation="5" flood-color="#0F172A" flood-opacity="0.15"></feDropShadow>
</filter>
</defs>
<rect width="650" height="500" rx="20" fill="url(#skyGrad)"></rect>
<g fill="#FFFFFF" opacity="0.65">
<path d="M 70,80 Q 90,60 120,70 Q 150,60 170,80 Q 185,95 165,110 L 75,110 Q 55,95 70,80 Z"></path>
<path d="M 450,60 Q 470,45 495,50 Q 520,40 535,60 Q 550,75 530,90 L 460,90 Q 435,75 450,60 Z"></path>
</g>
<g stroke="#93C5FD" stroke-width="2.5" stroke-linecap="round" opacity="0.6">
<line x1="50" y1="210" x2="110" y2="210"></line>
<line x1="30" y1="235" x2="80" y2="235"></line>
<line x1="70" y1="260" x2="130" y2="260"></line>
<line x1="40" y1="420" x2="100" y2="420"></line>
</g>
<rect x="0" y="440" width="650" height="60" fill="#CBD5E1"></rect>
<line x1="0" y1="440" x2="650" y2="440" stroke="#94A3B8" stroke-width="3"></line>
<line x1="30" y1="470" x2="90" y2="470" stroke="#FFFFFF" stroke-width="4" stroke-dasharray="25 20"></line>
<line x1="170" y1="470" x2="620" y2="470" stroke="#FFFFFF" stroke-width="4" stroke-dasharray="35 25"></line>
<ellipse cx="190" cy="442" rx="65" ry="8" fill="#64748B" opacity="0.3"></ellipse>
<ellipse cx="440" cy="442" rx="65" ry="8" fill="#64748B" opacity="0.3"></ellipse>
<ellipse cx="315" cy="442" rx="35" ry="6" fill="#64748B" opacity="0.25"></ellipse>
<g id="bicycle">
<g id="rear-wheel" transform="translate(190, 380)">
<circle r="60" fill="none" stroke="#1E293B" stroke-width="10"></circle>
<circle r="55" fill="none" stroke="url(#rimGrad)" stroke-width="3"></circle>
<g stroke="#94A3B8" stroke-width="1.2" opacity="0.85">
<line x1="-55" y1="0" x2="55" y2="0"></line>
<line x1="0" y1="-55" x2="0" y2="55"></line>
<line x1="-39" y1="-39" x2="39" y2="39"></line>
<line x1="-39" y1="39" x2="39" y2="-39"></line>
<line x1="-51" y1="-21" x2="51" y2="21"></line>
<line x1="-21" y1="-51" x2="21" y2="51"></line>
<line x1="-51" y1="21" x2="51" y2="-21"></line>
<line x1="-21" y1="51" x2="21" y2="-51"></line>
</g>
<circle r="7" fill="#334155"></circle>
<circle r="3" fill="#E2E8F0"></circle>
</g>
<g id="front-wheel" transform="translate(440, 380)">
<circle r="60" fill="none" stroke="#1E293B" stroke-width="10"></circle>
<circle r="55" fill="none" stroke="url(#rimGrad)" stroke-width="3"></circle>
<g stroke="#94A3B8" stroke-width="1.2" opacity="0.85">
<line x1="-55" y1="0" x2="55" y2="0"></line>
<line x1="0" y1="-55" x2="0" y2="55"></line>
<line x1="-39" y1="-39" x2="39" y2="39"></line>
<line x1="-39" y1="39" x2="39" y2="-39"></line>
<line x1="-51" y1="-21" x2="51" y2="21"></line>
<line x1="-21" y1="-51" x2="21" y2="51"></line>
<line x1="-51" y1="21" x2="51" y2="-21"></line>
<line x1="-21" y1="51" x2="21" y2="-51"></line>
</g>
<circle r="7" fill="#334155"></circle>
<circle r="3" fill="#E2E8F0"></circle>
</g>
<g id="back-pedal">
<line x1="305" y1="380" x2="275" y2="340" stroke="#475569" stroke-width="6" stroke-linecap="round"></line>
<polygon points="260,332 290,336 278,348" fill="#EA580C"></polygon>
<rect x="262" y="338" width="24" height="6" rx="3" fill="#1E293B"></rect>
</g>
<g stroke="url(#frameGrad)" stroke-width="10" stroke-linecap="round" stroke-linejoin="round">
<line x1="190" y1="380" x2="305" y2="380"></line>
<line x1="190" y1="380" x2="265" y2="275"></line>
<line x1="305" y1="380" x2="265" y2="275"></line>
<line x1="305" y1="380" x2="405" y2="280"></line>
<line x1="265" y1="275" x2="395" y2="250"></line>
<line x1="395" y1="245" x2="407" y2="285"></line>
<line x1="407" y1="285" x2="440" y2="380"></line>
</g>
<path d="M 140,360 A 62 62 0 0 1 230,330" fill="none" stroke="#0F766E" stroke-width="6" stroke-linecap="round"></path>
<path d="M 395,340 A 62 62 0 0 1 475,345" fill="none" stroke="#0F766E" stroke-width="6" stroke-linecap="round"></path>
<circle cx="305" cy="380" r="18" fill="none" stroke="#64748B" stroke-width="4"></circle>
<circle cx="305" cy="380" r="14" fill="#334155"></circle>
<line x1="190" y1="375" x2="305" y2="368" stroke="#475569" stroke-width="3"></line>
<line x1="190" y1="385" x2="305" y2="392" stroke="#475569" stroke-width="3"></line>
<line x1="265" y1="275" x2="260" y2="245" stroke="#64748B" stroke-width="7" stroke-linecap="round"></line>
<path d="M 235,245 C 245,238 275,238 285,246 C 275,255 245,256 235,245 Z" fill="#78350F" filter="url(#shadow)"></path>
<ellipse cx="240" cy="246" rx="8" ry="4" fill="#451A03"></ellipse>
<line x1="395" y1="245" x2="390" y2="215" stroke="#94A3B8" stroke-width="7" stroke-linecap="round"></line>
<path d="M 390,215 Q 380,200 355,208" fill="none" stroke="#64748B" stroke-width="6" stroke-linecap="round"></path>
<line x1="358" y1="207" x2="346" y2="211" stroke="#78350F" stroke-width="8" stroke-linecap="round"></line>
<ellipse cx="380" cy="204" rx="6" ry="5" fill="#FBBF24"></ellipse>
<circle cx="380" cy="202" r="2" fill="#FEF08A"></circle>
</g>
<g id="pelican">
<path d="M 235,235 C 205,240 185,225 180,210 C 195,215 210,215 230,225 Z" fill="#E2E8F0"></path>
<path d="M 230,240 C 200,248 185,235 175,222 C 195,228 212,228 228,232 Z" fill="#CBD5E1"></path>
<path d="M 235,240 C 220,210 240,165 290,160 C 335,155 355,190 340,240 C 325,275 255,270 235,240 Z" fill="url(#bodyShade)" filter="url(#shadow)"></path>
<path d="M 315,175 C 315,135 345,115 355,85 C 375,85 390,120 365,160 C 350,185 330,185 315,175 Z" fill="url(#bodyShade)"></path>
<circle cx="365" cy="85" r="24" fill="#FFFFFF"></circle>
<ellipse cx="372" cy="78" rx="6" ry="7" fill="#0F172A"></ellipse>
<circle cx="374" cy="76" r="2" fill="#FFFFFF"></circle>
<path d="M 364,70 Q 375,67 381,72" fill="none" stroke="#334155" stroke-width="2.5" stroke-linecap="round"></path>
<path d="M 345,80 Q 360,54 385,67 Q 395,78 390,83 Z" fill="#EF4444"></path>
<path d="M 382,67 Q 398,58 402,68" fill="none" stroke="#DC2626" stroke-width="4.5" stroke-linecap="round"></path>
<circle cx="368" cy="62" r="3" fill="#FFFFFF"></circle>
<path d="M 385,96 Q 430,165 370,145 Q 355,140 355,102 Z" fill="url(#pouchGrad)"></path>
<path d="M 378,104 Q 405,145 375,138" fill="none" stroke="#F97316" stroke-width="1.5" opacity="0.6"></path>
<path d="M 385,102 Q 418,138 385,132" fill="none" stroke="#F97316" stroke-width="1.5" opacity="0.5"></path>
<g id="fish-friend" transform="translate(385, 115) rotate(18)">
<ellipse cx="0" cy="0" rx="14" ry="7" fill="#38BDF8"></ellipse>
<polygon points="12,0 20,-6 18,0 20,6" fill="#0284C7"></polygon>
<circle cx="-7" cy="-2" r="3" fill="#FFFFFF"></circle>
<circle cx="-8" cy="-2" r="1.5" fill="#0F172A"></circle>
<circle cx="-13" cy="1" r="1.5" fill="#0284C7"></circle>
</g>
<path d="M 370,86 L 470,95 Q 480,98 476,106 Q 470,107 462,102 L 372,97 Z" fill="url(#beakGrad)"></path>
<path d="M 470,95 Q 479,98 476,106" fill="none" stroke="#B45309" stroke-width="2" stroke-linecap="round"></path>
<path d="M 270,185 C 255,200 255,230 280,235 C 310,240 330,225 350,210 L 335,195 C 310,180 285,175 270,185 Z" fill="#E2E8F0"></path>
<path d="M 315,200 C 335,198 355,202 360,209 C 352,216 338,220 320,222 Z" fill="#CBD5E1"></path>
<path d="M 345,206 C 353,205 356,213 350,215" fill="none" stroke="#94A3B8" stroke-width="3" stroke-linecap="round"></path>
<path d="M 349,208 C 357,208 359,216 353,218" fill="none" stroke="#94A3B8" stroke-width="3" stroke-linecap="round"></path>
<path d="M 285,250 Q 325,290 320,335" fill="none" stroke="#EA580C" stroke-width="9" stroke-linecap="round"></path>
<line x1="320" y1="335" x2="335" y2="400" stroke="#EA580C" stroke-width="7" stroke-linecap="round"></line>
<line x1="305" y1="380" x2="335" y2="415" stroke="#94A3B8" stroke-width="7" stroke-linecap="round"></line>
<circle cx="305" cy="380" r="5" fill="#475569"></circle>
<rect x="325" y="415" width="22" height="7" rx="3" fill="#0F172A"></rect>
<g id="webbed-foot" transform="translate(332, 403)">
<polygon points="0,0 20,10 15,16 -2,8" fill="#F97316"></polygon>
<path d="M 0,2 Q 12,5 20,11" fill="none" stroke="#C2410C" stroke-width="2"></path>
<path d="M 0,5 Q 10,11 15,17" fill="none" stroke="#C2410C" stroke-width="2"></path>
<circle cx="20" cy="11" r="1.5" fill="#7C2D12"></circle>
<circle cx="16" cy="17" r="1.5" fill="#7C2D12"></circle>
</g>
</g>
<g fill="#CBD5E1" opacity="0.7">
<circle cx="120" cy="433" r="5"></circle>
<circle cx="108" cy="435" r="3.5"></circle>
<circle cx="98" cy="437" r="2"></circle>
</g>
</svg>