找我們做網站
↑
Resources · 圖庫與影音素材

Cool Backgrounds 教學:免費產生幾何、漸層、粒子網頁背景圖

圖庫與影音素材發布 2021.05.20更新 2026.10.02閱讀約 3 分鐘
Cool Backgrounds 教學:免費產生幾何、漸層、粒子網頁背景圖

重點整理
Cool Backgrounds 是免費的線上背景產生器,提供三角幾何、科技粒子、CSS 漸層、漸層地形與 Unsplash 圖片五種效果。選好類型後可自訂顏色並即時預覽,再下載使用。

在這個網路發達的年代裡要找圖片其實不難!但是要找到一個適合當背景的圖片就真的是可遇不可求的了。好的背景不單要能夠吸引消費者的注意力還要能貼合品牌的理念,背景的選擇最好能夠依照使用者需求做出改變不管是在顏色上還是花紋上,今天我們就是要利用 Cool Backgrounds 做出專屬與你的背景!

什麼是Cool Backgrounds

Cool Backgrounds 是一款免費線上背景製作工具,提供5大特效和自訂顏色的功能。
其中五個特效為:三角幾何圖形、科技粒子效果、CSS 漸層背景、漸層地形圖和 Unsplash 圖片。
最後搭配上品牌的專屬顏色就能自訂出屬於你自己的背景了!

Cool Backgrounds
Cool Backgrounds

如何使用Cool Backgrounds

了解了背景的重要性以及Cool Backgrounds的強大之處以後就讓我們實際製作一張圖片吧!

第一步:選擇背景類型
點進網頁上發的連結後從左側選擇不同的背景類型,在右邊能夠看到即時預覽。

Cool Backgrounds
Cool Backgrounds

第二步:自定義顏色組合
選好背景組題以後就可以來設定顏色了!

Cool Backgrounds
Cool Backgrounds
Cool Backgrounds
Cool Backgrounds

第三步:單色效果
當然除了多種顏色以外我們還可以使用單色背景效果也是很不錯的!但是單色顏色就只有基本的5種沒辦法自訂!

Cool Backgrounds
Cool Backgrounds

圖片展示

在完成好你的背景圖片以後就可以上一些文字,一些Icon讓你的背景更加豐富~

Cool Backgrounds
Cool Backgrounds

常見問題

Cool Backgrounds 是免費的嗎?

是的,Cool Backgrounds 可免費使用,在瀏覽器中選擇背景類型、調整顏色後即可下載圖片,不需要註冊帳號;Unsplash 圖片類型則是以 Unsplash 的免費圖庫為素材。

什麼樣的圖片適合當網頁背景?

適合當背景的圖片通常色彩單純、細節少、中間沒有搶眼的主體,放上文字後仍然清楚易讀。幾何圖形、漸層、低對比的紋理都很適合;照片背景可以加一層半透明色塊降低干擾。

背景圖片放在網站上要注意什麼?

注意檔案大小與裁切。背景圖通常是全寬顯示,下載後建議縮到實際需要的寬度並轉成 WebP;手機版畫面比例不同,要確認重要的區域不會被裁掉。簡單漸層也可以改用 CSS 漸層,不必用圖片。

結語

Cool Backgrounds的東西相當的簡單如果直接拿來當背景使用也是可以不過加點標語和Icon更能吸引瀏覽者的注意力!

鵠學苑・鵠崙設計鵠崙設計 2014 年成立,專注 WordPress 網站開發,400 多個網站在我們自己的主機上運作。鵠學苑的文章由團隊實際操作後整理,工具與外掛的功能以撰文當時為準。
鵠崙設計

不想自己摸索,
就交給我們做。

外掛設定、主機效能、改版搬家,這裡寫的每一件事,都是我們每天在客戶網站上做的工作。留下需求,1 個工作天內回覆。