Skip to content

Instantly share code, notes, and snippets.

@simonw
Created June 17, 2025 20:57
Show Gist options
  • Select an option

  • Save simonw/8ea84d555c34845cdcd2b8c9ec00f3a1 to your computer and use it in GitHub Desktop.

Select an option

Save simonw/8ea84d555c34845cdcd2b8c9ec00f3a1 to your computer and use it in GitHub Desktop.

2025-06-17T17:14:55 conversation: 01jxze7sdkzv3n4g36djhhev7a id: 01jxze60a1wdt2ej2mjmfkff0g

Model: gemini/gemini-2.5-flash

Prompt

Generate an SVG of a pelican riding a bicycle

Response

Here's an SVG drawing of a pelican riding a bicycle. It's designed in a cartoonish style with distinct components for easy readability.

<svg width="800" height="600" viewBox="0 0 800 600" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <style>
      /* Styles for bicycle components */
      .bike-frame { fill: none; stroke: #333; stroke-width: 8; stroke-linecap: round; stroke-linejoin: round; }
      .bike-wheel-rim { fill: none; stroke: #555; stroke-width: 10; }
      .bike-tire { fill: #222; }
      .bike-spoke { stroke: #777; stroke-width: 2; }
      .bike-seat { fill: #663300; stroke: #333; stroke-width: 2;}
      .bike-pedal-arm { stroke: #777; stroke-width: 4; stroke-linecap: round;}
      .bike-pedal { fill: #555; }
      .bike-crank-pivot { fill: #777; stroke: #333; stroke-width: 2;}
      .bike-chainring { fill: #555; stroke: #333; stroke-width: 1;}
      .bike-chain { stroke: #555; stroke-width: 3;}
      .bike-sprocket { fill: #555; stroke: #333; stroke-width: 1;}

      /* Styles for pelican components */
      .pelican-body { fill: #F8F8F8; stroke: #333; stroke-width: 2; }
      .pelican-beak { fill: #FFD700; stroke: #333; stroke-width: 2; }
      .pelican-pouch { fill: #FFA07A; stroke: #333; stroke-width: 2; }
      .pelican-eye { fill: #333; }
      .pelican-leg { fill: #FF8C00; stroke: #333; stroke-width: 1; }
      .pelican-foot { fill: #FF8C00; stroke: #333; stroke-width: 1; }
      .pelican-wing { fill: #F0F0F0; stroke: #333; stroke-width: 2; }
    </style>
  </defs>

  <!-- Bicycle Group (shifted to center it in the viewBox) -->
  <g class="bicycle" transform="translate(100, 50)">
    <!-- Rear Wheel -->
    <circle cx="200" cy="400" r="80" class="bike-tire"/>
    <circle cx="200" cy="400" r="70" class="bike-wheel-rim"/>
    <circle cx="200" cy="400" r="10" fill="#777"/> <!-- Hub -->
    <!-- Spokes for rear wheel -->
    <line x1="200" y1="400" x2="200" y2="330" class="bike-spoke"/>
    <line x1="200" y1="400" x2="200" y2="470" class="bike-spoke"/>
    <line x1="200" y1="400" x2="130" y2="400" class="bike-spoke"/>
    <line x1="200" y1="400" x2="270" y2="400" class="bike-spoke"/>
    <line x1="200" y1="400" x2="150" y2="350" class="bike-spoke"/>
    <line x1="200" y1="400" x2="250" y2="350" class="bike-spoke"/>
    <line x1="200" y1="400" x2="150" y2="450" class="bike-spoke"/>
    <line x1="200" y1="400" x2="250" y2="450" class="bike-spoke"/>

    <!-- Front Wheel -->
    <circle cx="500" cy="400" r="80" class="bike-tire"/>
    <circle cx="500" cy="400" r="70" class="bike-wheel-rim"/>
    <circle cx="500" cy="400" r="10" fill="#777"/> <!-- Hub -->
    <!-- Spokes for front wheel -->
    <line x1="500" y1="400" x2="500" y2="330" class="bike-spoke"/>
    <line x1="500" y1="400" x2="500" y2="470" class="bike-spoke"/>
    <line x1="500" y1="400" x2="430" y2="400" class="bike-spoke"/>
    <line x1="500" y1="400" x2="570" y2="400" class="bike-spoke"/>
    <line x1="500" y1="400" x2="450" y2="350" class="bike-spoke"/>
    <line x1="500" y1="400" x2="550" y2="350" class="bike-spoke"/>
    <line x1="500" y1="400" x2="450" y2="450" class="bike-spoke"/>
    <line x1="500" y1="400" x2="550" y2="450" class="bike-spoke"/>

    <!-- Bicycle Frame (main components) -->
    <!-- Key points: BB(bottom bracket), RA(rear axle), FA(front axle), ST(seat tube top), HT(head tube top) -->
    <!-- Coordinates are relative to the group's transform -->
    <!-- BB: (350, 300) -->
    <!-- RA: (200, 400) -->
    <!-- FA: (500, 400) -->
    <!-- ST: (320, 180) -->
    <!-- HT: (420, 250) -->

    <!-- Main Triangle -->
    <line x1="350" y1="300" x2="320" y2="180" class="bike-frame"/> <!-- Seat Tube -->
    <line x1="320" y1="180" x2="420" y2="250" class="bike-frame"/> <!-- Top Tube -->
    <line x1="420" y1="250" x2="350" y2="300" class="bike-frame"/> <!-- Down Tube -->

    <!-- Rear Triangle -->
    <line x1="350" y1="300" x2="200" y2="400" class="bike-frame"/> <!-- Chain Stay -->
    <line x1="320" y1="180" x2="200" y2="400" class="bike-frame"/> <!-- Seat Stay -->

    <!-- Fork -->
    <!-- Head tube to front axle, using two paths for visual depth of fork blades -->
    <path d="M 420 250 L 460 320 L 500 400" class="bike-frame"/>
    <path d="M 420 250 L 440 330 L 500 400" class="bike-frame"/>

    <!-- Handlebars -->
    <path d="M 420 250 L 460 220 C 470 210 470 200 480 200 C 490 200 500 210 500 220 L 500 240" class="bike-frame"/>

    <!-- Seat -->
    <path d="M 300 170 Q 320 150 350 170 L 330 190 Z" class="bike-seat"/>

    <!-- Pedals and Crank -->
    <circle cx="350" cy="300" r="15" class="bike-crank-pivot"/> <!-- Crank arm pivot -->
    <path d="M 365 300 A 15 15 0 1 0 335 300 A 15 15 0 0 0 365 300 Z" class="bike-chainring"/> <!-- Chainring -->

    <!-- Pedal 1 (down) -->
    <line x1="350" y1="300" x2="320" y2="360" class="bike-pedal-arm"/>
    <rect x="310" y="365" width="20" height="8" class="bike-pedal"/>
    <!-- Pedal 2 (up) -->
    <line x1="350" y1="300" x2="380" y2="240" class="bike-pedal-arm"/>
    <rect x="370" y="235" width="20" height="8" class="bike-pedal"/>

    <!-- Chain -->
    <path d="M 350 300 L 210 395" class="bike-chain"/> <!-- Chain line -->
    <circle cx="200" cy="400" r="10" class="bike-sprocket"/> <!-- Rear Sprocket (small circle around rear axle) -->
  </g>

  <!-- Pelican Group (shifted to align with the bicycle) -->
  <g class="pelican" transform="translate(100, 50)">
    <!-- Body (sits on the seat) -->
    <path d="M 320 180 Q 280 230 320 280 L 370 280 Q 400 240 370 180 Z" class="pelican-body"/>
    <!-- Wing (folded) -->
    <path d="M 360 200 Q 330 220 360 240 Q 370 220 360 200 Z" class="pelican-wing"/>

    <!-- Neck -->
    <path d="M 350 180 Q 370 130 410 140 Q 420 160 400 180 Z" class="pelican-body"/>

    <!-- Head -->
    <circle cx="420" cy="130" r="30" class="pelican-body"/>
    <!-- Eye -->
    <circle cx="430" cy="120" r="5" class="pelican-eye"/>
    <circle cx="432" cy="119" r="1.5" fill="white"/>

    <!-- Beak -->
    <path d="M 440 135 Q 480 140 530 150 Q 520 160 450 145 Z" class="pelican-beak"/>
    <!-- Beak Pouch -->
    <path d="M 445 140 Q 470 160 510 170 Q 500 180 450 160 Z" class="pelican-pouch"/>

    <!-- Legs (positioned to be on pedals) -->
    <!-- Left Leg (on pedal that is down) -->
    <path d="M 330 270 L 320 310 L 325 325 L 335 320 L 340 280 Z" class="pelican-leg"/>
    <!-- Left Foot -->
    <path d="M 310 365 Q 300 370 300 385 L 320 385 L 325 365 Z" class="pelican-foot" transform="rotate(-5 310 365)"/>

    <!-- Right Leg (on pedal that is up) -->
    <path d="M 370 270 L 380 230 L 385 220 L 395 225 L 380 270 Z" class="pelican-leg"/>
    <!-- Right Foot -->
    <path d="M 370 235 Q 380 230 390 235 L 390 250 L 375 245 Z" class="pelican-foot" transform="rotate(5 370 235)"/>
  </g>
</svg>

Token usage

11 input, 14,500 output, {"candidatesTokenCount": 3232, "promptTokensDetails": [{"modality": "TEXT", "tokenCount": 11}], "thoughtsTokenCount": 11268}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment