CSS3可以通過偽元素繪制各種形狀，包括箭頭。下面是一個簡單的繪制向右箭頭的示例：

.arrow-right {
position: relative;
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
border-left: 20px solid #333;
}
.arrow-right::before {
content: "";
position: absolute;
top: -20px;
left: -20px;
width: 0;
height: 0;
border-top: 20px solid transparent;
border-bottom: 20px solid transparent;
border-left: 20px solid white;
}

首先定義一個帶邊框的三角形元素作為箭頭的主體，通過設置上下邊框為透明可以形成一個帶角度的三角形。接著使用偽元素在箭頭的左側繪制一個白色三角形，達到遮罩的效果。

如果需要繪制其他方向的箭頭，只需要進行一些簡單的調整。例如向上箭頭只需要把上下邊框變為左右邊框即可。

.arrow-up {
position: relative;
width: 0;
height: 0;
border-left: 20px solid transparent;
border-right: 20px solid transparent;
border-bottom: 20px solid #333;
}
.arrow-up::before {
content: "";
position: absolute;
top: -20px;
left: -20px;
width: 0;
height: 0;
border-left: 20px solid transparent;
border-right: 20px solid transparent;
border-bottom: 20px solid white;
}

在實際應用中，可以通過組合不同的箭頭形狀，制作更豐富的圖標。同時也可以通過調整顏色、邊框、角度等屬性，實現更加多樣化的效果。