Skip to content

Instantly share code, notes, and snippets.

@simonw
Created April 23, 2026 19:50
Show Gist options
  • Select an option

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

Select an option

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

2026-04-23T19:46:27 conversation: 01kpxy9k3vax3be2xzax1r5d17 id: 01kpxy28ya14ca17w21jcpvst6

Model: openai-codex/gpt-5.5

Prompt

Generate an SVG of a pelican riding a bicycle

Options

  • reasoning_effort: xhigh

Response

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 800 600" width="800" height="600" role="img" aria-labelledby="title desc">
  <title id="title">Pelican riding a bicycle</title>
  <desc id="desc">A cheerful cartoon pelican with a large orange beak and pouch riding a blue bicycle.</desc>

  <defs>
    <linearGradient id="skyGrad" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#bfefff"/>
      <stop offset="100%" stop-color="#ecfbff"/>
    </linearGradient>

    <linearGradient id="bodyGrad" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#ffffff"/>
      <stop offset="65%" stop-color="#f1f6f9"/>
      <stop offset="100%" stop-color="#dce7ee"/>
    </linearGradient>

    <linearGradient id="wingGrad" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0%" stop-color="#f9fdff"/>
      <stop offset="100%" stop-color="#cfdce5"/>
    </linearGradient>

    <linearGradient id="beakGrad" x1="0" y1="0" x2="1" y2="0">
      <stop offset="0%" stop-color="#ffd66b"/>
      <stop offset="100%" stop-color="#f6a623"/>
    </linearGradient>

    <linearGradient id="pouchGrad" x1="0" y1="0" x2="0" y2="1">
      <stop offset="0%" stop-color="#ffd99a"/>
      <stop offset="100%" stop-color="#f29a3a"/>
    </linearGradient>
  </defs>

  <style>
    .cloud { fill: #fff; opacity: .82; }
    .ground { fill: #bfe28a; }
    .grass { fill: none; stroke: #79ad48; stroke-width: 3; stroke-linecap: round; opacity: .55; }
    .shadow { fill: #3b3b3b; opacity: .16; }

    .motion { fill: none; stroke: #5ea7d4; stroke-width: 5; stroke-linecap: round; opacity: .45; }

    .wheel-tire { fill: none; stroke: #1f2937; stroke-width: 12; }
    .wheel-rim { fill: none; stroke: #d7e3ef; stroke-width: 4; }
    .spoke { stroke: #8fa1af; stroke-width: 2; stroke-linecap: round; }
    .hub { fill: #ffffff; stroke: #4b5563; stroke-width: 4; }

    .frame { fill: none; stroke: #2166d1; stroke-width: 10; stroke-linecap: round; stroke-linejoin: round; }
    .bike-metal { fill: none; stroke: #475569; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; }
    .handlebar { fill: none; stroke: #293241; stroke-width: 8; stroke-linecap: round; stroke-linejoin: round; }
    .grip { stroke: #111827; stroke-width: 10; stroke-linecap: round; }
    .seat { fill: #263238; stroke: #111827; stroke-width: 3; }
    .chain { fill: none; stroke: #293241; stroke-width: 5; stroke-linecap: round; }
    .chainring { fill: #e5e7eb; stroke: #293241; stroke-width: 5; }
    .crank { stroke: #374151; stroke-width: 5; stroke-linecap: round; }
    .pedal { fill: #374151; }

    .leg { fill: none; stroke: #f28c28; stroke-width: 9; stroke-linecap: round; stroke-linejoin: round; }
    .foot { fill: #f7a13b; stroke: #b75d15; stroke-width: 3; }

    .tail { fill: #f8fbff; stroke: #6b7c8a; stroke-width: 3; }
    .neck-outline { fill: none; stroke: #6b7c8a; stroke-width: 48; opacity: .35; stroke-linecap: round; stroke-linejoin: round; }
    .neck { fill: none; stroke: #f8fbff; stroke-width: 42; stroke-linecap: round; stroke-linejoin: round; }
    .neck-shade { fill: none; stroke: #d6e2ea; stroke-width: 7; stroke-linecap: round; opacity: .85; }

    .body { fill: url(#bodyGrad); stroke: #6b7c8a; stroke-width: 3; }
    .belly { fill: #ffffff; opacity: .55; }
    .wing { fill: url(#wingGrad); stroke: #6b7c8a; stroke-width: 3; }
    .feather-line { fill: none; stroke: #8fa1ad; stroke-width: 3; stroke-linecap: round; opacity: .75; }

    .head { fill: url(#bodyGrad); stroke: #6b7c8a; stroke-width: 3; }
    .beak-upper { fill: url(#beakGrad); stroke: #8a540f; stroke-width: 3; stroke-linejoin: round; }
    .pouch { fill: url(#pouchGrad); stroke: #b46a18; stroke-width: 3; }
    .beak-line { fill: none; stroke: #9b5a13; stroke-width: 3; stroke-linecap: round; opacity: .9; }
    .eye { fill: #111827; }
    .crest { fill: none; stroke: #e7eef4; stroke-width: 5; stroke-linecap: round; }
  </style>

  <!-- Background -->
  <rect width="800" height="600" fill="url(#skyGrad)"/>

  <g class="cloud" transform="translate(90 72)">
    <circle cx="0" cy="28" r="24"/>
    <circle cx="26" cy="12" r="31"/>
    <circle cx="60" cy="28" r="23"/>
    <rect x="-20" y="28" width="100" height="24" rx="12"/>
  </g>

  <g class="cloud" transform="translate(620 92) scale(.85)">
    <circle cx="0" cy="28" r="24"/>
    <circle cx="28" cy="9" r="32"/>
    <circle cx="68" cy="26" r="25"/>
    <rect x="-22" y="27" width="112" height="25" rx="13"/>
  </g>

  <path class="ground" d="M0,488 C140,462 260,500 410,478 C555,456 655,478 800,462 L800,600 L0,600 Z"/>
  <path class="grass" d="M58 523 l12 -18 M86 535 l10 -15 M692 519 l13 -20 M724 537 l10 -16 M156 542 l11 -18 M594 542 l11 -18"/>

  <ellipse class="shadow" cx="265" cy="532" rx="100" ry="14"/>
  <ellipse class="shadow" cx="535" cy="532" rx="100" ry="14"/>

  <g class="motion">
    <path d="M134 391 C100 385 74 388 49 396"/>
    <path d="M153 432 C113 426 84 430 58 439"/>
    <path d="M165 473 C119 468 88 472 61 483"/>
  </g>

  <!-- Bicycle -->
  <g id="bicycle">
    <g id="rear-wheel" transform="translate(265 440)">
      <circle class="wheel-tire" r="86"/>
      <line class="spoke" x1="0" y1="0" x2="0" y2="-68"/>
      <line class="spoke" x1="0" y1="0" x2="34" y2="-59"/>
      <line class="spoke" x1="0" y1="0" x2="59" y2="-34"/>
      <line class="spoke" x1="0" y1="0" x2="68" y2="0"/>
      <line class="spoke" x1="0" y1="0" x2="59" y2="34"/>
      <line class="spoke" x1="0" y1="0" x2="34" y2="59"/>
      <line class="spoke" x1="0" y1="0" x2="0" y2="68"/>
      <line class="spoke" x1="0" y1="0" x2="-34" y2="59"/>
      <line class="spoke" x1="0" y1="0" x2="-59" y2="34"/>
      <line class="spoke" x1="0" y1="0" x2="-68" y2="0"/>
      <line class="spoke" x1="0" y1="0" x2="-59" y2="-34"/>
      <line class="spoke" x1="0" y1="0" x2="-34" y2="-59"/>
      <circle class="wheel-rim" r="70"/>
      <circle class="hub" r="10"/>
    </g>

    <g id="front-wheel" transform="translate(535 440)">
      <circle class="wheel-tire" r="86"/>
      <line class="spoke" x1="0" y1="0" x2="0" y2="-68"/>
      <line class="spoke" x1="0" y1="0" x2="34" y2="-59"/>
      <line class="spoke" x1="0" y1="0" x2="59" y2="-34"/>
      <line class="spoke" x1="0" y1="0" x2="68" y2="0"/>
      <line class="spoke" x1="0" y1="0" x2="59" y2="34"/>
      <line class="spoke" x1="0" y1="0" x2="34" y2="59"/>
      <line class="spoke" x1="0" y1="0" x2="0" y2="68"/>
      <line class="spoke" x1="0" y1="0" x2="-34" y2="59"/>
      <line class="spoke" x1="0" y1="0" x2="-59" y2="34"/>
      <line class="spoke" x1="0" y1="0" x2="-68" y2="0"/>
      <line class="spoke" x1="0" y1="0" x2="-59" y2="-34"/>
      <line class="spoke" x1="0" y1="0" x2="-34" y2="-59"/>
      <circle class="wheel-rim" r="70"/>
      <circle class="hub" r="10"/>
    </g>

    <path class="chain" d="M265 433 L390 427"/>
    <path class="chain" d="M265 447 L390 453"/>
    <circle class="chainring" cx="390" cy="440" r="25"/>

    <path class="frame" d="M265 440 L355 320 L390 440 L265 440 M390 440 L535 440 M355 320 L495 335 L390 440 M495 335 L535 440"/>

    <path class="bike-metal" d="M355 320 L347 302"/>
    <path class="seat" d="M318 304 C340 292 376 294 390 306 C372 317 339 317 318 310 Z"/>

    <path class="bike-metal" d="M495 335 L514 303"/>
    <path class="handlebar" d="M514 303 C530 285 553 286 563 299"/>
    <path class="grip" d="M553 315 L572 320"/>

    <line class="crank" x1="390" y1="440" x2="360" y2="465"/>
    <line class="crank" x1="390" y1="440" x2="420" y2="405"/>
    <rect class="pedal" x="338" y="460" width="44" height="10" rx="4" transform="rotate(-8 360 465)"/>
    <rect class="pedal" x="398" y="400" width="44" height="10" rx="4" transform="rotate(-25 420 405)"/>
    <circle cx="390" cy="440" r="8" fill="#374151"/>
  </g>

  <!-- Pelican legs and feet on pedals -->
  <g id="pelican-legs">
    <path class="leg" d="M324 344 C327 382 342 430 360 465"/>
    <path class="leg" d="M382 346 C402 366 414 385 420 405"/>
    <ellipse class="foot" cx="358" cy="466" rx="24" ry="9" transform="rotate(-8 358 466)"/>
    <ellipse class="foot" cx="421" cy="405" rx="23" ry="8" transform="rotate(-25 421 405)"/>
  </g>

  <!-- Pelican -->
  <g id="pelican">
    <path class="tail" d="M253 279 C220 253 211 231 230 232 C260 237 288 262 309 289 Z"/>
    <path class="tail" d="M250 313 C215 309 191 291 204 276 C232 268 274 282 313 304 Z"/>
    <path class="tail" d="M262 337 C231 343 208 329 222 313 C249 301 286 306 318 321 Z"/>

    <path class="neck-outline" d="M382 254 C386 219 407 183 445 164"/>
    <path class="neck" d="M382 254 C386 219 407 183 445 164"/>
    <path class="neck-shade" d="M398 253 C406 221 422 190 452 174"/>

    <ellipse class="body" cx="340" cy="296" rx="113" ry="72" transform="rotate(-7 340 296)"/>
    <ellipse class="belly" cx="345" cy="318" rx="74" ry="38" transform="rotate(-7 345 318)"/>

    <path class="wing" d="M376 274 C427 260 503 276 548 303 C528 323 469 326 418 306 C388 294 366 282 376 274 Z"/>
    <path class="feather-line" d="M430 280 C470 282 505 290 536 303"/>
    <path class="feather-line" d="M414 294 C453 307 495 310 528 303"/>
    <path class="feather-line" d="M403 310 C442 322 481 321 512 313"/>

    <ellipse class="head" cx="455" cy="157" rx="46" ry="36" transform="rotate(-5 455 157)"/>

    <path class="pouch" d="M486 162 C548 175 616 184 666 162 C657 212 610 241 552 229 C520 223 494 197 486 162 Z"/>
    <path class="beak-upper" d="M484 144 C539 121 612 134 667 162 C608 172 540 174 486 162 Z"/>
    <path class="beak-line" d="M496 162 C548 163 609 164 662 162"/>
    <ellipse cx="524" cy="148" rx="5" ry="2.3" fill="#8a540f" opacity=".8"/>

    <circle class="eye" cx="466" cy="144" r="5.5"/>
    <circle cx="468" cy="142" r="1.7" fill="#ffffff"/>

    <path class="crest" d="M430 127 C421 109 443 118 444 131"/>
    <path class="crest" d="M447 124 C449 104 465 116 459 130"/>
    <path class="crest" d="M438 124 C432 105 455 111 452 130"/>
  </g>
</svg>

Token usage

26 input, 13,212 output, {"output_tokens_details": {"reasoning_tokens": 9322}}

@simonw

simonw commented Apr 23, 2026

Copy link
Copy Markdown
Author
image

@amalmurali47

Copy link
Copy Markdown

@simonw Is that through the API or website?

@amalmurali47

Copy link
Copy Markdown

With the same prompt on Codex desktop app (version 26.422.20832), using Codex 5.5 Extra High using I got this:

image

@ro31337

ro31337 commented Apr 23, 2026

Copy link
Copy Markdown

Codex, gpt-5.5 xhigh:

pelican-bicycle

@simonw

simonw commented Apr 23, 2026

Copy link
Copy Markdown
Author

This is via the unofficial Codex API - details here: https://simonwillison.net/2026/Apr/23/gpt-5-5/

@8bittts

8bittts commented Apr 24, 2026

Copy link
Copy Markdown

lol. these are so great.

@DeprecatedLuke

DeprecatedLuke commented Apr 24, 2026 •

Copy link
Copy Markdown
pelican-bicycle

I was wondering if giving it a full tool/agentic harness would make it produce a more interesting pelican. I guess not. Still a good pelican tho. It has a different background which I do find interesting.

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