html, body {
height: 100%;
}
#svg-container
{
display: flex;
align-items: center;
background-color: red;
height: 100%;
}
#svg-1
{
margin: 0 auto;
display: block;
}<div id="svg-container">
<svg id="svg-1" height="15px" width="15px" viewBox="0 0 30 30" xmlns="http://www.w3.org/2000/svg" version="1.1">
<circle r="15" cx="15" cy="15"></circle>
</svg>
</div>Another way to center anything inside the container is using grid like this:
#svg-container {
display: grid;
place-items: center;
}