A Propriedade: border-radius

A propriedade `border-radius` arredonda os cantos de uma caixa. O valor pode ser em pixels ou porcentagem. Uma dica de ouro: se você tiver uma caixa perfeitamente quadrada (ex: 100x100px) e aplicar `border-radius: 50%`, ela se transforma em um círculo perfeito!

<style>
  .circulo {
    width: 80px; height: 80px;
    background: #8A2BE2;
    border-radius: 50%; /* Transforma em círculo */
  }
</style>

<div class="circulo"></div>