Old school D3 from simpler times

All examples By author By category About

dmann99

Full window Github gist

SVG Noodling

Just looking to try some SVG elements.

Built with blockbuilder.org

<svg width=600 height=600>

<circle cx="25" cy="35" r="20"
            fill="rgba(128, 0, 128, 0.75)"
            stroke="rgba(0, 255, 0, 0.25)" stroke-width="10"/>
    <circle cx="75" cy="35" r="20"
            fill="rgba(0, 255, 0, 0.75)"
            stroke="rgba(0, 0, 255, 0.25)" stroke-width="10"/>
    <circle cx="125" cy="35" r="20"
            fill="rgba(255, 255, 0, 0.75)"
            stroke="rgba(255, 0, 0, 0.25)" stroke-width="10"/>
  
      <ellipse cx="300" cy="29" rx="100" ry="25"/>

<text x="150" y="100" font-family="serif"
     font-size="25" fill="gray">Some Text</text>
  
    <rect x="0" y="100" width="30" height="30" fill="purple"/>
    <rect x="20" y="105" width="30" height="30" fill="blue"/>
    <rect x="40" y="110" width="30" height="30" fill="green"/>
    <rect x="60" y="115" width="30" height="30" fill="yellow"/>
    <rect x="80" y="120" width="30" height="30" fill="red"/>
  
  <path d="M344,361 h-150 a150,150 0 1,0 150,-150 z"
        fill="red" stroke="blue" stroke-width="5" />
  <path d="M391,401 v-150 a150,150 0 0,0 -150,150 z"
        fill="yellow" stroke="blue" stroke-width="5" />

<path d="M17,353 l 50,-25 
           a25,25 -30 0,1 50,-25 l 50,-25 
           a25,50 -30 0,1 50,-25 l 50,-25 
           a25,75 -30 0,1 50,-25 l 50,-25 
           a25,100 -30 0,1 50,-25 l 50,-25"
        fill="none" stroke="red" stroke-width="5"  />
  
</svg>