PlatypusOnTricycle - SVG Viewer

BiRht5hX

N/A

4.37 KB2.86 KB-34%

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400" width="100%" height="100%">
  <defs>
    <g id="spokes-small">
      <line x1="0" y1="-22" x2="0" y2="22" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-22" y1="0" x2="22" y2="0" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-15" y1="-15" x2="15" y2="15" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-15" y1="15" x2="15" y2="-15" stroke="#a8dadc" stroke-width="3"></line>
    </g>
    <g id="spokes-large">
      <line x1="0" y1="-38" x2="0" y2="38" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-38" y1="0" x2="38" y2="0" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-27" y1="-27" x2="27" y2="27" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-27" y1="27" x2="27" y2="-27" stroke="#a8dadc" stroke-width="3"></line>
    </g>
  </defs>

<circle cx="200" cy="200" r="190" fill="#f0f8ff"></circle>
  
  <ellipse cx="190" cy="335" rx="140" ry="12" fill="rgba(0,0,0,0.1)"></ellipse>
  
  <path d="M 40 280 L 70 280 M 20 250 L 50 250 M 50 310 L 80 310" stroke="#ccc" stroke-width="4" stroke-linecap="round"></path>

<g transform="translate(130, 275)">
    <circle cx="0" cy="0" r="30" fill="#333"></circle>
    <circle cx="0" cy="0" r="22" fill="#f1faee"></circle>
    <use href="#spokes-small"></use>
    <circle cx="0" cy="0" r="6" fill="#e63946"></circle>
  </g>

<g transform="translate(85, 185) rotate(-10)">
    <ellipse cx="0" cy="0" rx="55" ry="22" fill="#7f4f24"></ellipse>
    <path d="M -30 -15 L -20 15 M -10 -20 L 0 20 M 10 -20 L 20 20 M 30 -15 L 40 15 M -40 -5 L 45 5 M -35 5 L 40 15" stroke="#5c3a21" stroke-width="2" stroke-linecap="round"></path>
  </g>

<path d="M 90 300 L 150 200 L 260 220" fill="none" stroke="#e63946" stroke-width="14" stroke-linejoin="round"></path>
  
  <path d="M 280 300 L 240 140" fill="none" stroke="#e63946" stroke-width="12" stroke-linecap="round"></path>
  
  <rect x="120" y="185" width="50" height="15" rx="7" fill="#1d3557"></rect>
  
  <path d="M 240 140 L 230 125" stroke="#a8dadc" stroke-width="8" stroke-linecap="round"></path>
  <path d="M 240 140 Q 270 120 285 150" fill="none" stroke="#a8dadc" stroke-width="8" stroke-linecap="round"></path>
  <path d="M 278 140 L 292 155" stroke="#1d3557" stroke-width="14" stroke-linecap="round"></path>

<path d="M 160 190 Q 180 240 230 250" fill="none" stroke="#7f4f24" stroke-width="20" stroke-linecap="round"></path>

<ellipse cx="165" cy="150" rx="45" ry="65" fill="#9c6644" transform="rotate(15 165 150)"></ellipse>
  
  <ellipse cx="180" cy="155" rx="25" ry="55" fill="#b07d5b" transform="rotate(15 180 155)"></ellipse>

<path d="M 160 190 Q 200 260 250 270" fill="none" stroke="#9c6644" stroke-width="22" stroke-linecap="round"></path>

<g transform="translate(90, 300)">
    <circle cx="0" cy="0" r="35" fill="#333"></circle>
    <circle cx="0" cy="0" r="26" fill="#f1faee"></circle>
    <use href="#spokes-small" transform="scale(1.18)"></use>
    <circle cx="0" cy="0" r="8" fill="#e63946"></circle>
  </g>

<g transform="translate(280, 300)">
    <circle cx="0" cy="0" r="50" fill="#333"></circle>
    <circle cx="0" cy="0" r="40" fill="#f1faee"></circle>
    <use href="#spokes-large"></use>
    <circle cx="0" cy="0" r="10" fill="#e63946"></circle>
  </g>

<line x1="280" y1="300" x2="255" y2="270" stroke="#a8dadc" stroke-width="8" stroke-linecap="round"></line>
  
  <path d="M 235 260 L 270 255 L 280 275 L 245 280 Z" fill="#e76f51"></path>
  
  <rect x="240" y="265" width="30" height="12" rx="4" fill="#1d3557" transform="rotate(-15 255 270)"></rect>

<circle cx="190" cy="85" r="36" fill="#9c6644"></circle>
  
  <path d="M 215 75 C 250 65, 285 75, 280 100 C 275 115, 230 110, 215 105 Z" fill="#e76f51"></path>
  
  <circle cx="205" cy="75" r="5" fill="#111"></circle>
  <circle cx="207" cy="73" r="1.5" fill="#fff"></circle>

<g transform="translate(0, -5)">
    <path d="M 155 85 Q 185 30 225 85 Z" fill="#457b9d"></path>
    <path d="M 185 50 Q 195 40 205 85 L 175 85 Z" fill="#e9c46a"></path>
    <path d="M 145 85 L 235 85" stroke="#1d3557" stroke-width="6" stroke-linecap="round"></path>
    <path d="M 190 85 Q 185 125 210 110" fill="none" stroke="#1d3557" stroke-width="3"></path>
  </g>

<path d="M 180 120 Q 220 120 280 145" fill="none" stroke="#9c6644" stroke-width="18" stroke-linecap="round"></path>
  
  <path d="M 270 140 L 295 140 L 300 155 L 275 160 Z" fill="#e76f51"></path>

</svg>

Upload

