To Do

Choose an element with its basic atttributes from the list. Change or add additional attributes inside the code area.

Style by using style="" inside the element declaration or by applying <style> before the element like (classes, container elements can be added):

<style>
  circle { fill:red; stroke:black; }
</style>
<circle cx= .... />

Try:

<circle cx="300" cy="200" r="60"
    stroke="red" stroke-width="60"
    fill-opacity="0.5"
    stroke-dasharray="5, 5"/>

Some Presentation Attributes

stroke, stroke-width, stroke-opacity, stroke-dasharray (separated by coma), stroke-dashoffset

stroke-linecap (butt/round/square)

stroke-linejoin (miter/round/bevel)

opacity (0 - 1)

fill, fill-opacity

Text Alignment

The following shows the possible values of text-anchor and alignment-baseline text attributes to align the text.

For more info see How To Adjust The Baseline Alignment Of SVG Text. It explains also additional properties as dominant-baseline and baseline-shift.