SVG
Viewer
U6nJNr1Z
N/A
Send feedback
Terms & Conditions
Privacy Policy
Rotate
Flip Y
Flip X
Set Dimensions
Change dimensions
Optimize
4.72 KB
2.81 KB
-41%
Prettify
Preferences
Clear
<svg viewBox="0 0 400 300" xmlns="http://www.w3.org/2000/svg"> <rect x="0" y="280" width="400" height="20" fill="#8bc34a"></rect> <circle cx="100" cy="250" r="30" fill="white" stroke="#333" stroke-width="3"></circle> <circle cx="100" cy="250" r="15" fill="#333"></circle> <line x1="100" y1="220" x2="100" y2="280" stroke="#333" stroke-width="2"></line> <line x1="70" y1="250" x2="130" y2="250" stroke="#333" stroke-width="2"></line> <line x1="79" y1="229" x2="121" y2="271" stroke="#333" stroke-width="2"></line> <line x1="79" y1="271" x2="121" y2="229" stroke="#333" stroke-width="2"></line> <circle cx="300" cy="250" r="30" fill="white" stroke="#333" stroke-width="3"></circle> <circle cx="300" cy="250" r="15" fill="#333"></circle> <line x1="300" y1="220" x2="300" y2="280" stroke="#333" stroke-width="2"></line> <line x1="270" y1="250" x2="330" y2="250" stroke="#333" stroke-width="2"></line> <line x1="279" y1="229" x2="321" y2="271" stroke="#333" stroke-width="2"></line> <line x1="279" y1="271" x2="321" y2="229" stroke="#333" stroke-width="2"></line> <path d="M 100 250 L 150 180 L 220 180 L 280 220 L 300 250" fill="none" stroke="#e65100" stroke-width="4" stroke-linejoin="round"></path> <path d="M 150 180 L 150 220 L 220 220" fill="none" stroke="#e65100" stroke-width="4" stroke-linejoin="round"></path> <path d="M 280 220 L 280 170 L 320 170" fill="none" stroke="#e65100" stroke-width="4" stroke-linecap="round"></path> <circle cx="320" cy="170" r="8" fill="#ff9800"></circle> <ellipse cx="150" cy="170" rx="15" ry="10" fill="#ff9800"></ellipse> <line x1="150" y1="180" x2="150" y2="220" stroke="#e65100" stroke-width="4"></line> <circle cx="220" cy="220" r="8" fill="#333"></circle> <line x1="220" y1="220" x2="245" y2="235" stroke="#333" stroke-width="5" stroke-linecap="round"></line> <line x1="220" y1="220" x2="195" y2="235" stroke="#333" stroke-width="5" stroke-linecap="round"></line> <circle cx="220" cy="220" r="4" fill="#f57c00"></circle> <path d="M 190 200 L 200 195 L 210 200 L 200 205 Z" fill="#f57c00" stroke="#333" stroke-width="1"></path> <ellipse cx="170" cy="145" rx="40" ry="35" fill="#e0f7fa" stroke="#006064" stroke-width="2"></ellipse> <path d="M 150 145 Q 180 120 200 145 L 190 160 Q 175 150 150 145" fill="#b2ebf2" stroke="#006064" stroke-width="1.5"></path> <path d="M 185 125 Q 210 95 240 105" fill="none" stroke="#e0f7fa" stroke-width="18" stroke-linecap="round"></path> <path d="M 185 125 Q 210 95 240 105" fill="none" stroke="#006064" stroke-width="2" stroke-linecap="round"></path> <circle cx="245" cy="102" r="12" fill="#e0f7fa" stroke="#006064" stroke-width="2"></circle> <path d="M 250 102 L 295 98 L 300 115 L 260 110 Z" fill="#ffcc80" stroke="#006064" stroke-width="1.5"></path> <path d="M 255 110 Q 270 118 260 125 Q 250 122 255 110" fill="#ffecb3" stroke="#006064" stroke-width="1"></path> <circle cx="248" cy="98" r="3" fill="#006064"></circle> <circle cx="249" cy="97" r="1" fill="white"></circle> <path d="M 195 235 L 190 245 L 200 245 Z" fill="#ffcc80" stroke="#006064" stroke-width="1"></path> <path d="M 245 235 L 240 245 L 250 245 Z" fill="#ffcc80" stroke="#006064" stroke-width="1"></path> <circle cx="350" cy="50" r="30" fill="#ffd54f"></circle> <line x1="350" y1="15" x2="350" y2="35" stroke="#ffd54f" stroke-width="3"></line> <line x1="350" y1="65" x2="350" y2="85" stroke="#ffd54f" stroke-width="3"></line> <line x1="315" y1="50" x2="295" y2="50" stroke="#ffd54f" stroke-width="3"></line> <line x1="385" y1="50" x2="405" y2="50" stroke="#ffd54f" stroke-width="3"></line> <line x1="325" y1="25" x2="315" y2="15" stroke="#ffd54f" stroke-width="3"></line> <line x1="375" y1="25" x2="385" y2="15" stroke="#ffd54f" stroke-width="3"></line> <line x1="325" y1="75" x2="315" y2="85" stroke="#ffd54f" stroke-width="3"></line> <line x1="375" y1="75" x2="385" y2="85" stroke="#ffd54f" stroke-width="3"></line> <ellipse cx="50" cy="60" rx="25" ry="15" fill="#e3f2fd"></ellipse> <ellipse cx="80" cy="55" rx="20" ry="12" fill="#e3f2fd"></ellipse> <ellipse cx="20" cy="50" rx="15" ry="10" fill="#e3f2fd"></ellipse> <ellipse cx="180" cy="40" rx="22" ry="14" fill="#e3f2fd"></ellipse> <ellipse cx="210" cy="35" rx="18" ry="10" fill="#e3f2fd"></ellipse> <ellipse cx="155" cy="38" rx="14" ry="9" fill="#e3f2fd"></ellipse> <circle cx="40" cy="275" r="15" fill="#4caf50"></circle> <circle cx="60" cy="280" r="12" fill="#4caf50"></circle> <circle cx="20" cy="280" r="10" fill="#4caf50"></circle> <circle cx="360" cy="275" r="15" fill="#4caf50"></circle> <circle cx="380" cy="280" r="12" fill="#4caf50"></circle> <circle cx="340" cy="280" r="10" fill="#4caf50"></circle> </svg>
Upload
Copy
Download
Share
Preview
React
React Native
PNG
Data URI
100%
Download
SVG
Viewer
Edit
Export
Rotate
Flip Y
Flip X
Set Dimensions
Change dimensions
Optimize
4.72 KB
2.81 KB
-41%
Prettify
Preferences
Clear
<svg viewBox="0 0 400 300" xmlns="http://www.w3.org/2000/svg"> <rect x="0" y="280" width="400" height="20" fill="#8bc34a"></rect> <circle cx="100" cy="250" r="30" fill="white" stroke="#333" stroke-width="3"></circle> <circle cx="100" cy="250" r="15" fill="#333"></circle> <line x1="100" y1="220" x2="100" y2="280" stroke="#333" stroke-width="2"></line> <line x1="70" y1="250" x2="130" y2="250" stroke="#333" stroke-width="2"></line> <line x1="79" y1="229" x2="121" y2="271" stroke="#333" stroke-width="2"></line> <line x1="79" y1="271" x2="121" y2="229" stroke="#333" stroke-width="2"></line> <circle cx="300" cy="250" r="30" fill="white" stroke="#333" stroke-width="3"></circle> <circle cx="300" cy="250" r="15" fill="#333"></circle> <line x1="300" y1="220" x2="300" y2="280" stroke="#333" stroke-width="2"></line> <line x1="270" y1="250" x2="330" y2="250" stroke="#333" stroke-width="2"></line> <line x1="279" y1="229" x2="321" y2="271" stroke="#333" stroke-width="2"></line> <line x1="279" y1="271" x2="321" y2="229" stroke="#333" stroke-width="2"></line> <path d="M 100 250 L 150 180 L 220 180 L 280 220 L 300 250" fill="none" stroke="#e65100" stroke-width="4" stroke-linejoin="round"></path> <path d="M 150 180 L 150 220 L 220 220" fill="none" stroke="#e65100" stroke-width="4" stroke-linejoin="round"></path> <path d="M 280 220 L 280 170 L 320 170" fill="none" stroke="#e65100" stroke-width="4" stroke-linecap="round"></path> <circle cx="320" cy="170" r="8" fill="#ff9800"></circle> <ellipse cx="150" cy="170" rx="15" ry="10" fill="#ff9800"></ellipse> <line x1="150" y1="180" x2="150" y2="220" stroke="#e65100" stroke-width="4"></line> <circle cx="220" cy="220" r="8" fill="#333"></circle> <line x1="220" y1="220" x2="245" y2="235" stroke="#333" stroke-width="5" stroke-linecap="round"></line> <line x1="220" y1="220" x2="195" y2="235" stroke="#333" stroke-width="5" stroke-linecap="round"></line> <circle cx="220" cy="220" r="4" fill="#f57c00"></circle> <path d="M 190 200 L 200 195 L 210 200 L 200 205 Z" fill="#f57c00" stroke="#333" stroke-width="1"></path> <ellipse cx="170" cy="145" rx="40" ry="35" fill="#e0f7fa" stroke="#006064" stroke-width="2"></ellipse> <path d="M 150 145 Q 180 120 200 145 L 190 160 Q 175 150 150 145" fill="#b2ebf2" stroke="#006064" stroke-width="1.5"></path> <path d="M 185 125 Q 210 95 240 105" fill="none" stroke="#e0f7fa" stroke-width="18" stroke-linecap="round"></path> <path d="M 185 125 Q 210 95 240 105" fill="none" stroke="#006064" stroke-width="2" stroke-linecap="round"></path> <circle cx="245" cy="102" r="12" fill="#e0f7fa" stroke="#006064" stroke-width="2"></circle> <path d="M 250 102 L 295 98 L 300 115 L 260 110 Z" fill="#ffcc80" stroke="#006064" stroke-width="1.5"></path> <path d="M 255 110 Q 270 118 260 125 Q 250 122 255 110" fill="#ffecb3" stroke="#006064" stroke-width="1"></path> <circle cx="248" cy="98" r="3" fill="#006064"></circle> <circle cx="249" cy="97" r="1" fill="white"></circle> <path d="M 195 235 L 190 245 L 200 245 Z" fill="#ffcc80" stroke="#006064" stroke-width="1"></path> <path d="M 245 235 L 240 245 L 250 245 Z" fill="#ffcc80" stroke="#006064" stroke-width="1"></path> <circle cx="350" cy="50" r="30" fill="#ffd54f"></circle> <line x1="350" y1="15" x2="350" y2="35" stroke="#ffd54f" stroke-width="3"></line> <line x1="350" y1="65" x2="350" y2="85" stroke="#ffd54f" stroke-width="3"></line> <line x1="315" y1="50" x2="295" y2="50" stroke="#ffd54f" stroke-width="3"></line> <line x1="385" y1="50" x2="405" y2="50" stroke="#ffd54f" stroke-width="3"></line> <line x1="325" y1="25" x2="315" y2="15" stroke="#ffd54f" stroke-width="3"></line> <line x1="375" y1="25" x2="385" y2="15" stroke="#ffd54f" stroke-width="3"></line> <line x1="325" y1="75" x2="315" y2="85" stroke="#ffd54f" stroke-width="3"></line> <line x1="375" y1="75" x2="385" y2="85" stroke="#ffd54f" stroke-width="3"></line> <ellipse cx="50" cy="60" rx="25" ry="15" fill="#e3f2fd"></ellipse> <ellipse cx="80" cy="55" rx="20" ry="12" fill="#e3f2fd"></ellipse> <ellipse cx="20" cy="50" rx="15" ry="10" fill="#e3f2fd"></ellipse> <ellipse cx="180" cy="40" rx="22" ry="14" fill="#e3f2fd"></ellipse> <ellipse cx="210" cy="35" rx="18" ry="10" fill="#e3f2fd"></ellipse> <ellipse cx="155" cy="38" rx="14" ry="9" fill="#e3f2fd"></ellipse> <circle cx="40" cy="275" r="15" fill="#4caf50"></circle> <circle cx="60" cy="280" r="12" fill="#4caf50"></circle> <circle cx="20" cy="280" r="10" fill="#4caf50"></circle> <circle cx="360" cy="275" r="15" fill="#4caf50"></circle> <circle cx="380" cy="280" r="12" fill="#4caf50"></circle> <circle cx="340" cy="280" r="10" fill="#4caf50"></circle> </svg>
Upload
Copy
Download
Share
Preview
React
React Native
PNG
Data URI
100%
Download