Gemini-3.7-Flash 鹈鹕测试

徐福 2026-08-17 14:15 1

提示词:生成一个鹈鹕骑自行车的SVG动图


<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600" width="100%" height="100%">
<defs>
<!-- 背景渐变 -->
<linearGradient id="skyGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#BAE6FD"/>
<stop offset="60%" stop-color="#E0F2FE"/>
<stop offset="100%" stop-color="#F0F9FF"/>
</linearGradient>

<linearGradient id="roadGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#64748B"/>
<stop offset="20%" stop-color="#475569"/>
<stop offset="100%" stop-color="#334155"/>
</linearGradient>

<!-- 鹈鹕嘴巴渐变 -->
<linearGradient id="beakGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#FDBA74"/>
<stop offset="100%" stop-color="#FB923C"/>
</linearGradient>

<linearGradient id="pouchGrad" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" stop-color="#FDBA74"/>
<stop offset="60%" stop-color="#F97316"/>
<stop offset="100%" stop-color="#EA580C"/>
</linearGradient>

<!-- 自行车车架金属质感 -->
<linearGradient id="frameGrad" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" stop-color="#059669"/>
<stop offset="50%" stop-color="#10B981"/>
<stop offset="100%" stop-color="#047857"/>
</linearGradient>

<!-- 阴影定义 -->
<filter id="shadow" x="-10%" y="-10%" width="120%" height="120%">
<feDropShadow dx="0" dy="4" stdDeviation="3" flood-opacity="0.15"/>
</filter>
</defs>

<style>
/* ============= 核心动画定义 ============= */

/* 车轮与曲柄旋转 (0.8秒一圈) */
.spin {
animation: rotateAnim 0.8s linear infinite;
}
.spin-reverse {
animation: rotateAnim 0.8s linear reverse infinite;
}

@keyframes rotateAnim {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}

/* 地面标线倒退 */
.road-move {
animation: roadLine 0.4s linear infinite;
}
@keyframes roadLine {
from { stroke-dashoffset: 0; }
to { stroke-dashoffset: -120; }
}

/* 远景白云飘动 */
.cloud-back {
animation: cloudAnim 12s linear infinite;
}
.cloud-front {
animation: cloudAnim 7s linear infinite;
}
@keyframes cloudAnim {
from { transform: translateX(850px); }
to { transform: translateX(-300px); }
}

/* 鹈鹕身体骑行动作上下律动 */
.bouncing-body {
animation: bounce 0.4s ease-in-out infinite alternate;
transform-origin: 390px 420px;
}
@keyframes bounce {
0% { transform: translateY(0px) rotate(0deg); }
100% { transform: translateY(-7px) rotate(-1.5deg); }
}

/* 围巾随风摆动 */
.scarf-wave {
animation: scarf 0.4s ease-in-out infinite alternate;
transform-origin: 340px 225px;
}
@keyframes scarf {
0% { transform: rotate(0deg) scaleY(1); }
100% { transform: rotate(12deg) scaleY(0.85) skewX(-10deg); }
}

/* 眨眼动画 */
.eye-blink {
animation: blink 3.5s infinite;
transform-origin: 430px 175px;
}
@keyframes blink {
0%, 48%, 52%, 100% { transform: scaleY(1); }
50% { transform: scaleY(0.1); }
}

/* 扬尘微粒效果 */
.dust {
animation: dustFly 0.6s ease-out infinite;
}
.dust-2 { animation-delay: 0.2s; }
.dust-3 { animation-delay: 0.4s; }
@keyframes dustFly {
0% { opacity: 0.8; transform: translate(0, 0) scale(0.6); }
100% { opacity: 0; transform: translate(-70px, -25px) scale(1.6); }
}

/* 设定旋转中心 */
#back-wheel, #back-spokes { transform-origin: 220px 450px; }
#front-wheel, #front-spokes { transform-origin: 580px 450px; }
#crank-set { transform-origin: 390px 450px; }
#front-pedal { transform-origin: 390px 400px; }
#back-pedal { transform-origin: 390px 500px; }
</style>

<!-- 1. 背景层 -->
<rect x="0" y="0" width="800" height="600" fill="url(#skyGrad)" />

<!-- 远景山峦 -->
<path d="M-50 480 Q 120 360, 280 440 T 600 400 Q 720 370, 850 480 Z" fill="#99F6E4" opacity="0.6"/>
<path d="M-20 480 Q 200 390, 420 460 T 850 450 L 850 480 Z" fill="#A7F3D0" opacity="0.8"/>

