.arrow { &::before { content: ""; display: inline-block; width: 15px; height: 15px; border-top: 3px solid #000; border-right: 3px solid #000; transform: rotate(45deg); } } 表示 補足 widthやheightを増減させるとくの字の線の長さが、border-widthを増減させると線の太さが変わります。 向きを変えたいときはtransform: rotate();の角度を変えましょう。