SVG - Rectangle (rect)

1 - About

To draw a rectangle, you can use:

3 - Example

3.1 - With rect

With the rect element


<svg >
<rect 
    x="0" 
    y="0" 
    width="300" 
    height="100" 
    fill="#ECDCC6" 
    rx="10"
    ry="10"/>
</svg>

3.2 - With Path

with the path element


<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg">
  
  <path d="M10 10 H 90 V 90 H 10 L 10 10" fill="#ECDCC6" />

  <!-- Points -->
  <circle cx="10" cy="10" r="2" fill="red"/>
  <circle cx="90" cy="90" r="2" fill="red"/>
  <circle cx="90" cy="10" r="2" fill="red"/>
  <circle cx="10" cy="90" r="2" fill="red"/>

</svg>

4 - Documentation / Reference


Data Science
Data Analysis
Statistics
Data Science
Linear Algebra Mathematics
Trigonometry

Powered by ComboStrap