<!-- 飘动的白云 -->
<g class="cloud-back" opacity="0.7">
<path d="M0 120 Q15 100, 40 105 Q60 85, 90 95 Q115 80, 135 100 Q155 105, 160 125 Z" fill="#FFFFFF"/>
</g>
<g class="cloud-front" opacity="0.9" style="margin-top: 40px;">
<path d="M0 70 Q25 45, 55 55 Q85 30, 120 45 Q150 25, 175 55 Q205 60, 210 85 Z" fill="#FFFFFF"/>
</g>

<!-- 2. 地面与马路 -->
<rect x="0" y="480" width="800" height="120" fill="url(#roadGrad)" />
<!-- 草地路肩 -->
<rect x="0" y="475" width="800" height="12" fill="#34D399" />
<!-- 动态斑马线/车道虚线 -->
<line x1="-50" y1="540" x2="850" y2="540" stroke="#F8FAFC" stroke-width="8" stroke-dasharray="50 70" stroke-linecap="round" class="road-move" />

<!-- 速度风线 -->
<g stroke="#FFFFFF" stroke-width="2.5" opacity="0.4" stroke-linecap="round">
<line x1="80" y1="200" x2="20" y2="200" class="road-move" style="animation-duration: 0.3s;"/>
<line x1="140" y1="280" x2="50" y2="280" class="road-move" style="animation-duration: 0.4s;"/>
<line x1="100" y1="360" x2="30" y2="360" class="road-move" style="animation-duration: 0.25s;"/>
</g>

<!-- 3. 自行车阴影 -->
<ellipse cx="400" cy="510" rx="230" ry="14" fill="#1E293B" opacity="0.35" />

<!-- 4. 自行车后轮及后部组件 -->
<!-- 后轮扬尘 -->
<g fill="#CBD5E1" opacity="0.6">
<circle cx="160" cy="485" r="8" class="dust dust-1" />
<circle cx="150" cy="480" r="12" class="dust dust-2" />
<circle cx="170" cy="490" r="6" class="dust dust-3" />
</g>

<!-- 后车轮 (Spinning) -->
<g id="back-wheel-group">
<!-- 外胎与轮辋 -->
<circle cx="220" cy="450" r="60" fill="none" stroke="#1E293B" stroke-width="12" />
<circle cx="220" cy="450" r="54" fill="none" stroke="#F1F5F9" stroke-width="3" />
<!-- 辐条 -->
<g id="back-spokes" class="spin" stroke="#94A3B8" stroke-width="1.5">
<line x1="220" y1="396" x2="220" y2="504" />
<line x1="166" y1="450" x2="274" y2="450" />
<line x1="182" y1="412" x2="258" y2="488" />
<line x1="182" y1="488" x2="258" y2="412" />
</g>
<!-- 轴心 -->
<circle cx="220" cy="450" r="7" fill="#475569" />
</g>

<!-- 后脚蹬与后腿 (背侧,在车架后) -->
<g>
<!-- 连杆 -->
<line x1="390" y1="450" x2="390" y2="500" stroke="#64748B" stroke-width="6" stroke-linecap="round" id="back-pedal-crank" class="spin" />
<!-- 踏板 -->
<rect x="375" y="495" width="30" height="8" rx="3" fill="#1E293B" class="spin-reverse" id="back-pedal" />
<!-- 鹈鹕左脚蹼(暗部) -->
<path d="M 370 495 Q 360 480, 345 425 Q 360 425, 390 495 Z" fill="#D97706" opacity="0.8"/>
</g>

<!-- 5. 自行车车架 -->
<g stroke="url(#frameGrad)" stroke-width="12" stroke-linecap="round" stroke-linejoin="round" filter="url(#shadow)">
<!-- 后下叉 & 后上叉 -->
<line x1="220" y1="450" x2="390" y2="450" />
<line x1="220" y1="450" x2="330" y2="340" />
<!-- 座管 -->
<line x1="330" y1="340" x2="390" y2="450" />
<!-- 主梁 (下管 & 上管 - 复古弯梁斜跨风格) -->
<line x1="390" y1="450" x2="540" y2="330" />
<path d="M 330 340 Q 420 370, 540 330" fill="none" />
<!-- 前叉 -->
<line x1="540" y1="330" x2="580" y2="450" />
<!-- 龙头立管与把手 -->
<path d="M 540 330 L 530 270 L 490 285" fill="none" stroke="#CBD5E1" stroke-width="8"/>
</g>

