С помощью псевдоэлемента ::after мы создали в каждой ссылке по красному квадрату. Квадраты спозиционировали в правой части ссылок. Сейчас мы будем превращать их в стрелки.

Первым делом нужно будет добавить квадратам резкую тень со смещением в один пиксель — она будет контуром стрелок.

Затем мы сильно закруглим один из углов каждого квадрата. Свойство border-radius может работать подобно margin или padding и задавать разные радиусы скругления для каждого угла элемента. Для этого радиусы записываются через пробел:

border-radius: 1px 2px 3px 4px;
/*
1px - верхний левый угол
2px - верхний правый угол
3px - нижний правый угол
4px - нижний левый угол
*/

Обратите внимание, что правый паддинг у ссылок и расположение квадратов подобраны таким образом, чтобы текст ссылок не перекрывался скруглённой стороной квадрата.

Затем с помощью трансформаций нужно повернуть квадраты на 45° и немного уменьшить их, так как диагональ квадрата больше высоты ссылки.