Generate an SVG of a pelican riding a bicycle
<|channel|>analysis<|message|>The user asks: "Generate an SVG of a pelican riding a bicycle". We need to output an SVG image of a pelican riding a bicycle. We can't create a complex drawing by hand easily, but we can create a simple stylized illustration using basic shapes. We can create a pelican: body, wings, head, beak, tail. Bicycle: frame, wheels, handlebar, seat, pedals. We need to combine them. We'll produce an SVG code that draws a stylized pelican on a bicycle. We can use circles, ellipses, rectangles, paths.
We can approximate: Pelican body: an oval. Pelican head: circle. Beak: triangle. Wings: arcs. Pelican tail: small triangles. Bicycle: frame: two triangles, seat: rectangle, wheels: circles, chain: line. The pelican sits on the bicycle: we need to position the pelican body on top of the bicycle frame, maybe the pelican legs on pedals.
Simplify: We'll use a simple representation: Pelican as an oval body (ellipse) with a head (circle) attached, a beak (triangle). The bicycle: two wheels (circles), a frame: path connecting the wheels: a shape like a 'V' shape with crossbar.
We can use transforms to position. We will create a group for the pelican on the bicycle.
Let's design coordinate space: width 500, height 300. Wheels: left wheel at (150,200), radius 50. Right wheel at (350,200). Frame: path from left wheel to right wheel: a triangle shape. Maybe a path with points: left wheel center (150,200), top of frame (250,100), right wheel center (350,200). Crossbar between wheels: a line between (200,150) and (300,150). Seat: rectangle at (250,120) width 20, height 10. Handlebar: line from top of frame to (250,80). Pedals: lines from bottom of frame to left and right: lines from (200,150) to (180,170) and (300,150) to (320,170). Chain: line connecting pedals: maybe a line from left pedal to right pedal.
Pelican: body ellipse centered at (250,140) width 70, height 100. Head circle at (260,110) radius 20. Beak: triangle points: (280,110), (300,105), (300,115). Wings: arcs: left wing: arc from (230,140) to (210,170) with control. Maybe easier: use path.
Tail: small triangle at bottom of body: (250,190) to (240,210) to (260,210).
Pelican legs: we can skip. The pelican should be positioned on the seat.
We need to ensure the pelican body overlaps the bicycle frame. We'll set pelican group after drawing bicycle to overlay. We'll use fill colors: pelican body light gray, head white, beak orange, wings dark gray. Bicycle: black. Wheels: black. Seat: dark brown. Handlebar: black. Chain: black.
Simplify: We'll use simple shapes.
Let's write the SVG accordingly. Use viewBox 0 0 500 300.
We'll create a style: .pelican-body {fill:#ddd;stroke:#aaa;stroke-width:2;} .pelican-head {fill:#fff;stroke:#aaa;stroke-width:2;} .pelican-beak {fill:#ff6600;stroke:#aa5500;stroke-width:1;} .pelican-wings {fill:#bbb;stroke:#999;stroke-width:1;} .pelican-tail {fill:#bbb;stroke:#999;stroke-width:1;} .bicycle {stroke:#000;stroke-width:4;fill:none;} .wheel {stroke:#000;stroke-width:4;fill:none;} .seat {fill:#654321;stroke:#000;stroke-width:2;} .handlebar {stroke:#000;stroke-width:4;} .pedals {stroke:#000;stroke-width:4;} .chain {stroke:#000;stroke-width:2;}
We can use <style> inside.
We need to ensure the pelican is above the frame: group order: bicycle first, then pelican.
We need to create the bicycle: wheels (circles). Frame: path. Crossbar: line. Seat: rect. Handlebar: line. Pedals: lines. Chain: polyline.
Let's draft. We'll also add some shading maybe. But keep simple.
Also, we can use transforms to shift. Let's compute coordinates precisely.
Wheels: left at (150,200) r=50. Right at (350,200). Frame: path from left wheel to top of frame (250,100) to right wheel. We'll create a path: M150,200 L250,100 L350,200 L250,200 Z? Wait the frame shape: maybe a triangle shape: left wheel to top to right wheel to left wheel. That's a triangle. But typical bicycle frame has a triangle shape but also crossbar. We'll just create a path for the main triangle: M150,200 L250,100 L350,200 Z. Then we add crossbar: line from (200,150) to (300,150). We'll also add seat: rect at (250,120) width 20, height 10 (centered at seat? We'll adjust). Seat should be above crossbar: maybe at (240,120). But we need seat to be above crossbar. Let's set seat rect at (240,110) width 20, height 10. That puts seat between 240-260 horizontally, 110-120 vertically. We'll adjust.
Handlebar: line from top of frame (250,100) to (250,70) maybe. Then handlebar arms: line from (250,70) to (230,70) and (270,70). But we can just add a horizontal line at y=70 between (230,70) to (270,70). But we need the handlebar cross: line from top of frame to handlebar center: 250,70. Then horizontal handlebar: 230-270 at y=70.
Pedals: lines from crossbar intersection to pedals: crossbar at y=150, x=200-300. So left pedal line from (200,150) to (180,170). Right pedal line from (300,150) to (320,170). We'll add chain: polyline from left pedal to right pedal maybe: (180,170) to (200,150) to (320,170). But chain is usually loop: we can just add a line from (200,150) to (300,150)? But chain is between pedals: maybe a small loop. For simplicity, draw a line between left pedal and right pedal. But better to draw a polyline: (180,170) to (200,150) to (320,170). That forms a triangle shape. But chain is not triangular; we can skip chain.
Simplify: we can skip chain for simplicity.
Now pelican: body ellipse center (250,140), rx=35, ry=50. Head circle at (260,110), r=20. Beak triangle: points: (280,110) (300,105) (300,115). Wings: left wing: path from (220,140) to (210,165) with arc? We'll approximate with ellipse: maybe a semi-ellipse. But easier: use path: M210,140 Q200,165 220,165. For right wing: M280,140 Q290,165 270,165. Tail: triangle: (250,190) to (240,210) to (260,210). Pelican legs: we can skip.
Let's implement.
We need to ensure the pelican body overlaps the bicycle frame: group order: bicycle elements, then pelican.
Let's write the SVG code accordingly. We'll add a <defs> style.
We will output the SVG code. Also include a <rect width="100%" height="100%" fill="white" /> to set background.
Let's produce final output.
<|end|>
Below is a compact, self‑contained SVG that shows a stylised pelican perched on a bicycle.
Copy the code into an .svg file or paste it directly into an HTML page to view it.
`<?xml version="1.0" encoding="UTF-8"?>`
`<svg viewBox="0 0 500 300" xmlns="https://www.w3.org/2000/svg">`
`<style>`
.bg { fill:#fff; }
.wheel { stroke:#000; stroke-width:4; fill:none; }
.frame { stroke:#000; stroke-width:4; fill:none; }
.crossbar { stroke:#000; stroke-width:4; }
.seat { fill:#654321; stroke:#000; stroke-width:2; }
.handlebar { stroke:#000; stroke-width:4; }
.pedal { stroke:#000; stroke-width:4; }
.pelican-body{ fill:#ddd; stroke:#aaa; stroke-width:2; }
.pelican-head{ fill:#fff; stroke:#aaa; stroke-width:2; }
.pelican-beak{ fill:#ff6600; stroke:#aa5500; stroke-width:1; }
.pelican-wings{ fill:#bbb; stroke:#999; stroke-width:1; }
.pelican-tail{ fill:#bbb; stroke:#999; stroke-width:1; }
`</style>`
`<!-- Background -->`
`<rect class="bg" width="100%" height="100%" />`
`<!-- Bicycle -->`
`<circle class="wheel" cx="150" cy="200" r="50" />`
`<circle class="wheel" cx="350" cy="200" r="50" />`
`<!-- Frame (triangular) -->`
`<path class="frame" d="M150,200 L250,100 L350,200 Z" />`
`<!-- Crossbar -->`
`<line class="crossbar" x1="200" y1="150" x2="300" y2="150" />`
`<!-- Seat -->`
`<rect class="seat" x="240" y="110" width="20" height="10" />`
`<!-- Handlebar -->`
`<line class="handlebar" x1="250" y1="100" x2="250" y2="70" />`
`<line class="handlebar" x1="230" y1="70" x2="270" y2="70" />`
`<!-- Pedals -->`
`<line class="pedal" x1="200" y1="150" x2="180" y2="170" />`
`<line class="pedal" x1="300" y1="150" x2="320" y2="170" />`
`<!-- Pelican -->`
`<g transform="translate(0,0)">`
`<!-- Body -->`
`<ellipse class="pelican-body" cx="250" cy="140" rx="35" ry="50" />`
`<!-- Head -->`
`<circle class="pelican-head" cx="260" cy="110" r="20" />`
`<!-- Beak -->`
`<polygon class="pelican-beak" points="280,110 300,105 300,115" />`
`<!-- Wings -->`
`<path class="pelican-wings" d="M210,140 Q200,165 220,165" />`
`<path class="pelican-wings" d="M280,140 Q290,165 270,165" />`
`<!-- Tail -->`
`<polygon class="pelican-tail" points="250,190 240,210 260,210" />`
`</g>`
`</svg>`How it works
- The bicycle is drawn first (wheels, frame, crossbar, seat, handlebar, and pedals).
- The pelican is drawn last so that it appears on top of the bicycle.
- Simple shapes (ellipses, circles, polygons, and paths) are used to keep the code short while still giving a recognizable pelican on a bicycle.
Feel free to tweak colors, sizes, or positions to suit your style!
