Como distorcer o elemento, mas manter o texto normal (não distorcido)

Criando um botão distorcido com texto não distorcido

Para criar um elemento distorcido com texto não distorcido, você pode aplicar uma transformação aos elementos pai e filho:

Skewing o elemento pai:

Use a propriedade transform: skew() para distorcer o elemento pai (neste caso, o elemento

Resultado:

Isso criará um menu com botões distorcidos, mas texto não distorcido, permitindo um efeito angular sem distorcer a legibilidade dos links .