前端切圖是將UI設計師設計好的頁面圖形按照一定的規則進行切割，生成各種網頁元素的圖片，從而使得頁面達到UI設計效果的過程。
切圖是Web前端開發過程中必不可少的一箇環節，它包括將設計文稿中的圖片根據佈局的需要，利用Photoshop的切片工具將圖像在文稿中分離出來，然後配合DIV+CSS完成靜態頁面的製作。切圖不僅包括將圖片切出來，還包括處理不同類型的頁面，如圖片型、圖文型和界面型頁面。切圖的目的在於提高網頁的交互性和視覺效果，優化頁面加載速度，減小網頁體積，使得UI設計師的“理想”界面能夠轉化爲實際的網頁。切圖的過程需要考慮圖片的體積和網頁的加載速度，因此，在切圖時應注意少用圖片工具，採用div+css佈局，以減小網頁體積。