<!-- 车座与车铃复古细节 -->
<path d="M 305 335 C 305 330, 325 320, 355 330 C 365 333, 360 345, 345 345 C 330 345, 310 345, 305 335 Z" fill="#78350F" />
<circle cx="535" cy="265" r="7" fill="#F59E0B" /> <!-- 小车铃 -->
<path d="M 485 285 L 495 285" stroke="#1E293B" stroke-width="12" stroke-linecap="round"/> <!-- 车把手胶套 -->

<!-- 前车轮 (Spinning) -->
<g id="front-wheel-group">
<!-- 外胎与轮辋 -->
<circle cx="580" cy="450" r="60" fill="none" stroke="#1E293B" stroke-width="12" />
<circle cx="580" cy="450" r="54" fill="none" stroke="#F1F5F9" stroke-width="3" />
<!-- 辐条 -->
<g id="front-spokes" class="spin" stroke="#94A3B8" stroke-width="1.5">
<line x1="580" y1="396" x2="580" y2="504" />
<line x1="526" y1="450" x2="634" y2="450" />
<line x1="542" y1="412" x2="618" y2="488" />
<line x1="542" y1="488" x2="618" y2="412" />
</g>
<!-- 轴心 -->
<circle cx="580" cy="450" r="7" fill="#475569" />
</g>

<!-- 6. 核心主角:大嘴鹈鹕 (整只鸟带上下颠簸律动) -->
<g class="bouncing-body">

<!-- 尾羽 -->
<path d="M 270 330 Q 240 335, 230 320 Q 250 345, 260 360 Q 275 350, 290 345 Z" fill="#E2E8F0" />

<!-- 身体 (胖乎乎的鹅蛋身躯) -->
<path d="M 280 340 C 270 280, 340 240, 390 260 C 430 275, 430 360, 380 395 C 330 430, 290 400, 280 340 Z" fill="#FFFFFF" filter="url(#shadow)"/>
<!-- 腹部阴影质感 -->
<path d="M 295 370 C 325 415, 375 405, 380 395 C 360 385, 310 360, 295 370 Z" fill="#CBD5E1" opacity="0.5"/>

<!-- 飘动红围巾 - 结与尾部 -->
<g class="scarf-wave">
<path d="M 345 235 C 310 230, 260 215, 220 225 C 255 245, 295 250, 335 250 Z" fill="#EF4444" />
<path d="M 335 240 C 290 255, 250 265, 210 280 C 245 285, 290 270, 330 255 Z" fill="#DC2626" />
</g>

<!-- 鹈鹕脖子与头部 -->
<path d="M 360 250 C 370 200, 385 160, 420 150 C 455 140, 470 180, 450 220 C 430 250, 390 265, 360 250 Z" fill="#FFFFFF" />

<!-- 围巾领口环 -->
<path d="M 355 230 C 370 225, 405 235, 410 250 C 395 265, 365 260, 355 230 Z" fill="#EF4444" />

<!-- 巨大特色:鹈鹕的大嘴和大喉囊 -->
<!-- 1. 下喉囊 (大网兜) -->
<path d="M 440 185 Q 520 200, 565 175 C 550 245, 470 270, 425 210 Z" fill="url(#pouchGrad)" filter="url(#shadow)"/>
<!-- 2. 上喙 (带小弯钩) -->
<path d="M 430 165 Q 520 160, 580 170 C 585 173, 580 182, 570 180 L 435 185 Z" fill="url(#beakGrad)" />
<!-- 喙上的小红勾 -->
<path d="M 573 172 Q 582 173, 577 181 Z" fill="#EA580C" />

<!-- 眼睛区域 -->
<circle cx="430" cy="165" r="9" fill="#FFFFFF" />
<g class="eye-blink">
<circle cx="433" cy="165" r="5" fill="#0F172A" />
<circle cx="435" cy="163" r="1.8" fill="#FFFFFF" /> <!-- 高光 -->
</g>
<path d="M 422 155 Q 432 150, 442 156" stroke="#475569" stroke-width="2" fill="none" stroke-linecap="round"/> <!-- 眉毛 -->

