Primeiro você precisa definir as dimensões da área do SVG que você deseja. Como a figura é representada por um quadrado, suponhamos que você deseja uma estrela com 100x100
pixels. Então defina o width
e o height
em 100px
:
CSS:
svg{
width: 100px;
height: 100px;
}
Agora você precisa definir as coordenadas dentro dessa área (para a estrela, são 5 coordenadas), separadas por vírgula sendo x,y (x é o eixo horizontal e y o eixo vertical) nos vértices indicados abaixo:

Como SVG tem 100x100
pixels de dimensão, os valores da figura acima são as porcentagens aproximadas para se construir uma estrela perfeita, ou seja:
1º vértice: x = 50%, y = 0%
2º vértice: x = 19,49%, y = 100%
3º vértice: x = 100%, y = 37,93%
4º vértice: x = 0%, y = 37,93%
5º vértice: x = 80,51%, y = 100%
Exemplo:
svg{
width: 100px;
height: 100px;
}
<svg xmlns="http://www.w3.org/2000/svg">
<polygon points="50,0 19.49,100 100,37.93 0,37.93 80.51,100" fill="black" style="fill:yellow"/>
</svg>
Dependendo do tamanho da estrela que você quer, basta aplicar as
porcentagens proporcionalmente nas coordenadas de acordo com as dimensões do quadrado.