SVG
Viewer
FfhmhTK1
N/A
Send feedback
Terms & Conditions
Privacy Policy
Rotate
Flip Y
Flip X
-1px x -1px
Change dimensions
Optimize
2.61 KB
1.85 KB
-29%
Prettify
Preferences
Clear
<svg width="500" height="400" viewBox="0 0 500 400" xmlns="http://www.w3.org/2000/svg"> <rect width="100%" height="100%" fill="#e0f7fa"></rect> <ellipse cx="250" cy="360" rx="180" ry="15" fill="#000" opacity="0.1"></ellipse> <g transform="translate(0, -20)"> <circle cx="120" cy="300" r="50" fill="none" stroke="#333" stroke-width="8"></circle> <circle cx="120" cy="300" r="45" fill="none" stroke="#ddd" stroke-width="2" stroke-dasharray="5,5"></circle> <circle cx="380" cy="300" r="50" fill="none" stroke="#333" stroke-width="8"></circle> <circle cx="380" cy="300" r="45" fill="none" stroke="#ddd" stroke-width="2" stroke-dasharray="5,5"></circle> <path d="M120 300 L200 300 L160 200 L120 300" fill="none" stroke="#d32f2f" stroke-width="6" stroke-linejoin="round"></path> <path d="M200 300 L350 180" fill="none" stroke="#d32f2f" stroke-width="6" stroke-linecap="round"></path> <path d="M160 200 L330 200" fill="none" stroke="#d32f2f" stroke-width="6" stroke-linecap="round"></path> <line x1="350" y1="180" x2="380" y2="300" stroke="#333" stroke-width="5"></line> <path d="M340 180 Q350 150 320 160" fill="none" stroke="#333" stroke-width="5" stroke-linecap="round"></path> <path d="M140 200 L180 200" stroke="#333" stroke-width="8" stroke-linecap="round"></path> <circle cx="200" cy="300" r="15" fill="#999"></circle> <line x1="200" y1="300" x2="200" y2="330" stroke="#999" stroke-width="4"></line> <rect x="190" y="330" width="20" height="8" fill="#333" rx="2"></rect> </g> <g transform="translate(0, -20)"> <path d="M180 230 Q190 280 200 330" fill="none" stroke="#ff9800" stroke-width="6" stroke-linecap="round"></path> <path d="M140 200 Q120 250 170 260 Q220 270 240 220 Q250 180 190 140 Q160 160 140 200" fill="#fff" stroke="#ddd" stroke-width="1"></path> <path d="M190 190 Q240 200 300 170 Q260 230 200 220" fill="#f0f0f0" stroke="#ccc" stroke-width="1"></path> <path d="M220 160 Q250 120 260 100 L280 100 L280 140 Q240 180 220 160" fill="#fff"></path> <circle cx="280" cy="100" r="25" fill="#fff"></circle> <path d="M290 90 L380 110 L290 110 Z" fill="#ffcc00"></path> <path d="M290 110 L380 110 Q350 160 280 130 Z" fill="#ffb74d" stroke="#e65100" stroke-width="1"></path> <circle cx="285" cy="95" r="3" fill="#000"></circle> <path d="M260 90 Q250 80 240 90 M260 95 Q245 90 240 100" fill="none" stroke="#fff" stroke-width="3"></path> <circle cx="320" cy="160" r="8" fill="#f0f0f0"></circle> </g> </svg>
Upload
Copy
Download
Share
Preview
React
React Native
PNG
Data URI
100%
Download
SVG
Viewer
Edit
Export
Rotate
Flip Y
Flip X
-1px x -1px
Change dimensions
Optimize
2.61 KB
1.85 KB
-29%
Prettify
Preferences
Clear
<svg width="500" height="400" viewBox="0 0 500 400" xmlns="http://www.w3.org/2000/svg"> <rect width="100%" height="100%" fill="#e0f7fa"></rect> <ellipse cx="250" cy="360" rx="180" ry="15" fill="#000" opacity="0.1"></ellipse> <g transform="translate(0, -20)"> <circle cx="120" cy="300" r="50" fill="none" stroke="#333" stroke-width="8"></circle> <circle cx="120" cy="300" r="45" fill="none" stroke="#ddd" stroke-width="2" stroke-dasharray="5,5"></circle> <circle cx="380" cy="300" r="50" fill="none" stroke="#333" stroke-width="8"></circle> <circle cx="380" cy="300" r="45" fill="none" stroke="#ddd" stroke-width="2" stroke-dasharray="5,5"></circle> <path d="M120 300 L200 300 L160 200 L120 300" fill="none" stroke="#d32f2f" stroke-width="6" stroke-linejoin="round"></path> <path d="M200 300 L350 180" fill="none" stroke="#d32f2f" stroke-width="6" stroke-linecap="round"></path> <path d="M160 200 L330 200" fill="none" stroke="#d32f2f" stroke-width="6" stroke-linecap="round"></path> <line x1="350" y1="180" x2="380" y2="300" stroke="#333" stroke-width="5"></line> <path d="M340 180 Q350 150 320 160" fill="none" stroke="#333" stroke-width="5" stroke-linecap="round"></path> <path d="M140 200 L180 200" stroke="#333" stroke-width="8" stroke-linecap="round"></path> <circle cx="200" cy="300" r="15" fill="#999"></circle> <line x1="200" y1="300" x2="200" y2="330" stroke="#999" stroke-width="4"></line> <rect x="190" y="330" width="20" height="8" fill="#333" rx="2"></rect> </g> <g transform="translate(0, -20)"> <path d="M180 230 Q190 280 200 330" fill="none" stroke="#ff9800" stroke-width="6" stroke-linecap="round"></path> <path d="M140 200 Q120 250 170 260 Q220 270 240 220 Q250 180 190 140 Q160 160 140 200" fill="#fff" stroke="#ddd" stroke-width="1"></path> <path d="M190 190 Q240 200 300 170 Q260 230 200 220" fill="#f0f0f0" stroke="#ccc" stroke-width="1"></path> <path d="M220 160 Q250 120 260 100 L280 100 L280 140 Q240 180 220 160" fill="#fff"></path> <circle cx="280" cy="100" r="25" fill="#fff"></circle> <path d="M290 90 L380 110 L290 110 Z" fill="#ffcc00"></path> <path d="M290 110 L380 110 Q350 160 280 130 Z" fill="#ffb74d" stroke="#e65100" stroke-width="1"></path> <circle cx="285" cy="95" r="3" fill="#000"></circle> <path d="M260 90 Q250 80 240 90 M260 95 Q245 90 240 100" fill="none" stroke="#fff" stroke-width="3"></path> <circle cx="320" cy="160" r="8" fill="#f0f0f0"></circle> </g> </svg>
Upload
Copy
Download
Share
Preview
React
React Native
PNG
Data URI
100%
Download