<!-- 复古帅气小帽 (深蓝贝雷帽) -->
<path d="M 405 152 C 405 130, 455 125, 460 145 C 465 152, 435 155, 405 152 Z" fill="#1E3A8A" />
<circle cx="435" cy="128" r="4" fill="#F59E0B" /> <!-- 帽顶小球 -->

<!-- 翅膀 (握住车把手的前肢) -->
<path d="M 330 280 C 360 270, 420 300, 485 290 C 475 310, 440 340, 390 340 C 345 340, 325 310, 330 280 Z" fill="#F8FAFC" stroke="#E2E8F0" stroke-width="2" filter="url(#shadow)"/>
<!-- 羽毛纹理 -->
<path d="M 420 315 Q 455 315, 480 295" stroke="#CBD5E1" stroke-width="2.5" fill="none" stroke-linecap="round"/>
<path d="M 390 325 Q 430 330, 455 310" stroke="#CBD5E1" stroke-width="2.5" fill="none" stroke-linecap="round"/>

</g> <!-- /bouncing-body -->

<!-- 7. 自行车大齿盘、前曲柄与右脚蹼 (最前端图层) -->
<!-- 牙盘中心轴 -->
<circle cx="390" cy="450" r="18" fill="#475569" />
<circle cx="390" cy="450" r="14" fill="#64748B" />

<!-- 前侧旋转脚踏组合 (Spinning) -->
<g id="crank-set" class="spin">
<!-- 曲柄杆 (向上) -->
<line x1="390" y1="450" x2="390" y2="400" stroke="#CBD5E1" stroke-width="7" stroke-linecap="round" />
<circle cx="390" cy="400" r="5" fill="#334155"/>
</g>

<!-- 前侧脚踏板 (保持水平反转) -->
<g style="animation: rotateAnim 0.8s linear infinite; transform-origin: 390px 450px;">
<!-- 利用在曲柄端点的逆向旋转维持水平 -->
<g style="transform: translate(0px, -50px);">
<rect x="375" y="445" width="32" height="10" rx="3" fill="#0F172A" class="spin-reverse" style="transform-origin: 390px 450px;" />
</g>
</g>

<!-- 鹈鹕右腿与脚蹼 (随骑行动作微调) -->
<g class="bouncing-body">
<!-- 大腿根部到脚掌 -->
<path d="M 365 375 L 390 410" stroke="#F59E0B" stroke-width="9" stroke-linecap="round"/>
<!-- 亮黄色大脚蹼踩在踏板上 -->
<path d="M 375 410 C 370 400, 415 390, 420 405 C 420 415, 395 415, 375 410 Z" fill="#F59E0B" filter="url(#shadow)"/>
</g>

<!-- 链条罩护板 -->
<path d="M 380 440 L 450 443 C 465 443, 465 457, 450 457 L 380 460 Z" fill="#047857" opacity="0.9"/>

</svg>

最新回复 (9)
  • 来自 M78 星云的喜羊羊手握神光棒变身奥特战士驻守青青草原,一边释放闪耀光线击退宇宙怪兽一边提防灰太狼偷偷潜入羊村搞偷袭 08-17 14:16
    1

    我看到的已经在动了,就是为啥身子全透明?显示问题吗?

  • 翠花上酸菜 08-17 14:16
    2

    你这3.7降智了?Gemini的前端一直都很强

  • futureman 08-17 14:19
    3



    不是同一个3.7吗

  • 徐福 楼主 08-17 14:22
    4

    我的脚架甚至在满天飞,我是Pro账号,应该不至于降智

  • futureman 08-17 14:23
    5

    我也是pro,但是看着效果明显不太一样,你反代出来用的吗

  • Diako 08-17 14:26
    6



    这可咋办,好像不是很行的样子,身子是完整的,就是上传到L站,丢掉了一些元素,但是脚没有跟着踏板动这个是存在问题

  • 三点水也 08-17 14:30
    7

    难道我的是假的 Gemini 3.7



    创建一个HTML,内容是SVG绘制一个鹈鹕骑自行车的2D动画

    [!note]
    提示词如上,没有额外Skill

    [Kapture 2026-08-14 at 10.03.26]
  • outo 08-17 14:36
    8



    改了两次,第一次是头在天上飞,其他正常,第二次是左脚没有踏板,改完就完全正常

  • ash04260214 08-17 14:47
    9

    (帖子已被作者删除)

* 帖子来源Linux.do
返回