Skip to content

Instantly share code, notes, and snippets.

@SerJaimeLannister
Created May 1, 2026 09:12
Show Gist options
  • Select an option

  • Save SerJaimeLannister/f6de26bd0d0817e0563e8c1398eac655 to your computer and use it in GitHub Desktop.

Select an option

Save SerJaimeLannister/f6de26bd0d0817e0563e8c1398eac655 to your computer and use it in GitHub Desktop.

grok 4.3

Model: grok 4.3 on arena.ai using direct-chat option

Prompt

create me a svg of pelican riding a bike

Response

<svg width="800" height="600" viewBox="0 0 800 600" xmlns="http://www.w3.org/2000/svg">
  <!-- Background -->
  <rect width="800" height="600" fill="#f0f4f8"/>
  
  <!-- Ground -->
  <line x1="0" y1="480" x2="800" y2="480" stroke="#a3b5c9" stroke-width="30"/>
  
  <!-- Bike Wheels -->
  <!-- Rear Wheel -->
  <circle cx="220" cy="420" r="75" fill="#2c3e50" stroke="#1a252f" stroke-width="12"/>
  <circle cx="220" cy="420" r="58" fill="#34495e"/>
  <!-- Spokes -->
  <g stroke="#1a252f" stroke-width="4">
    <line x1="220" y1="345" x2="220" y2="495"/>
    <line x1="145" y1="420" x2="295" y2="420"/>
    <line x1="165" y1="355" x2="275" y2="485"/>
    <line x1="165" y1="485" x2="275" y2="355"/>
  </g>
  
  <!-- Front Wheel -->
  <circle cx="530" cy="420" r="75" fill="#2c3e50" stroke="#1a252f" stroke-width="12"/>
  <circle cx="530" cy="420" r="58" fill="#34495e"/>
  <!-- Spokes -->
  <g stroke="#1a252f" stroke-width="4">
    <line x1="530" y1="345" x2="530" y2="495"/>
    <line x1="455" y1="420" x2="605" y2="420"/>
    <line x1="475" y1="355" x2="585" y2="485"/>
    <line x1="475" y1="485" x2="585" y2="355"/>
  </g>
  
  <!-- Bike Frame -->
  <!-- Main frame -->
  <path d="M 220 420 L 340 300 L 480 300 L 530 420" 
        fill="none" stroke="#2c3e50" stroke-width="22" stroke-linejoin="round"/>
  <!-- Seat tube -->
  <line x1="340" y1="300" x2="280" y2="420" stroke="#2c3e50" stroke-width="18"/>
  
  <!-- Seat -->
  <ellipse cx="295" cy="285" rx="45" ry="18" fill="#e74c3c"/>
  <ellipse cx="295" cy="282" rx="35" ry="10" fill="#c0392b"/>
  
  <!-- Handlebars -->
  <line x1="480" y1="300" x2="480" y2="255" stroke="#2c3e50" stroke-width="18"/>
  <line x1="455" y1="255" x2="510" y2="255" stroke="#2c3e50" stroke-width="18" stroke-linecap="round"/>
  
  <!-- Pedals -->
  <ellipse cx="340" cy="400" rx="18" ry="8" fill="#555" transform="rotate(25 340 400)"/>
  <ellipse cx="400" cy="410" rx="18" ry="8" fill="#555" transform="rotate(-25 400 410)"/>
  
  <!-- Pelican Body -->
  <ellipse cx="310" cy="265" rx="85" ry="65" fill="#f8f9fa" stroke="#2c3e50" stroke-width="8" transform="rotate(-18 310 265)"/>
  
  <!-- Pelican Neck -->
  <path d="M 355 225 Q 400 195 430 205" 
        fill="none" stroke="#f8f9fa" stroke-width="42" stroke-linecap="round"/>
  <path d="M 355 225 Q 400 195 430 205" 
        fill="none" stroke="#2c3e50" stroke-width="8" stroke-linecap="round"/>
  
  <!-- Pelican Head -->
  <circle cx="440" cy="200" r="32" fill="#f8f9fa" stroke="#2c3e50" stroke-width="8"/>
  
  <!-- Beak -->
  <!-- Upper beak -->
  <path d="M 440 200 L 530 215 L 440 225" fill="#f39c12" stroke="#d35400" stroke-width="5"/>
  <!-- Beak pouch -->
  <path d="M 440 225 Q 495 250 530 215" fill="#e67e22" stroke="#d35400" stroke-width="5"/>
  
  <!-- Eye -->
  <circle cx="455" cy="192" r="10" fill="#2c3e50"/>
  <circle cx="458" cy="190" r="4" fill="#fff"/>
  
  <!-- Wing (holding handlebar) -->
  <ellipse cx="365" cy="275" rx="55" ry="28" fill="#ecf0f1" stroke="#2c3e50" stroke-width="6" transform="rotate(35 365 275)"/>
  
  <!-- Leg 1 (right leg on pedal) -->
  <line x1="275" y1="305" x2="335" y2="395" stroke="#f8f9fa" stroke-width="22" stroke-linecap="round"/>
  <line x1="275" y1="305" x2="335" y2="395" stroke="#2c3e50" stroke-width="6" stroke-linecap="round"/>
  
  <!-- Webbed foot 1 -->
  <ellipse cx="345" cy="400" rx="28" ry="13" fill="#f8f9fa" stroke="#2c3e50" stroke-width="5" transform="rotate(22 345 400)"/>
  
  <!-- Leg 2 (left leg) -->
  <line x1="310" y1="310" x2="395" y2="405" stroke="#f8f9fa" stroke-width="22" stroke-linecap="round"/>
  <line x1="310" y1="310" x2="395" y2="405" stroke="#2c3e50" stroke-width="6" stroke-linecap="round"/>
  
  <!-- Webbed foot 2 -->
  <ellipse cx="405" cy="412" rx="28" ry="13" fill="#f8f9fa" stroke="#2c3e50" stroke-width="5" transform="rotate(-18 405 412)"/>
  
  <!-- Tail feathers -->
  <path d="M 235 270 Q 210 290 225 310" fill="none" stroke="#2c3e50" stroke-width="8" stroke-linecap="round"/>
  <path d="M 240 265 Q 205 280 215 305" fill="none" stroke="#2c3e50" stroke-width="6" stroke-linecap="round"/>
