偶爾會看到帶有波浪形狀的網頁背景設計，通常會配合平面設計風格一起使用，會讓整體看起來更活潑，很多設計師從沒想過這個效果是怎么做的，其實這個效果是可以使用.svg矢量圖的代碼直接實現(xiàn)的。

如果你平常工作和網頁設計有關，可能會用到類似上面圖片顯示的「波浪圖」效果，本文要介紹的設計工具將會很有用，趕緊把它收錄到書簽以備不時之需。 

接下來推薦的「Get Waves」是一個生成.svg格式波浪圖案的在線工具，直接打開網站就能在線生成，網站提供一些基本選項，包括波浪類型、位置、顏色、透明度、密度等等，調整后會立即在網頁中產生效果預覽，最終可以將圖片另存為.svg矢量圖或產生svg代碼。 

網站名稱：Get Waves 

網站鏈結：https://getwaves.io/ 

使用教學

STEP 1 

打開Get Waves后預設就會有一個藍色波浪效果，看起來非常夏天！試著點選控制列的調整項目，通過簡單的圖示應該可以知道每個選項代表的意思，隨意點選看看，下方預覽圖就會即時更新。 

STEP 2 

Get Waves 讓使用者直接從網頁上調整波浪樣式、顯示位置（上或下）、顏色、透明度和密集程度等選項，如果沒有想法，點選最右側的「骰子」圖示就是隨機產生，跟以前玩游戲在創(chuàng)角色隨機獲得的屬性點數(shù)一樣。 

STEP 3 

最后，點選中間的下載圖案，選擇要下載.svg 格式矢量圖或直接復制上方svg代碼。

值得一試的三個理由：

1，可在線生成波浪圖的產生器 

2，調整波浪樣式、位置、顏色、透明度和密集程度 

3，生成.svg格式矢量圖或直接復制svg代碼