Opus 4.5 PS4 - SVG Viewer

DOSPSHC5

N/A

3.87 KB2.73 KB-30%

<svg viewBox="0 0 400 280" xmlns="http://www.w3.org/2000/svg">
  
  <defs>
    <linearGradient id="bodyGradient" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="0%" style="stop-color:#3a3a3a"></stop>
      <stop offset="100%" style="stop-color:#1a1a1a"></stop>
    </linearGradient>
    <linearGradient id="lightBar" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" style="stop-color:#0066ff"></stop>
      <stop offset="100%" style="stop-color:#00aaff"></stop>
    </linearGradient>
  </defs>
  
  
  <path d="M200 30 
           C280 30 320 50 340 80 
           Q380 130 370 200 
           Q365 250 340 260 
           Q310 270 290 240 
           Q270 210 250 200 
           L150 200 
           Q130 210 110 240 
           Q90 270 60 260 
           Q35 250 30 200 
           Q20 130 60 80 
           C80 50 120 30 200 30 Z" fill="url(#bodyGradient)" stroke="#111" stroke-width="2"></path>
  
  
  <path d="M140 35 Q200 25 260 35" stroke="url(#lightBar)" stroke-width="6" fill="none" stroke-linecap="round"></path>
  
  
  <rect x="140" y="55" width="120" height="70" rx="5" fill="#222" stroke="#111" stroke-width="2"></rect>
  <line x1="200" y1="55" x2="200" y2="125" stroke="#333" stroke-width="1"></line>
  
  
  <circle cx="120" cy="120" r="28" fill="#1a1a1a" stroke="#111" stroke-width="2"></circle>
  <circle cx="120" cy="120" r="18" fill="#2a2a2a" stroke="#222" stroke-width="1"></circle>
  
  
  <circle cx="280" cy="120" r="28" fill="#1a1a1a" stroke="#111" stroke-width="2"></circle>
  <circle cx="280" cy="120" r="18" fill="#2a2a2a" stroke="#222" stroke-width="1"></circle>
  
  
  <rect x="55" y="70" width="16" height="45" rx="2" fill="#2a2a2a" stroke="#111"></rect>
  <rect x="42" y="83" width="45" height="16" rx="2" fill="#2a2a2a" stroke="#111"></rect>
  <circle cx="64" cy="92" r="5" fill="#222"></circle>
  
  
  
  <circle cx="335" cy="65" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <polygon points="335,56 328,72 342,72" fill="none" stroke="#5d8a5d" stroke-width="2"></polygon>
  
  
  <circle cx="355" cy="85" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <circle cx="355" cy="85" r="6" fill="none" stroke="#8a5d5d" stroke-width="2"></circle>
  
  
  <circle cx="335" cy="105" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <line x1="329" y1="99" x2="341" y2="111" stroke="#5d6a8a" stroke-width="2"></line>
  <line x1="341" y1="99" x2="329" y2="111" stroke="#5d6a8a" stroke-width="2"></line>
  
  
  <circle cx="315" cy="85" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <rect x="309" y="79" width="12" height="12" fill="none" stroke="#8a5d7a" stroke-width="2"></rect>
  
  
  <ellipse cx="155" cy="145" rx="10" ry="6" fill="#2a2a2a" stroke="#111"></ellipse>
  
  
  <ellipse cx="245" cy="145" rx="10" ry="6" fill="#2a2a2a" stroke="#111"></ellipse>
  
  
  <circle cx="200" cy="160" r="10" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <text x="200" y="164" font-size="10" fill="#555" text-anchor="middle" font-family="Arial">PS</text>
  
  
  <rect x="60" y="25" width="50" height="12" rx="3" fill="#2a2a2a" stroke="#111"></rect>
  
  
  <rect x="290" y="25" width="50" height="12" rx="3" fill="#2a2a2a" stroke="#111"></rect>
  
  
  <path d="M55 20 Q85 5 115 20" stroke="#222" stroke-width="8" fill="none" stroke-linecap="round"></path>
  
  
  <path d="M285 20 Q315 5 345 20" stroke="#222" stroke-width="8" fill="none" stroke-linecap="round"></path>
  
  
  <g fill="#1a1a1a">
    <circle cx="188" cy="180" r="1.5"></circle>
    <circle cx="194" cy="180" r="1.5"></circle>
    <circle cx="200" cy="180" r="1.5"></circle>
    <circle cx="206" cy="180" r="1.5"></circle>
    <circle cx="212" cy="180" r="1.5"></circle>
    <circle cx="191" cy="186" r="1.5"></circle>
    <circle cx="197" cy="186" r="1.5"></circle>
    <circle cx="203" cy="186" r="1.5"></circle>
    <circle cx="209" cy="186" r="1.5"></circle>
  </g>
</svg>

Upload

Preview React React Native PNG Data URI

3.87 KB2.73 KB-30%

<svg viewBox="0 0 400 280" xmlns="http://www.w3.org/2000/svg">
  
  <defs>
    <linearGradient id="bodyGradient" x1="0%" y1="0%" x2="0%" y2="100%">
      <stop offset="0%" style="stop-color:#3a3a3a"></stop>
      <stop offset="100%" style="stop-color:#1a1a1a"></stop>
    </linearGradient>
    <linearGradient id="lightBar" x1="0%" y1="0%" x2="100%" y2="0%">
      <stop offset="0%" style="stop-color:#0066ff"></stop>
      <stop offset="100%" style="stop-color:#00aaff"></stop>
    </linearGradient>
  </defs>
  
  
  <path d="M200 30 
           C280 30 320 50 340 80 
           Q380 130 370 200 
           Q365 250 340 260 
           Q310 270 290 240 
           Q270 210 250 200 
           L150 200 
           Q130 210 110 240 
           Q90 270 60 260 
           Q35 250 30 200 
           Q20 130 60 80 
           C80 50 120 30 200 30 Z" fill="url(#bodyGradient)" stroke="#111" stroke-width="2"></path>
  
  
  <path d="M140 35 Q200 25 260 35" stroke="url(#lightBar)" stroke-width="6" fill="none" stroke-linecap="round"></path>
  
  
  <rect x="140" y="55" width="120" height="70" rx="5" fill="#222" stroke="#111" stroke-width="2"></rect>
  <line x1="200" y1="55" x2="200" y2="125" stroke="#333" stroke-width="1"></line>
  
  
  <circle cx="120" cy="120" r="28" fill="#1a1a1a" stroke="#111" stroke-width="2"></circle>
  <circle cx="120" cy="120" r="18" fill="#2a2a2a" stroke="#222" stroke-width="1"></circle>
  
  
  <circle cx="280" cy="120" r="28" fill="#1a1a1a" stroke="#111" stroke-width="2"></circle>
  <circle cx="280" cy="120" r="18" fill="#2a2a2a" stroke="#222" stroke-width="1"></circle>
  
  
  <rect x="55" y="70" width="16" height="45" rx="2" fill="#2a2a2a" stroke="#111"></rect>
  <rect x="42" y="83" width="45" height="16" rx="2" fill="#2a2a2a" stroke="#111"></rect>
  <circle cx="64" cy="92" r="5" fill="#222"></circle>
  
  
  
  <circle cx="335" cy="65" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <polygon points="335,56 328,72 342,72" fill="none" stroke="#5d8a5d" stroke-width="2"></polygon>
  
  
  <circle cx="355" cy="85" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <circle cx="355" cy="85" r="6" fill="none" stroke="#8a5d5d" stroke-width="2"></circle>
  
  
  <circle cx="335" cy="105" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <line x1="329" y1="99" x2="341" y2="111" stroke="#5d6a8a" stroke-width="2"></line>
  <line x1="341" y1="99" x2="329" y2="111" stroke="#5d6a8a" stroke-width="2"></line>
  
  
  <circle cx="315" cy="85" r="12" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <rect x="309" y="79" width="12" height="12" fill="none" stroke="#8a5d7a" stroke-width="2"></rect>
  
  
  <ellipse cx="155" cy="145" rx="10" ry="6" fill="#2a2a2a" stroke="#111"></ellipse>
  
  
  <ellipse cx="245" cy="145" rx="10" ry="6" fill="#2a2a2a" stroke="#111"></ellipse>
  
  
  <circle cx="200" cy="160" r="10" fill="#2a2a2a" stroke="#111" stroke-width="1"></circle>
  <text x="200" y="164" font-size="10" fill="#555" text-anchor="middle" font-family="Arial">PS</text>
  
  
  <rect x="60" y="25" width="50" height="12" rx="3" fill="#2a2a2a" stroke="#111"></rect>
  
  
  <rect x="290" y="25" width="50" height="12" rx="3" fill="#2a2a2a" stroke="#111"></rect>
  
  
  <path d="M55 20 Q85 5 115 20" stroke="#222" stroke-width="8" fill="none" stroke-linecap="round"></path>
  
  
  <path d="M285 20 Q315 5 345 20" stroke="#222" stroke-width="8" fill="none" stroke-linecap="round"></path>
  
  
  <g fill="#1a1a1a">
    <circle cx="188" cy="180" r="1.5"></circle>
    <circle cx="194" cy="180" r="1.5"></circle>
    <circle cx="200" cy="180" r="1.5"></circle>
    <circle cx="206" cy="180" r="1.5"></circle>
    <circle cx="212" cy="180" r="1.5"></circle>
    <circle cx="191" cy="186" r="1.5"></circle>
    <circle cx="197" cy="186" r="1.5"></circle>
    <circle cx="203" cy="186" r="1.5"></circle>
    <circle cx="209" cy="186" r="1.5"></circle>
  </g>
</svg>

Upload