</svg>

Just copy and paste the code above into an .svg file or an HTML page.

The pelican is shown in a side view, sitting on the bike with its wings on the handlebars and webbed feet on the pedals. The design is simple but recognizable! Let me know if you'd like any changes (different colors, style, angle, etc.).

Time taken: It thought for 23 seconds

@SerJaimeLannister

Copy link
Copy Markdown
Author
Screenshot 2026-05-01 at 2 43 13 PM

@SerJaimeLannister

Copy link
Copy Markdown
Author

Edit: I had generated pelican riding a bike so I prompted it again to generate pelican riding a bicycle.

Prompt: Generate an SVG of a pelican riding a bicycle

Thinking: Thought for 1 minute 1 second

Response:

<svg xmlns="http://www.w3.org/2000/svg" width="520" height="380" viewBox="0 0 520 380">
  <!-- Background -->
  <rect width="520" height="380" fill="#f8f9fa"/>
  
  <!-- Ground -->
  <rect x="0" y="320" width="520" height="60" fill="#e8d5b7"/>
  <line x1="0" y2="320" x2="520" y2="320" stroke="#c9a66b" stroke-width="3"/>
  
  <!-- Bicycle Wheels -->
  <!-- Rear Wheel -->
  <circle cx="140" cy="290" r="48" fill="none" stroke="#2c3e50" stroke-width="14"/>
  <circle cx="140" cy="290" r="32" fill="none" stroke="#2c3e50" stroke-width="5"/>
  <!-- Rear spokes -->
  <line x1="140" y1="290" x2="140" y2="242" stroke="#2c3e50" stroke-width="3"/>
  <line x1="140" y1="290" x2="140" y2="338" stroke="#2c3e50" stroke-width="3"/>
  <line x1="92" y1="290" x2="188" y2="290" stroke="#2c3e50" stroke-width="3"/>
  <line x1="105" y1="255" x2="175" y2="325" stroke="#2c3e50" stroke-width="2"/>
  <line x1="175" y1="255" x2="105" y2="325" stroke="#2c3e50" stroke-width="2"/>
  <circle cx="140" cy="290" r="10" fill="#2c3e50"/>
  
  <!-- Front Wheel -->
  <circle cx="370" cy="290" r="48" fill="none" stroke="#2c3e50" stroke-width="14"/>
  <circle cx="370" cy="290" r="32" fill="none" stroke="#2c3e50" stroke-width="5"/>
  <!-- Front spokes -->
  <line x1="370" y1="290" x2="370" y2="242" stroke="#2c3e50" stroke-width="3"/>
  <line x1="370" y1="290" x2="370" y2="338" stroke="#2c3e50" stroke-width="3"/>
  <line x1="322" y1="290" x2="418" y2="290" stroke="#2c3e50" stroke-width="3"/>
  <line x1="335" y1="255" x2="405" y2="325" stroke="#2c3e50" stroke-width="2"/>
  <line x1="405" y1="255" x2="335" y2="325" stroke="#2c3e50" stroke-width="2"/>
  <circle cx="370" cy="290" r="10" fill="#2c3e50"/>
  
  <!-- Bicycle Frame -->
  <!-- Seat tube -->
  <line x1="140" y1="290" x2="185" y2="225" stroke="#34495e" stroke-width="11" stroke-linecap="round"/>
  <!-- Top tube -->
  <line x1="185" y1="225" x2="295" y2="215" stroke="#34495e" stroke-width="11" stroke-linecap="round"/>
  <!-- Down tube -->
  <line x1="295" y1="215" x2="260" y2="280" stroke="#34495e" stroke-width="11" stroke-linecap="round"/>
  <!-- Chain stays -->
  <line x1="140" y1="290" x2="260" y2="280" stroke="#34495e" stroke-width="9" stroke-linecap="round"/>
  <line x1="370" y1="290" x2="260" y2="280" stroke="#34495e" stroke-width="9" stroke-linecap="round"/>
  
  <!-- Seat -->
  <ellipse cx="185" cy="218" rx="22" ry="9" fill="#2c3e50"/>
  <ellipse cx="185" cy="215" rx="18" ry="5" fill="#1a252f"/>
  
  <!-- Handlebars -->
  <line x1="295" y1="215" x2="295" y2="192" stroke="#34495e" stroke-width="7"/>
  <path d="M 275 192 Q 295 185 315 192" fill="none" stroke="#34495e" stroke-width="9" stroke-linecap="round"/>
  
  <!-- Pelican Body -->
  <ellipse cx="215" cy="185" rx="52" ry="40" fill="#f8f9fa" stroke="#333" stroke-width="3"/>
  
  <!-- Tail feathers -->
  <ellipse cx="170" cy="188" rx="18" ry="25" fill="#f8f9fa" stroke="#333" stroke-width="2" transform="rotate(-25 170 188)"/>
  
  <!-- Left Wing (back) -->
  <ellipse cx="185" cy="180" rx="22" ry="28" fill="#f8f9fa" stroke="#333" stroke-width="2" transform="rotate(25 185 180)"/>
  
  <!-- Right Wing (front - holding handlebar) -->
  <path d="M 235 160 Q 275 148 300 172" fill="#f8f9fa" stroke="#333" stroke-width="3"/>
  <path d="M 235 160 Q 275 148 300 172" fill="none" stroke="#333" stroke-width="2"/>
  
  <!-- Neck -->
  <path d="M 255 160 Q 285 130 315 122" fill="none" stroke="#f8f9fa" stroke-width="26" stroke-linecap="round"/>
  <path d="M 255 160 Q 285 130 315 122" fill="none" stroke="#333" stroke-width="3" stroke-linecap="round"/>
  
  <!-- Head -->
  <circle cx="320" cy="118" r="23" fill="#f8f9fa" stroke="#333" stroke-width="3"/>
  
  <!-- Eye -->
  <circle cx="332" cy="112" r="7" fill="#222"/>
  <circle cx="334" cy="110" r="2.5" fill="#fff"/>
  
  <!-- Beak (Upper) -->
  <path d="M 335 108 Q 375 102 405 118" fill="#f1c40f" stroke="#d4ac0d" stroke-width="2"/>
  
  <!-- Beak (Lower with pouch) -->
  <path d="M 335 125 Q 370 148 400 120" fill="#f1c40f" stroke="#d4ac0d" stroke-width="2"/>
  
  <!-- Legs -->
  <!-- Front leg on pedal -->
  <path d="M 195 210 Q 225 255 255 275" fill="none" stroke="#e67e22" stroke-width="11" stroke-linecap="round"/>
  <!-- Back leg -->
  <path d="M 185 205 Q 210 245 240 270" fill="none" stroke="#e67e22" stroke-width="10" stroke-linecap="round"/>
  
  <!-- Webbed Feet -->
  <!-- Front foot -->
  <ellipse cx="258" cy="278" rx="14" ry="7" fill="#e67e22" stroke="#d35400" stroke-width="2" transform="rotate(25 258 278)"/>
  <!-- Back foot -->
  <ellipse cx="242" cy="273" rx="12" ry="6" fill="#e67e22" stroke="#d35400" stroke-width="2" transform="rotate(15 242 273)"/>
  
  <!-- Pedals -->
  <rect x="248" y="273" width="16" height="6" rx="2" fill="#2c3e50" transform="rotate(25 256 276)"/>
