SVG of a Bicycle
This benchmark is designed to show how difficult this task is for all LLMs.
Prompt
Make an SVG of a bicyle.
A system prompt was added to support web rendering
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Simple Bicycle SVG</title>
<style>
svg {
max-width: 100%;
height: auto;
}
.frame, .wheel, .spoke, .extra {
stroke: #333;
stroke-linecap: round;
stroke-linejoin: round;
}
.frame { stroke-width: 6; fill: none; }
.wheel { stroke-width: 8; fill: #fff; }
.spoke { stroke-width: 2; }
.extra { stroke-width: 4; fill: none; }
</style>
</head>
<body>
<svg width="600" height="300" viewBox="0 0 600 300" xmlns="http://www.w3.org/2000/svg">
<!-- Wheels -->
<circle class="wheel" cx="150" cy="200" r="70"/>
<circle class="wheel" cx="450" cy="200" r="70"/>
<!-- Wheel hubs -->
<circle cx="150" cy="200" r="10" fill="#999"/>
<circle cx="450" cy="200" r="10" fill="#999"/>
<!-- Spokes (4 per wheel for simplicity) -->
<g class="spoke">
<line x1="150" y1="130" x2="150" y2="270"/>
<line x1="80" y1="200" x2="220" y2="200"/>
<line x1="95" y1="145" x2="205" y2="255"/>
<line x1="95" y1="255" x2="205" y2="145"/>
<line x1="450" y1="130" x2="450" y2="270"/>
<line x1="380" y1="200" x2="520" y2="200"/>
<line x1="395" y1="145" x2="505" y2="255"/>
<line x1="395" y1="255" x2="505" y2="145"/>
</g>
<!-- Bicycle frame -->
<g class="frame">
<!-- Main triangle -->
<line x1="300" y1="200" x2="150" y2="200"/> <!-- chain stay to rear wheel -->
<line x1="300" y1="200" x2="275" y2="80"/> <!-- seat tube -->
<line x1="275" y1="80" x2="400" y2="80"/> <!-- top tube -->
<line x1="400" y1="80" x2="300" y2="200"/> <!-- down tube -->
<!-- Front triangle / fork -->
<line x1="400" y1="80" x2="425" y2="120"/> <!-- head tube -->
<line x1="425" y1="120" x2="450" y2="200"/> <!-- front fork -->
<line x1="300" y1="200" x2="450" y2="200"/> <!-- chain stay to front wheel -->
</g>
<!-- Seat -->
<rect x="240" y="60" width="80" height="12" rx="4" fill="#333"/>
<!-- Handlebars -->
<g class="extra">
<line x1="400" y1="80" x2="375" y2="45"/> <!-- stem -->
<line x1="343" y1="45" x2="407" y2="30"/> <!-- bar -->
</g>
<!-- Crankset and pedals -->
<g class="extra">
<circle cx="300" cy="200" r="20" fill="#eee" stroke-width="5"/>
<line x1="300" y1="200" x2="330" y2="215"/> <!-- right crank arm -->
<circle cx="338" cy="220" r="6" fill="#333"/>
<line x1="300" y1="200" x2="270" y2="185"/> <!-- left crank arm -->
<circle cx="262" cy="180" r="6" fill="#333"/>
</g>
</svg>
</body>
</html>
```Drag to resize
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bicycle SVG</title>
</head>
<body style="margin: 0; padding: 20px; display: flex; justify-content: center; align-items: center; min-height: 100vh; background-color: #f0f8ff;">
<svg width="400" height="250" viewBox="0 0 400 250" xmlns="http://www.w3.org/2000/svg">
<!-- Rear wheel -->
<circle cx="80" cy="180" r="50" fill="none" stroke="#333" stroke-width="3"/>
<circle cx="80" cy="180" r="45" fill="none" stroke="#666" stroke-width="1"/>
<circle cx="80" cy="180" r="5" fill="#333"/>
<!-- Rear wheel spokes -->
<line x1="80" y1="130" x2="80" y2="230" stroke="#666" stroke-width="1"/>
<line x1="30" y1="180" x2="130" y2="180" stroke="#666" stroke-width="1"/>
<line x1="45" y1="145" x2="115" y2="215" stroke="#666" stroke-width="1"/>
<line x1="115" y1="145" x2="45" y2="215" stroke="#666" stroke-width="1"/>
<!-- Front wheel -->
<circle cx="320" cy="180" r="50" fill="none" stroke="#333" stroke-width="3"/>
<circle cx="320" cy="180" r="45" fill="none" stroke="#666" stroke-width="1"/>
<circle cx="320" cy="180" r="5" fill="#333"/>
<!-- Front wheel spokes -->
<line x1="320" y1="130" x2="320" y2="230" stroke="#666" stroke-width="1"/>
<line x1="270" y1="180" x2="370" y2="180" stroke="#666" stroke-width="1"/>
<line x1="285" y1="145" x2="355" y2="215" stroke="#666" stroke-width="1"/>
<line x1="355" y1="145" x2="285" y2="215" stroke="#666" stroke-width="1"/>
<!-- Main frame -->
<!-- Down tube -->
<line x1="80" y1="180" x2="200" y2="100" stroke="#e74c3c" stroke-width="4"/>
<!-- Seat tube -->
<line x1="80" y1="180" x2="120" y2="80" stroke="#e74c3c" stroke-width="4"/>
<!-- Top tube -->
<line x1="120" y1="80" x2="200" y2="100" stroke="#e74c3c" stroke-width="4"/>
<!-- Head tube -->
<line x1="200" y1="100" x2="210" y2="70" stroke="#e74c3c" stroke-width="4"/>
<!-- Fork -->
<line x1="210" y1="70" x2="320" y2="180" stroke="#2c3e50" stroke-width="3"/>
<!-- Chain stay -->
<line x1="80" y1="180" x2="200" y2="160" stroke="#e74c3c" stroke-width="3"/>
<!-- Seat stay -->
<line x1="120" y1="80" x2="200" y2="160" stroke="#e74c3c" stroke-width="3"/>
<!-- Seat -->
<ellipse cx="115" cy="75" rx="20" ry="6" fill="#8b4513"/>
<line x1="95" y1="75" x2="120" y2="80" stroke="#333" stroke-width="2"/>
<!-- Handlebars -->
<line x1="205" y1="65" x2="225" y2="65" stroke="#333" stroke-width="3"/>
<line x1="195" y1="70" x2="205" y2="65" stroke="#333" stroke-width="3"/>
<line x1="225" y1="65" x2="235" y2="70" stroke="#333" stroke-width="3"/>
<!-- Pedals and crank -->
<circle cx="200" cy="160" r="8" fill="#333"/>
<line x1="185" y1="155" x2="215" y2="165" stroke="#333" stroke-width="3"/>
<rect x="180" y="152" width="8" height="6" fill="#666"/>
<rect x="212" y="162" width="8" height="6" fill="#666"/>
<!-- Chain -->
<path d="M 200 170 Q 240 175 280 170 Q 300 168 320 175" fill="none" stroke="#333" stroke-width="2" stroke-dasharray="3,2"/>
<!-- Ground line -->
<line x1="0" y1="230" x2="400" y2="230" stroke="#7f8c8d" stroke-width="2"/>
</svg>
</body>
</html>
```Drag to resize
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Bicycle SVG</title>
<style>
body {
display: flex;
height: 100vh;
align-items: center;
justify-content: center;
background: #f6f8fa;
}
</style>
</head>
<body>
<svg width="500" height="280" viewBox="0 0 500 280" xmlns="http://www.w3.org/2000/svg">
<!-- Wheels -->
<circle cx="110" cy="190" r="65" fill="#fff" stroke="#404040" stroke-width="8"/>
<circle cx="390" cy="190" r="65" fill="#fff" stroke="#404040" stroke-width="8"/>
<!-- Wheel Hubs -->
<circle cx="110" cy="190" r="9" fill="#606060"/>
<circle cx="390" cy="190" r="9" fill="#606060"/>
<!-- Frame -->
<polyline points="110,190 200,80 260,110 200,190 110,190 200,80 320,190" fill="none" stroke="#1976D2" stroke-width="7" stroke-linecap="round"/>
<line x1="200" y1="190" x2="320" y2="190" stroke="#1976D2" stroke-width="7"/>
<!-- Seat tube -->
<line x1="200" y1="80" x2="200" y2="50" stroke="#444" stroke-width="7"/>
<!-- Seat -->
<rect x="186" y="35" width="28" height="10" rx="5" fill="#333"/>
<!-- Chainstay -->
<line x1="140" y1="240" x2="200" y2="190" stroke="#1976D2" stroke-width="7"/>
<!-- Fork -->
<polyline points="260,110 350,70 390,190" fill="none" stroke="#1976D2" stroke-width="7"/>
<!-- Handlebar stem -->
<line x1="350" y1="70" x2="350" y2="45" stroke="#444" stroke-width="6"/>
<!-- Handlebar -->
<rect x="325" y="35" width="50" height="8" rx="4" fill="#333"/>
<!-- Pedal crank and pedals -->
<circle cx="200" cy="190" r="18" fill="#e0e0e0" stroke="#555" stroke-width="4"/>
<line x1="200" y1="190" x2="215" y2="210" stroke="#444" stroke-width="6"/>
<rect x="211" y="207" width="12" height="6" rx="3" fill="#555"/>
<line x1="200" y1="190" x2="183" y2="210" stroke="#444" stroke-width="6"/>
<rect x="175" y="207" width="12" height="6" rx="3" fill="#555"/>
</svg>
</body>
</html>
```Drag to resize
Here's a complete HTML code with an SVG representation of a bicycle. You can render this directly in a browser:
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bicycle SVG</title>
<style>
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
background-color: #f0f0f0;
}
svg {
width: 80%;
height: auto;
}
</style>
</head>
<body>
<svg width="800" height="400" viewBox="0 0 800 400" xmlns="http://www.w3.org/2000/svg">
<!-- Rear Wheel -->
<circle cx="200" cy="300" r="100" stroke="black" stroke-width="5" fill="none" />
<circle cx="200" cy="300" r="10" fill="black" />
<!-- Front Wheel -->
<circle cx="600" cy="300" r="100" stroke="black" stroke-width="5" fill="none" />
<circle cx="600" cy="300" r="10" fill="black" />
<!-- Frame -->
<line x1="200" y1="300" x2="350" y2="150" stroke="red" stroke-width="3" />
<line x1="350" y1="150" x2="600" y2="300" stroke="red" stroke-width="3" />
<line x1="350" y1="150" x2="450" y2="300" stroke="red" stroke-width="3" />
<line x1="200" y1="300" x2="450" y2="300" stroke="red" stroke-width="3" />
<!-- Seat -->
<line x1="340" y1="150" x2="360" y2="150" stroke="black" stroke-width="5" />
<line x1="350" y1="150" x2="350" y2="200" stroke="black" stroke-width="3" />
<!-- Handlebars -->
<line x1="600" y1="300" x2="550" y2="150" stroke="red" stroke-width="3" />
<line x1="540" y1="150" x2="560" y2="150" stroke="black" stroke-width="5" />
<!-- Pedals -->
<circle cx="350" cy="300" r="20" stroke="black" stroke-width="3" fill="none" />
<line x1="350" y1="280" x2="350" y2="320" stroke="black" stroke-width="3" />
</svg>
</body>
</html>
```Drag to resize
Here's an SVG rendering a detailed bicycle design:
```html
<!DOCTYPE html>
<html>
<head>
<title>SVG Bicycle</title>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 500 400" width="500" height="400">
<!-- Wheels -->
<circle cx="150" cy="250" r="50" stroke="#333" stroke-width="5" fill="none"/>
<circle cx="350" cy="250" r="50" stroke="#333" stroke-width="5" fill="none"/>
<circle cx="150" cy="250" r="10" fill="#555"/>
<circle cx="350" cy="250" r="10" fill="#555"/>
<!-- Frame -->
<path d="M150 250 Q200 150 275 130 T350 250" stroke="#AA3333" stroke-width="8" fill="none"/>
<path d="M150 250 L162 180" stroke="#AA3333" stroke-width="8"/>
<path d="M340 135 L350 250" stroke="#AA3333" stroke-width="8"/>
<!-- Handlebars -->
<line x1="160" y1="180" x2="100" y2="160" stroke="#333" stroke-width="5"/>
<line x1="100" y1="140" x2="100" y2="180" stroke="#333" stroke-width="5"/>
<!-- Pedals -->
<line x1="150" y1="250" x2="160" y2="200" stroke="#555" stroke-width="4"/>
<line x1="150" y1="250" x2="140" y2="300" stroke="#555" stroke-width="4"/>
<circle cx="150" cy="250" r="12" fill="#777"/>
<!-- Seat -->
<path d="M340 115 Q345 125 325 130 Q315 115 340 115 Z" fill="#444"/>
<!-- Wheel Spokes -->
<line x1="150" y1="250" x2="110" y2="220" stroke="#DDD" stroke-width="2"/>
<line x1="150" y1="250" x2="180" y2="220" stroke="#DDD" stroke-width="2"/>
<line x1="350" y1="250" x2="320" y2="220" stroke="#DDD" stroke-width="2"/>
<line x1="350" y1="250" x2="380" y2="220" stroke="#DDD" stroke-width="2"/>
<!-- Chain Guard -->
<path d="M165 235 Q225 240 300 225" stroke="#999" stroke-width="12" stroke-linecap="round" fill="none"/>
</svg>
</body>
</html>
```
Features included:
1. Defined bicycle frame with curved top tube
2. Detailed front fork and rear stays
3. Realistic wheels with spokes and hub centers
4. Handlebars with handles
5. Pedals and crank assembly
6. Saddle with contour styling
7. Chain guard detail
8. Color-coded components with stroke widths for depth
The SVG uses proportional sizing with a viewBox for responsive scaling. Elements are positioned relative to each other to maintain proper bicycle geometry and alignment. The minimalist color scheme focuses on the structural components while maintaining readability.
You can copy-paste this entire code block into an HTML file and open it directly in any modern browser to see the bicycle rendering.Drag to resize
```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Bicycle SVG</title>
</head>
<body>
<svg width="200" height="100" viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
<!-- Bicycle Frame -->
<rect x="30" y="30" width="140" height="40" fill="silver" stroke="black" stroke-width="2"/>
<!-- Front Wheel -->
<circle cx="70" cy="50" r="20" fill="black" stroke="silver" stroke-width="2"/>
<!-- Back Wheel -->
<circle cx="130" cy="50" r="20" fill="black" stroke="silver" stroke-width="2"/>
<!-- Handlebar -->
<rect x="50" y="20" width="20" height="40" fill="silver" stroke="black" stroke-width="2"/>
<!-- Seat -->
<rect x="110" y="70" width="20" height="30" fill="black" stroke="silver" stroke-width="2"/>
</svg>
</body>
</html>
```Drag to resize
```html <!DOCTYPE html> <html> <head> <title>Bicycle SVG</title> </head> <body> <svg width="200" height="200" viewBox="0 0 200 200" xmlns="http://www.w3.org/2000/svg"> <!-- Wheel 1 --> <circle cx="50" cy="150" r="30" stroke="black" stroke-width="2" fill="lightgray" /> <!-- Wheel 2 --> <circle cx="150" cy="150" r="30" stroke="black" stroke-width="2" fill="lightgray" /> <!-- Frame --> <path d="M 50 150 L 150 150 L 120 80 L 80 80 Z" stroke="black" stroke-width="2" fill="none" /> <!-- Seat --> <rect x="90" y="60" width="20" height="10" fill="black" /> <!-- Handlebars --> <path d="M 80 80 L 60 50" stroke="black" stroke-width="2" /> <!-- Pedals --> <circle cx="100" cy="140" r="5" fill="black" /> <circle cx="140" cy="140" r="5" fill="black"/> </svg> </body> </html> ```
Drag to resize
<svg width="500" height="400" viewBox="0 0 500 400"> <!-- Wheels --> <circle cx="150" cy="200" r="80" fill="none" stroke="black" stroke-width="5"/> <circle cx="350" cy="200" r="80" fill="none" stroke="black" stroke-width="5"/> <!-- Wheel spokes --> <line x1="150" y1="200" x2="230" y2="200" stroke="black" stroke-width="2"/> <line x1="150" y1="200" x2="190" y2="269" stroke="black" stroke-width="2"/> <line x1="150" y1="200" x2="110" y2="269" stroke="black" stroke-width="2"/> <line x1="150" y1="200" x2="110" y2="131" stroke="black" stroke-width="2"/> <line x1="150" y1="200" x2="190" y2="131" stroke="black" stroke-width="2"/> <line x1="150" y1="200" x2="230" y2="200" stroke="black" stroke-width="2"/> <line x1="350" y1="200" x2="430" y2="200" stroke="black" stroke-width="2"/> <line x1="350" y1="200" x2="390" y2="269" stroke="black" stroke-width="2"/> <line x1="350" y1="200" x2="310" y2="269" stroke="black" stroke-width="2"/> <line x1="350" y1="200" x2="310" y2="131" stroke="black" stroke-width="2"/> <line x1="350" y1="200" x2="390" y2="131" stroke="black" stroke-width="2"/> <line x1="350" y1="200" x2="430" y2="200" stroke="black" stroke-width="2"/> <!-- Frame --> <line x1="150" y1="200" x2="250" y2="70" stroke="black" stroke-width="5"/> <line x1="250" y1="70" x2="350" y2="200" stroke="black" stroke-width="5"/> <line x1="250" y1="70" x2="300" y2="150" stroke="black" stroke-width="4"/> <line x1="300" y1="150" x2="350" y2="200" stroke="black" stroke-width="4"/> <line x1="250" y1="70" x2="200" y2="120" stroke="black" stroke-width="3"/> <line x1="150" y1="200" x2="200" y2="120" stroke="black" stroke-width="3"/> <!-- Seat and seat post --> <line x1="300" y1="150" x2="300" y2="70" stroke="black" stroke-width="3"/> <rect x="290" y="70" width="20" height="8" fill="black"/> <!-- Handlebars --> <path d="M250,100 C230,40 120,40 100,100" stroke="black" stroke-width="3" fill="none"/> <line x1="100" y1="100" x2="85" y2="120" stroke="black" stroke-width="3"/> <line x1="100" y1="100" x2="115" y2="120" stroke="black" stroke-width="3"/> <!-- Pedals --> <circle cx="250" cy="250" r="12" fill="none" stroke="black" stroke-width="3"/> <line x1="235" y1="250" x2="265" y2="250" stroke="black" stroke-width="3"/> <rect x="265" y="245" width="15" height="3" fill="black"/> <rect x="220" y="245" width="15" height="3" fill="black"/> </svg>
Drag to resize
```html
<!DOCTYPE html>
<html>
<head>
<title>SVG Bicycle</title>
<style>
body {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
margin: 0;
}
svg {
width: 200px;
height: 200px;
}
</style>
</head>
<body>
<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
<!-- Wheels -->
<circle cx="30" cy="80" r="15" stroke="black" stroke-width="2" fill="none"/>
<circle cx="70" cy="80" r="15" stroke="black" stroke-width="2" fill="none"/>
<!-- Frame -->
<line x1="50" y1="20" x2="40" y2="60" stroke="black" stroke-width="2"/>
<line x1="40" y1="60" x2="10" y2="80" stroke="black" stroke-width="2"/>
<line x1="50" y1="20" x2="60" y2="60" stroke="black" stroke-width="2"/>
<line x1="60" y1="60" x2="90" y2="80" stroke="black" stroke-width="2"/>
<!-- Seat post -->
<line x1="50" y1="20" x2="50" y2="40" stroke="black" stroke-width="2"/>
<!-- Handlebars -->
<line x1="40" y1="15" x2="50" y2="20" stroke="black" stroke-width="2"/>
<line x1="50" y1="20" x2="60" y2="15" stroke="black" stroke-width="2"/>
<!-- Pedals -->
<circle cx="50" cy="70" r="5" stroke="black" stroke-width="2" fill="none"/>
<line x1="50" y1="60" x2="50" y2="70" stroke="black" stroke-width="2"/>
</svg>
</body>
</html>
```Drag to resize
Here's a complete HTML document with an SVG bicycle:
```html
<!DOCTYPE html>
<html>
<head>
<title>SVG Bicycle</title>
</head>
<body>
<svg width="300" height="200" viewBox="0 0 300 200" xmlns="http://www.w3.org/2000/svg">
<!-- Frame -->
<path d="M50,100 Q75,50 100,100 T150,100" stroke="black" stroke-width="3" fill="none"/>
<path d="M100,100 L150,100" stroke="black" stroke-width="3"/>
<path d="M150,100 L200,50" stroke="black" stroke-width="3"/>
<path d="M150,100 L200,150" stroke="black" stroke-width="3"/>
<!-- Wheels -->
<circle cx="100" cy="100" r="30" stroke="black" stroke-width="3" fill="none"/>
<circle cx="100" cy="100" r="25" stroke="black" stroke-width="1" fill="none"/>
<circle cx="200" cy="100" r="30" stroke="black" stroke-width="3" fill="none"/>
<circle cx="200" cy="100" r="25" stroke="black" stroke-width="1" fill="none"/>
<!-- Spokes -->
<line x1="100" y1="70" x2="100" y2="130" stroke="black" stroke-width="1"/>
<line x1="70" y1="100" x2="130" y2="100" stroke="black" stroke-width="1"/>
<line x1="82" y1="82" x2="118" y2="118" stroke="black" stroke-width="1"/>
<line x1="82" y1="118" x2="118" y2="82" stroke="black" stroke-width="1"/>
<line x1="200" y1="70" x2="200" y2="130" stroke="black" stroke-width="1"/>
<line x1="170" y1="100" x2="230" y2="100" stroke="black" stroke-width="1"/>
<line x1="182" y1="82" x2="218" y2="118" stroke="black" stroke-width="1"/>
<line x1="182" y1="118" x2="218" y2="82" stroke="black" stroke-width="1"/>
<!-- Seat -->
<path d="M50,100 Q45,90 40,95" stroke="black" stroke-width="3" fill="none"/>
<!-- Handlebars -->
<path d="M200,50 Q210,45 220,50" stroke="black" stroke-width="3" fill="none"/>
<path d="M200,50 Q190,55 180,50" stroke="black" stroke-width="3" fill="none"/>
<!-- Pedals -->
<circle cx="150" cy="100" r="5" stroke="black" stroke-width="1" fill="black"/>
<line x1="150" y1="100" x2="140" y2="110" stroke="black" stroke-width="2"/>
<line x1="150" y1="100" x2="160" y2="90" stroke="black" stroke-width="2"/>
</svg>
</body>
</html>
```
This SVG creates a simple bicycle with:
- A frame with curved top tube
- Two wheels with spokes
- A seat
- Handlebars
- Pedals
You can adjust the dimensions, colors, or add more details as needed. The SVG is contained within a complete HTML document ready for display in a browser.Drag to resize
```html <svg width="400" height="400" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg"> <!-- Frame --> <rect x="20" y="40" width="60" height="10" rx="2" fill="#666" /> <rect x="30" y="50" width="10" height="30" fill="#666" /> <rect x="70" y="50" width="10" height="30" fill="#666" /> <rect x="20" y="70" width="20" height="10" rx="2" fill="#666" /> <rect x="60" y="70" width="20" height="10" rx="2" fill="#666" /> <!-- Wheels --> <circle cx="30" cy="90" r="15" fill="#333" /> <circle cx="70" cy="90" r="15" fill="#333" /> <!-- Pedals --> <circle cx="25" cy="85" r="3" fill="#999" /> <circle cx="35" cy="85" r="3" fill="#999" /> <line x1="25" y1="85" x2="30" y2="90" stroke="#999" stroke-width="1" /> <line x1="35" y1="85" x2="30" y2="90" stroke="#999" stroke-width="1" /> <!-- Seat --> <rect x="45" y="40" width="10" height="5" fill="#999" /> <!-- Handlebars --> <line x1="50" y1="40" x2="50" y2="30" stroke="#666" stroke-width="5" /> <line x1="50" y1="30" x2="40" y2="35" stroke="#666" stroke-width="3" /> <line x1="50" y1="30" x2="60" y2="35" stroke="#666" stroke-width="3" /> </svg> ```
Drag to resize