Preview React React Native PNG Data URI

4.37 KB2.86 KB-34%

<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 400" width="100%" height="100%">
  <defs>
    <g id="spokes-small">
      <line x1="0" y1="-22" x2="0" y2="22" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-22" y1="0" x2="22" y2="0" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-15" y1="-15" x2="15" y2="15" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-15" y1="15" x2="15" y2="-15" stroke="#a8dadc" stroke-width="3"></line>
    </g>
    <g id="spokes-large">
      <line x1="0" y1="-38" x2="0" y2="38" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-38" y1="0" x2="38" y2="0" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-27" y1="-27" x2="27" y2="27" stroke="#a8dadc" stroke-width="3"></line>
      <line x1="-27" y1="27" x2="27" y2="-27" stroke="#a8dadc" stroke-width="3"></line>
    </g>
  </defs>

<circle cx="200" cy="200" r="190" fill="#f0f8ff"></circle>
  
  <ellipse cx="190" cy="335" rx="140" ry="12" fill="rgba(0,0,0,0.1)"></ellipse>
  
  <path d="M 40 280 L 70 280 M 20 250 L 50 250 M 50 310 L 80 310" stroke="#ccc" stroke-width="4" stroke-linecap="round"></path>

<g transform="translate(130, 275)">
    <circle cx="0" cy="0" r="30" fill="#333"></circle>
    <circle cx="0" cy="0" r="22" fill="#f1faee"></circle>
    <use href="#spokes-small"></use>
    <circle cx="0" cy="0" r="6" fill="#e63946"></circle>
  </g>

<g transform="translate(85, 185) rotate(-10)">
    <ellipse cx="0" cy="0" rx="55" ry="22" fill="#7f4f24"></ellipse>
    <path d="M -30 -15 L -20 15 M -10 -20 L 0 20 M 10 -20 L 20 20 M 30 -15 L 40 15 M -40 -5 L 45 5 M -35 5 L 40 15" stroke="#5c3a21" stroke-width="2" stroke-linecap="round"></path>
  </g>

<path d="M 90 300 L 150 200 L 260 220" fill="none" stroke="#e63946" stroke-width="14" stroke-linejoin="round"></path>
  
  <path d="M 280 300 L 240 140" fill="none" stroke="#e63946" stroke-width="12" stroke-linecap="round"></path>
  
  <rect x="120" y="185" width="50" height="15" rx="7" fill="#1d3557"></rect>
  
  <path d="M 240 140 L 230 125" stroke="#a8dadc" stroke-width="8" stroke-linecap="round"></path>
  <path d="M 240 140 Q 270 120 285 150" fill="none" stroke="#a8dadc" stroke-width="8" stroke-linecap="round"></path>
  <path d="M 278 140 L 292 155" stroke="#1d3557" stroke-width="14" stroke-linecap="round"></path>

<path d="M 160 190 Q 180 240 230 250" fill="none" stroke="#7f4f24" stroke-width="20" stroke-linecap="round"></path>

<ellipse cx="165" cy="150" rx="45" ry="65" fill="#9c6644" transform="rotate(15 165 150)"></ellipse>
  
  <ellipse cx="180" cy="155" rx="25" ry="55" fill="#b07d5b" transform="rotate(15 180 155)"></ellipse>

<path d="M 160 190 Q 200 260 250 270" fill="none" stroke="#9c6644" stroke-width="22" stroke-linecap="round"></path>

<g transform="translate(90, 300)">
    <circle cx="0" cy="0" r="35" fill="#333"></circle>
    <circle cx="0" cy="0" r="26" fill="#f1faee"></circle>
    <use href="#spokes-small" transform="scale(1.18)"></use>
    <circle cx="0" cy="0" r="8" fill="#e63946"></circle>
  </g>

<g transform="translate(280, 300)">
    <circle cx="0" cy="0" r="50" fill="#333"></circle>
    <circle cx="0" cy="0" r="40" fill="#f1faee"></circle>
    <use href="#spokes-large"></use>
    <circle cx="0" cy="0" r="10" fill="#e63946"></circle>
  </g>

<line x1="280" y1="300" x2="255" y2="270" stroke="#a8dadc" stroke-width="8" stroke-linecap="round"></line>
  
  <path d="M 235 260 L 270 255 L 280 275 L 245 280 Z" fill="#e76f51"></path>
  
  <rect x="240" y="265" width="30" height="12" rx="4" fill="#1d3557" transform="rotate(-15 255 270)"></rect>

<circle cx="190" cy="85" r="36" fill="#9c6644"></circle>
  
  <path d="M 215 75 C 250 65, 285 75, 280 100 C 275 115, 230 110, 215 105 Z" fill="#e76f51"></path>
  
  <circle cx="205" cy="75" r="5" fill="#111"></circle>
  <circle cx="207" cy="73" r="1.5" fill="#fff"></circle>

<g transform="translate(0, -5)">
    <path d="M 155 85 Q 185 30 225 85 Z" fill="#457b9d"></path>
    <path d="M 185 50 Q 195 40 205 85 L 175 85 Z" fill="#e9c46a"></path>
    <path d="M 145 85 L 235 85" stroke="#1d3557" stroke-width="6" stroke-linecap="round"></path>
    <path d="M 190 85 Q 185 125 210 110" fill="none" stroke="#1d3557" stroke-width="3"></path>
  </g>

<path d="M 180 120 Q 220 120 280 145" fill="none" stroke="#9c6644" stroke-width="18" stroke-linecap="round"></path>
  
  <path d="M 270 140 L 295 140 L 300 155 L 275 160 Z" fill="#e76f51"></path>

</svg>

Upload