</svg>

@SerJaimeLannister

Copy link
Copy Markdown
Author
image

@SerJaimeLannister

Copy link
Copy Markdown
Author

Also, as per @gchamonlive (from Hackernews)'s request. I am gonna also generate a beaver riding a scooter.

Prompt: create me a svg of a beaver riding a scooter

Response: Here's a cute SVG of a beaver riding a scooter:

<svg width="400" height="320" viewBox="0 0 400 320" xmlns="http://www.w3.org/2000/svg">
  <!-- Background -->
  <rect width="400" height="320" fill="#f0f9ff"/>
  
  <!-- Scooter Deck -->
  <rect x="90" y="195" width="160" height="18" rx="8" fill="#374151"/>
  <!-- Deck highlight -->
  <rect x="95" y="197" width="150" height="6" rx="3" fill="#4b5563"/>
  
  <!-- Rear Wheel -->
  <circle cx="115" cy="235" r="28" fill="#1f2937"/>
  <circle cx="115" cy="235" r="20" fill="#374151"/>
  <circle cx="115" cy="235" r="8" fill="#111827"/>
  <!-- Rear wheel spokes -->
  <line x1="115" y1="207" x2="115" y2="263" stroke="#111827" stroke-width="2"/>
  <line x1="87" y1="235" x2="143" y2="235" stroke="#111827" stroke-width="2"/>
  
  <!-- Front Wheel -->
  <circle cx="260" cy="235" r="28" fill="#1f2937"/>
  <circle cx="260" cy="235" r="20" fill="#374151"/>
  <circle cx="260" cy="235" r="8" fill="#111827"/>
  <!-- Front wheel spokes -->
  <line x1="260" y1="207" x2="260" y2="263" stroke="#111827" stroke-width="2"/>
  <line x1="232" y1="235" x2="288" y2="235" stroke="#111827" stroke-width="2"/>
  
  <!-- Scooter Stem -->
  <rect x="245" y="120" width="12" height="80" rx="4" fill="#374151"/>
  
  <!-- Handlebars -->
  <rect x="210" y="115" width="82" height="12" rx="6" fill="#374151"/>
  <!-- Handle grips -->
  <rect x="205" y="113" width="18" height="16" rx="4" fill="#1f2937"/>
  <rect x="279" y="113" width="18" height="16" rx="4" fill="#1f2937"/>
  
  <!-- Beaver Body -->
  <ellipse cx="175" cy="175" rx="38" ry="32" fill="#92400e"/>
  <!-- Body highlight -->
  <ellipse cx="165" cy="168" rx="18" ry="14" fill="#b45309"/>
  
  <!-- Beaver Head -->
  <circle cx="195" cy="135" r="32" fill="#92400e"/>
  <!-- Head highlight -->
  <ellipse cx="182" cy="125" rx="12" ry="10" fill="#b45309"/>
  
  <!-- Ears -->
  <ellipse cx="172" cy="110" rx="10" ry="14" fill="#92400e"/>
  <ellipse cx="218" cy="110" rx="10" ry="14" fill="#92400e"/>
  <!-- Inner ears -->
  <ellipse cx="174" cy="112" rx="5" ry="8" fill="#b45309"/>
  <ellipse cx="216" cy="112" rx="5" ry="8" fill="#b45309"/>
  
  <!-- Beaver Tail -->
  <ellipse cx="135" cy="185" rx="22" ry="14" fill="#78350f" transform="rotate(-25 135 185)"/>
  <!-- Tail stripes -->
  <ellipse cx="135" cy="185" rx="18" ry="10" fill="none" stroke="#5c2d0a" stroke-width="3" transform="rotate(-25 135 185)"/>
  
  <!-- Snout -->
  <ellipse cx="220" cy="138" rx="14" ry="11" fill="#78350f"/>
  
  <!-- Teeth -->
  <rect x="213" y="145" width="7" height="12" rx="1" fill="#fefce8"/>
  <rect x="222" y="145" width="7" height="12" rx="1" fill="#fefce8"/>
  
  <!-- Eyes -->
  <circle cx="185" cy="128" r="6" fill="white"/>
  <circle cx="205" cy="128" r="6" fill="white"/>
  <!-- Pupils -->
  <circle cx="187" cy="129" r="3" fill="#1f2937"/>
  <circle cx="207" cy="129" r="3" fill="#1f2937"/>
  <!-- Eye shine -->
  <circle cx="186" cy="127" r="1.5" fill="white"/>
  <circle cx="206" cy="127" r="1.5" fill="white"/>
  
  <!-- Nose -->
  <ellipse cx="225" cy="135" rx="4" ry="3" fill="#1f2937"/>
  
  <!-- Whiskers -->
  <line x1="215" y1="140" x2="200" y2="142" stroke="#78350f" stroke-width="1.5"/>
  <line x1="215" y1="143" x2="198" y2="146" stroke="#78350f" stroke-width="1.5"/>
  <line x1="235" y1="140" x2="250" y2="142" stroke="#78350f" stroke-width="1.5"/>
  <line x1="235" y1="143" x2="252" y2="146" stroke="#78350f" stroke-width="1.5"/>
  
  <!-- Left Arm (holding handlebar) -->
  <path d="M 155 160 Q 175 125 210 120" fill="none" stroke="#92400e" stroke-width="12" stroke-linecap="round"/>
  <!-- Right Arm -->
  <path d="M 195 160 Q 215 130 245 120" fill="none" stroke="#92400e" stroke-width="12" stroke-linecap="round"/>
  
  <!-- Left Leg -->
  <ellipse cx="145" cy="200" rx="10" ry="18" fill="#92400e" transform="rotate(-20 145 200)"/>
  <!-- Right Leg -->
  <ellipse cx="175" cy="205" rx="10" ry="18" fill="#92400e"/>
  
  <!-- Little motion lines -->
  <line x1="70" y1="220" x2="85" y2="220" stroke="#60a5fa" stroke-width="2" stroke-linecap="round"/>
  <line x1="60" y1="230" x2="80" y2="230" stroke="#60a5fa" stroke-width="2" stroke-linecap="round"/>
