Tres franjas deberían ser algo tan fácil de dibujar. Aquí hay varias formas diferentes de hacerlo en la web. Dicho esto, SVG es definitivamente la mejor manera de manejarlo. Un menú de hamburguesas es tan simple que podemos dibujarlo a mano en SVG.
Tres rectángulos, distribuidos uniformemente:
<svg viewBox="0 0 100 80" width="40" height="40">
<rect width="100" height="20"></rect>
<rect y="30" width="100" height="20"></rect>
<rect y="60" width="100" height="20"></rect>
</svg>Siéntase libre de jugar con esos números para obtener el tamaño y el estilo que desee.
¿Algo asombroso que quizás no conozcas? SVG tiene esquinas redondeadas, al igual que CSS tiene border-radius! Viene en forma de rx atributo. Echale un vistazo:
Eso podría funcionar mejor para su diseño si su diseño es más suave y utiliza elementos redondeados.