Get Waves 線上產生 svg 格式波浪圖,可自訂類型顏色每次都不一樣

最後更新於 2020 年 07 月 07 日

偶爾會看到帶有波浪形狀的網頁背景設計,通常會配合平面化設計風格一起使用,會讓整體看起來更活潑,但倒是從沒想過這個效果是怎麼做的,沒想到現在透過 .svg 向量圖程式碼就可直接帶入,讓整個設計流程加速不少。如果你平常工作和網頁設計有關,可能會用到類似上面圖片顯示的「波浪圖」效果,本文要介紹的產生器會很有用,趕緊把它收錄到書籤以備不時之需。

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

網站名稱:Get Waves
網站鏈結:https://getwaves.io/

使用教學

STEP 1

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

STEP 2

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

STEP 3

最後,點選中間的下載圖案,選擇要下載 .svg 向量圖格式或直接複製上方 svg 原始碼。

值得一試的三個理由:

  1. 可線上產生波浪圖的產生器
  2. 調整波浪樣式、位置、顏色、透明度和密集程度
  3. 產生為 .svg 向量圖格式或直接複製 svg 程式碼

 

相關的文章

Ge.tt 老牌免空服務,免註冊可上傳 250 MB 無檔案數量限制

上一次介紹 Ge.tt 免費空間已經差不多是九年前的事,一直到最近又再次打開這個網站,才驚覺原來過這麼久它依然持續提供服務。大家都知道免費服務的穩定性是個考驗,尤其在沒有完整的營利模式下可能過一段時間就得收掉,畢竟多開一天就多賠錢一天,又得面臨很多問題,可以支撐下去確實相當不容易,因此決定再來重新寫篇文章介紹 Ge.tt,類似服務很多,但能夠持續這麼長時間的又有幾個呢?

Slidesgo 免費 Google Slides 和 PowerPoint 簡報模板下載

現在已經比較少需要製作投影片簡報,不過就我過去的經驗來說,我多半會直接使用內建的投影片範本,無論是早期 Office PowerPoint 或後來開始使用 Keynote,內建模板就能提供非常好的質感和效果(畢竟重點還是擺在內容部分),但就我所知,應該有不少朋友會嘗試從網路上尋找更多的投影片範本,有些完成度很高,只要一些些調整並將內容放入就能獲得相當好的效果,例如之前介紹過的 Templates、Glide 就有提供簡報模板下載。

Screenlapse 自動網站截圖服務可設定每小時、每日、每週或每月排程

寫了十多年的文章,各式各樣的網路服務或軟體大概都看過,只能說大部分的需求應該都有對應的解決方案可以選擇,但有些工具就真的比較少看到有人開發,舉例來說,有定時自動偵測網頁內容有沒有發生變化並發送通知的網站監測服務,就很少看到依照排程自動擷取網頁畫面的線上工具,而接下來要介紹的這項服務可線上自動抓取網頁畫面,也能讓使用者設定要擷取的頻率或時間點。

Pix Fix 修復照片噪點工具,拯救過度壓縮畫質造成圖片損毀問題

很多網路服務或應用程式都會自動對圖片進行壓縮,用以減少圖片大小,而在正常情況下「無損壓縮」(Lossless Compression)不會對圖片畫質造成破壞性的影響,甚至在肉眼看不出差異的狀況下大幅減少圖片容量,例如 Recompressor 或 TinyPNG 這類圖片壓縮工具都能做到,那如果遇到過度壓縮、破壞畫質造成圖片出現許多的噪點,有沒有工具可以修復或消除照片噪點呢?

Imgbot 免費圖片編輯工具,調整尺寸、壓縮、裁切或浮水印免安裝軟體

使用線上工具就能透過瀏覽器對圖片或影片進行簡單編輯,現今類似的服務不少,但大多都著重於單一功能,如果有多合一工具就更方便了!假如你平常需要調整圖片尺寸、壓縮圖片、裁切圖片或對圖片加上浮水印(Watermark),雖然有很多軟體可以做到,但可能很多人和我一樣不喜歡安裝軟體,而是盡量使用線上工具解決需求,不妨將接下來要介紹的這個工具加入書籤,它看起來雖然和一般的圖片編輯工具差不多,不過實際使用後發現確實很方便。

回應