gemini-pelican.md

2025-03-25T19:05:58 conversation: 01jq7b69g3pdv1rdee886dknv3 id: 01jq7b69g5a9bet9nkvb29w9k1

Model: gemini-2.5-pro-exp-03-25

Prompt

Generate an SVG of a pelican riding a bicycle

Response

<?xml version="1.0" encoding="UTF-8"?>
<svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg">
  <style>
    .pelican-body { fill: #f0f0f0; stroke: #333; stroke-width: 1.5; }
    .pelican-wing { fill: #d0d0d0; stroke: #333; stroke-width: 1.5; }
    .pelican-beak { fill: #ffcc66; stroke: #b38f4d; stroke-width: 1.5; }
    .pelican-eye { fill: #333; }
    .pelican-leg { fill: #ffcc66; stroke: #b38f4d; stroke-width: 1; }
    .bike-frame { fill: none; stroke: #5555cc; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; }
    .bike-tire { fill: #333; stroke: #1a1a1a; stroke-width: 1; }
    .bike-wheel-inner { fill: none; stroke: #aaa; stroke-width: 1.5; }
    .bike-details { fill: #888; stroke: #555; stroke-width: 1; }
  </style>

  <!-- Bicycle -->
  <g id="bicycle">
    <!-- Wheels -->
    <circle class="bike-tire" cx="55" cy="155" r="25"/>
    <circle class="bike-wheel-inner" cx="55" cy="155" r="20"/>
    <circle class="bike-wheel-inner" cx="55" cy="155" r="3"/>
    <circle class="bike-tire" cx="145" cy="155" r="25"/>
    <circle class="bike-wheel-inner" cx="145" cy="155" r="20"/>
    <circle class="bike-wheel-inner" cx="145" cy="155" r="3"/>

    <!-- Frame -->
    <path class="bike-frame" d="M 145 155 L 100 110 L 70 155 M 100 110 L 125 95"/>

    <!-- Seat post and Seat -->
    <line x1="100" y1="110" x2="95" y2="95" stroke="#5555cc" stroke-width="3" stroke-linecap="round"/>
    <ellipse class="bike-details" cx="92" cy="92" rx="10" ry="4" transform="rotate(-10 92 92)" fill="#444"/>

    <!-- Handlebars -->
    <path class="bike-frame" d="M 125 95 L 135 85 Q 140 80 145 85"/>
    <path class="bike-frame" d="M 125 95 L 115 85 Q 110 80 105 85"/>
    <circle cx="145" cy="85" r="3" fill="#444"/> <!-- Handle grip -->
    <circle cx="105" cy="85" r="3" fill="#444"/> <!-- Handle grip -->


    <!-- Pedals and Crank -->
    <circle class="bike-details" cx="100" cy="155" r="5"/>
    <line x1="100" y1="155" x2="115" y2="165" stroke="#888" stroke-width="2"/>
    <rect class="bike-details" x="112" y="163" width="8" height="4" rx="1"/>
    <line x1="100" y1="155" x2="85" y2="145" stroke="#888" stroke-width="2"/>
     <!-- Pedal hidden behind pelican leg -->

  </g>

  <!-- Pelican -->
  <g id="pelican" transform="translate(0, -10)">
    <!-- Legs -->
    <path class="pelican-leg" d="M 95 110 Q 100 130 115 162" fill="none"/>
    <path class="pelican-leg" d="M 88 115 Q 80 130 85 145" fill="none"/>
    <path class="pelican-leg" d="M 112 162 L 118 162 L 115 167 Z" /> <!-- Foot on pedal -->


    <!-- Body -->
    <path class="pelican-body" d="M 80 120 Q 60 80, 95 60 Q 130 80, 110 125 Q 100 135, 80 120 Z"/>

    <!-- Neck -->
    <path class="pelican-body" d="M 95 65 Q 105 50, 115 45 Q 125 50, 120 65 L 95 65 Z" />

    <!-- Head -->
    <circle class="pelican-body" cx="118" cy="42" r="10"/>
    <circle class="pelican-eye" cx="122" cy="38" r="2"/>
     <circle cx="122.5" cy="37.5" r="0.5" fill="white"/> <!-- Eye highlight -->


    <!-- Beak -->
    <path class="pelican-beak" d="M 125 45 Q 150 40, 165 55 Q 145 75, 120 60 Q 118 50, 125 45 Z"/>
     <line x1="125" y1="45" x2="155" y2="45" stroke="#b38f4d" stroke-width="1"/> <!-- Beak split line -->


    <!-- Wing (holding handlebar) -->
    <path class="pelican-wing" d="M 105 90 Q 120 80, 135 85 Q 130 100, 115 110 Q 100 105 105 90 Z"/>

     <!-- Other Wing (folded) -->
     <path class="pelican-wing" d="M 80 100 Q 70 110, 80 120 Q 90 115, 80 100 Z"/>

  </g>

</svg>

Explanation:

1. SVG Setup: Defines the SVG canvas size (width, height) and the coordinate system (viewBox).
2. CSS Styles: Uses a <style> block to define classes for different parts (pelican body, beak, bike frame, tires, etc.). This makes it easy to manage colors and line styles.
3. Bicycle Group (<g id="bicycle">):
   • Wheels: Created using <circle> elements for the tires and inner rims.
   • Frame: Drawn using <path> and <line> elements connecting key points (wheel hubs, bottom bracket, head tube, seat tube). stroke-linecap="round" and stroke-linejoin="round" give the frame a slightly softer look.
   • Seat: An <ellipse> on top of a short seat post (<line>).
   • Handlebars: A combination of <path> elements create the curved handlebars. Small circles represent grips.
   • Pedals/Crank: A central <circle> for the bottom bracket, <line> elements for the crank arms, and a small <rect> for the visible pedal.
4. Pelican Group (<g id="pelican">):
   • Positioning: transform="translate(0, -10)" slightly lifts the pelican to sit better visually.
   • Legs: Simple curved <path> elements connecting the body area towards the pedals. One foot is drawn as a small shape near the pedal.
   • Body: A main pear-like shape drawn with a <path> using quadratic Bézier curves (Q).
   • Neck & Head: Another <path> for the neck connecting to a <circle> for the head.
   • Eye: A small black <circle> with a tinier white highlight circle.
   • Beak: The distinctive large pouch is drawn with a <path> using curves. A <line> adds detail for the top edge.
   • Wings: Two <path> elements. One is positioned and shaped to look like it's resting on or near the handlebar. The other is smaller and folded against the body.
5. Layering: The pelican group is placed after the bicycle group in the code, so the pelican renders on top of the bike.

This SVG provides a simple, cartoonish representation of a pelican riding a bicycle. You can save this code as a .svg file and open it in a web browser or SVG editor.

Token usage:

10 input, 2,270 output, {"promptTokensDetails": [{"modality": "TEXT", "tokenCount": 10}]}