Model: openai-codex/gpt-5.5
Generate an SVG of a pelican riding a bicycle
- reasoning_effort: xhigh
<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>26 input, 13,212 output, {"output_tokens_details": {"reasoning_tokens": 9322}}
