SVG Path คลาสพิเศษ (Branch 6377)

✨ CHANISARA WATCHARAPONKUL

<html>
  <head>
    <title>Let's Start
    </title>
    <style>
      body{
        background:grey;
        margin:1em;
        font-family:sans-serif;
      }
      svg{
      background:#e3bb1c;
      }
    </style>
  </head>
  <body>
    <svg viewBox="0 0 100 100">
      
      <path d="
M50,10 L90,50 L50,90 L10,50 L50,10 
M50,10 v80
M10,50 h80
               " 
            stroke-width="1"
            stroke="white"
            stroke-linecap="round"
            stroke-linejoin="round"
            fill="#0000"
            />
      <circle r="25" fill="red" cx="50" cy="50"/>
      <circle r="20" fill="white" cx="50" cy="50"/>
      <circle r="19" fill="red" cx="50" cy="50"/>
      <circle r="18" fill="white" cx="50" cy="50"/>
      <circle r="15" fill="red" cx="50" cy="50"/>
      <circle r="10" fill="white" cx="50" cy="50"/>
      <circle r="8" fill="red" cx="50" cy="50"/>

      <path d="
M40, 10 h30 v10 h20 v10 h-10 v-20 h-10
M40, 10 h-10 v10 h-20 v10 h10 v-20 h10
M40, 90 h30  v-10 h20 v-10 h-10 v20 h-10
M40, 90 h-10  v-10 h-20 v-10 h10 v20 h10 
M90,20 v50
M10,20 v50
               " 
            stroke-width="1"
            stroke="red"
            stroke-linecap="round"
            stroke-linejoin="round"
            fill="#0000"
            />
      <path d="
M20, 5 h65 v10 h10 v70 h-10 v10 h-70 v-10 h-10 v-70 h10 v-10 h5
               " 
            stroke-width="1"
            stroke="red"
            stroke-linecap="round"
            stroke-linejoin="round"
            fill="#0000"
            />
      <path d="
M10, 	5 h85 v90 h-90 v-90 h5 
               " 
            stroke-width="1"
            stroke="white"
            stroke-linecap="round"
            stroke-linejoin="round"
            fill="#0000"
            />
       
    </svg>
  </body>
</html>