</svg>

You can copy and paste this code into any .svg file or use it directly in HTML. The beaver has a cute style with prominent teeth, a flat tail, and is gripping the handlebars while riding the scooter.

@SerJaimeLannister

Copy link
Copy Markdown
Author
image

@SerJaimeLannister

Copy link
Copy Markdown
Author

Prompt: create me an svg of a turtle riding a scooter

Response:

<svg width="420" height="320" viewBox="0 0 420 320" xmlns="http://www.w3.org/2000/svg">
  <!-- Background (optional light color) -->
  <rect width="420" height="320" fill="#f8f9fa"/>
  
  <!-- Scooter -->
  
  <!-- Rear Wheel -->
  <circle cx="110" cy="240" r="35" fill="#2c3e50"/>
  <circle cx="110" cy="240" r="22" fill="#7f8c8d"/>
  <circle cx="110" cy="240" r="8" fill="#2c3e50"/>
  
  <!-- Front Wheel -->
  <circle cx="300" cy="240" r="35" fill="#2c3e50"/>
  <circle cx="300" cy="240" r="22" fill="#7f8c8d"/>
  <circle cx="300" cy="240" r="8" fill="#2c3e50"/>
  
  <!-- Scooter Deck -->
  <rect x="85" y="195" width="230" height="18" rx="8" fill="#e74c3c"/>
  <!-- Deck highlight -->
  <rect x="85" y="195" width="230" height="6" rx="8" fill="#ff6b6b"/>
  
  <!-- Steering Column -->
  <line x1="285" y1="195" x2="285" y2="145" stroke="#2c3e50" stroke-width="9" stroke-linecap="round"/>
  
  <!-- Handlebars -->
  <line x1="255" y1="145" x2="315" y2="145" stroke="#2c3e50" stroke-width="8" stroke-linecap="round"/>
  <!-- Handlebar grips -->
  <rect x="250" y="140" width="12" height="10" rx="3" fill="#34495e"/>
  <rect x="308" y="140" width="12" height="10" rx="3" fill="#34495e"/>
  
  <!-- Front fender -->
  <path d="M 275 195 Q 300 180 320 195" fill="none" stroke="#c0392b" stroke-width="12" stroke-linecap="round"/>
  
  <!-- Turtle -->
  
  <!-- Shell -->
  <ellipse cx="195" cy="175" rx="58" ry="42" fill="#27ae60"/>
  <!-- Shell segments -->
  <ellipse cx="195" cy="175" rx="45" ry="32" fill="#2ecc71"/>
  <ellipse cx="195" cy="175" rx="30" ry="20" fill="#27ae60"/>
  
  <!-- Shell pattern lines -->
  <path d="M 145 165 Q 195 145 245 165" fill="none" stroke="#1e8449" stroke-width="3" stroke-opacity="0.6"/>
  <path d="M 150 180 Q 195 165 240 180" fill="none" stroke="#1e8449" stroke-width="3" stroke-opacity="0.6"/>
  <path d="M 160 195 Q 195 185 230 195" fill="none" stroke="#1e8449" stroke-width="3" stroke-opacity="0.6"/>
  
  <!-- Head -->
  <ellipse cx="245" cy="168" rx="22" ry="18" fill="#27ae60"/>
  
  <!-- Eye -->
  <circle cx="258" cy="162" r="6" fill="#2c3e50"/>
  <circle cx="260" cy="161" r="2.5" fill="white"/>
  
  <!-- Beak/Mouth -->
  <path d="M 262 170 Q 268 173 262 176" fill="none" stroke="#1e8449" stroke-width="2.5" stroke-linecap="round"/>
  
  <!-- Front Leg (holding handlebar) -->
  <ellipse cx="225" cy="190" rx="14" ry="7" fill="#27ae60" transform="rotate(-25 225 190)"/>
  
  <!-- Back Leg -->
  <ellipse cx="150" cy="195" rx="13" ry="7" fill="#27ae60"/>
  
  <!-- Tail -->
  <path d="M 138 178 Q 125 182 130 195" fill="none" stroke="#27ae60" stroke-width="10" stroke-linecap="round"/>
  
  <!-- Small arm detail on handlebar -->
  <ellipse cx="235" cy="178" rx="8" ry="4" fill="#27ae60" transform="rotate(-30 235 178)"/>
  
</svg>

@SerJaimeLannister

Copy link
Copy Markdown
Author
image

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