Skip to content

Instantly share code, notes, and snippets.

@pleabargain
Created November 24, 2025 07:57
Show Gist options
  • Select an option

  • Save pleabargain/e5452ecb51d3b7709c338f9e5d232582 to your computer and use it in GitHub Desktop.

Select an option

Save pleabargain/e5452ecb51d3b7709c338f9e5d232582 to your computer and use it in GitHub Desktop.
sail boat generated by Gemini 3 pro
Display the source blob
Display the rendered blob
Raw
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600">
<defs>
<!-- Sky Gradient -->
<linearGradient id="skyGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#4facfe;stop-opacity:1" />
<stop offset="100%" style="stop-color:#00f2fe;stop-opacity:1" />
</linearGradient>
<!-- Water Gradient -->
<linearGradient id="waterGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#3b5998;stop-opacity:1" />
<stop offset="50%" style="stop-color:#1e3c72;stop-opacity:1" />
<stop offset="100%" style="stop-color:#2a5298;stop-opacity:1" />
</linearGradient>
<!-- Wood Gradient for Hull -->
<linearGradient id="woodGradient" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#5D4037;stop-opacity:1" />
<stop offset="50%" style="stop-color:#8D6E63;stop-opacity:1" />
<stop offset="100%" style="stop-color:#4E342E;stop-opacity:1" />
</linearGradient>
<!-- Sail Gradient -->
<linearGradient id="sailGradient" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" style="stop-color:#fdfbf7;stop-opacity:1" />
<stop offset="100%" style="stop-color:#e0e0e0;stop-opacity:1" />
</linearGradient>
<!-- Island Gradient -->
<linearGradient id="islandGradient" x1="0%" y1="0%" x2="0%" y2="100%">
<stop offset="0%" style="stop-color:#556B2F;stop-opacity:1" />
<stop offset="100%" style="stop-color:#2F4F4F;stop-opacity:1" />
</linearGradient>
<!-- Sun Glow -->
<filter id="glow">
<feGaussianBlur stdDeviation="2.5" result="coloredBlur"/>
<feMerge>
<feMergeNode in="coloredBlur"/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
</defs>
<!-- Sky -->
<rect width="800" height="350" fill="url(#skyGradient)" />
<!-- Sun -->
<circle cx="700" cy="80" r="40" fill="#FFD54F" opacity="0.9" filter="url(#glow)" />
<!-- Clouds -->
<path d="M100,100 Q120,80 150,100 T200,100 T250,110 Q230,140 200,130 T150,130 T100,100" fill="#ffffff" opacity="0.6" />
<path d="M500,150 Q520,130 550,150 T600,150 T650,160 Q630,190 600,180 T550,180 T500,150" fill="#ffffff" opacity="0.4" />
<!-- Distant Islands -->
<path d="M0,350 L150,320 Q200,310 250,330 L350,350 Z" fill="#78909C" opacity="0.8" />
<path d="M450,350 L550,330 Q600,315 650,335 L800,350 L800,350 Z" fill="#78909C" opacity="0.6" />
<!-- Closer Low Islands (Greenery) -->
<path d="M-50,350 L100,310 Q180,290 280,320 L400,350 Z" fill="url(#islandGradient)" />
<path d="M600,350 L680,325 Q740,310 850,350 Z" fill="url(#islandGradient)" />
<!-- Water Body -->
<rect y="350" width="800" height="250" fill="url(#waterGradient)" />
<!-- Boat Reflection (Blurred and distorted) -->
<g transform="translate(0, 730) scale(1, -1)" opacity="0.2">
<path d="M320,350 L480,350 L470,380 Q400,410 330,380 Z" fill="#3E2723" />
<path d="M395,350 L395,150" stroke="#3E2723" stroke-width="4" />
<path d="M400,340 L400,160 Q460,250 460,340 Z" fill="#ccc" />
</g>
<!-- Water Ripples Background -->
<g fill="none" stroke="#ffffff" stroke-width="1" opacity="0.2">
<path d="M100,400 Q150,410 200,400" />
<path d="M600,420 Q650,430 700,420" />
<path d="M300,380 Q350,390 400,380" />
</g>
<!-- The Boat -->
<g transform="translate(0, 10)">
<!-- Rear Sail (Mainsail) -->
<path d="M405,330 L405,120 Q520,220 480,330 Z" fill="url(#sailGradient)" stroke="#dcdcdc" stroke-width="1"/>
<!-- Front Sail (Jib) -->
<path d="M395,330 L395,130 L320,320 Q360,340 395,330 Z" fill="#f0f0f0" stroke="#dcdcdc" stroke-width="1"/>
<!-- Mast -->
<rect x="398" y="110" width="4" height="240" fill="#3E2723" />
<!-- Hull -->
<!-- Deck Line -->
<path d="M320,340 L480,340 L470,370 Q400,400 330,370 Z" fill="url(#woodGradient)" stroke="#3E2723" stroke-width="1"/>
<!-- Hull Detail: Planks -->
<path d="M328,360 Q400,385 472,360" fill="none" stroke="#3E2723" stroke-width="1" opacity="0.5"/>
<path d="M335,350 Q400,370 465,350" fill="none" stroke="#3E2723" stroke-width="1" opacity="0.5"/>
<!-- Cabin/Details -->
<rect x="380" y="330" width="40" height="10" fill="#4E342E" rx="2" />
<!-- Rigging -->
<line x1="398" y1="120" x2="320" y2="320" stroke="#1a1a1a" stroke-width="0.5" />
<line x1="402" y1="120" x2="480" y2="330" stroke="#1a1a1a" stroke-width="0.5" />
</g>
<!-- Water Ripples Foreground (covering bottom of hull slightly to seat it in water) -->
<path d="M300,375 Q340,385 380,375 T460,375 T540,375" fill="none" stroke="#aabbd9" stroke-width="2" opacity="0.6" />
<path d="M310,380 Q350,390 390,380 T470,380" fill="none" stroke="#aabbd9" stroke-width="2" opacity="0.4" />
<!-- Foreground Waves -->
<g fill="#ffffff" opacity="0.1">
<path d="M0,550 Q50,530 100,550 T200,550 T300,550 T400,550 L400,600 L0,600 Z" />
<path d="M400,580 Q450,560 500,580 T600,580 T700,580 T800,580 L800,600 L400,600 Z" />
</g>
<!-- Birds -->
<g stroke="#333" stroke-width="1.5" fill="none">
<path d="M600,100 Q610,110 620,100" />
<path d="M625,120 Q635,130 645,120" />
</g>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment