使用方式
- 1 開啟網頁物理粒子與重力沙盒,輸入、貼上或選擇要處理的內容。
- 2 依需求調整頁面上的選項與格式。
- 3 確認即時結果,再複製或下載可用的輸出。
在 Canvas 畫布中模擬 2D 物理粒子,支援重力、彈力、摩擦力、重力感應與滑鼠吸引。吉祥物 Alpa 會化身為物理粒子,跟著碰撞、彈跳並給出趣味表情!
您可以在畫布中任意生成發光的霓虹粒子。大號的「Alpa 吉祥物粒子」擁有完整的重力與彈性物理反彈。您可以用滑鼠點擊拖曳牠並拋向空中,牠會根據碰撞強度、速度與重力模式即時改變表情與氣泡說話,非常療癒!
在 Canvas 畫布中模擬 2D 物理粒子,支援重力、彈力、摩擦力、重力感應與滑鼠吸引。吉祥物 Alpa 會化身為物理粒子,跟著碰撞、彈跳並給出趣味表情!適合日常工作、開發、學習或快速驗證時使用。
工具在瀏覽器中運作;處理敏感資料前,仍請確認瀏覽器與裝置環境可信。
這是一個在瀏覽器裡執行的 2D 物理沙盒,用 Canvas 即時模擬發光的霓虹粒子與一顆大大的 Alpa 吉祥物粒子。你可以調整重力和彈力、切換不同的重力模式,或直接抓起 Alpa 甩出去,看它在牆壁之間彈跳、撞開周圍的粒子。它很適合拿來紓壓放空,也能當作理解重力加速度、恢復係數和簡單碰撞反應的互動教材,不需要安裝任何程式。
「重力大小」可以從 0 調到 1.5,「彈力係數」可以從 0.1 調到 1.0,數值越高,撞牆後保留的速度越多;不過模擬中也有輕微的空氣阻力,所以即使彈力設成 1.0,物體最後仍會慢慢停下來。按「發射粒子 (+20)」會在畫面上方一次加入 20 顆粒子,畫面上最多保留 400 顆,超過時會移除最早出現的粒子;「清空粒子」則會一次清除全部。用滑鼠或手指按住 Alpa 拖曳再放開,就能把牠拋出去。
重力模式有四種。「標準向下重力」就像地球上的重力;「無重力飄浮」會關掉重力,這時按住滑鼠,游標附近約 300 像素內的粒子會被吸過去;「羊駝中心黑洞」會把 Alpa 拉向畫面中央,同時讓所有粒子被吸向 Alpa,吸力大小跟著重力滑桿變化,滑桿調到 0 就不會有吸力;「行動裝置陀螺儀感應」則讓重力方向跟著手機傾斜的方向改變,iPhone 會先跳出授權提示。
為了在手機上也能流暢執行,小粒子只會和 Alpa 及畫面邊緣碰撞,粒子彼此之間不會互相碰撞。物理計算固定以每秒 60 步進行,螢幕更新率不同也不會讓速度忽快忽慢;右側會顯示即時的影格率、粒子數量與 Alpa 的移動速度。Alpa 被用力撞到牆時會換表情、發出短促的音效並噴出幾顆火花,粒子後方的光暈拖尾則是畫在畫布上的視覺效果。整個模擬都在本機執行,不會收集任何資料。
為了讓數百顆粒子在手機上也能流暢運作,沙盒只計算粒子與 Alpa、粒子與畫面邊緣之間的碰撞。如果每顆粒子都要互相檢查,計算量會隨粒子數量的平方增加,畫面很容易卡頓,所以粒子之間會直接穿過彼此。
這個模式需要有方向感測器的手機或平板,一般桌上型電腦和筆電沒有這種感測器。iPhone 和 iPad 在切換到這個模式時會跳出「動作與方向」的授權提示,必須按允許才能使用;如果先前拒絕過,請重新整理頁面後再試一次。另外也要確認重力滑桿不是 0。
黑洞的吸力會乘上「重力大小」滑桿的數值,滑桿設為 0 時就完全沒有吸力。把滑桿往右調,Alpa 會被拉向畫面中央,粒子也會被吸向 Alpa,數值越大,吸力越強。
不會。彈力 1.0 代表撞到牆時不損失速度,但沙盒中還有微弱的空氣阻力,每一步都會讓速度稍微變慢,所以物體最後還是會逐漸停下來。想看到更久的彈跳,可以把重力調低一點。
在 500×500 畫布上用鋼筆工具點出錨點、拖曳貝茲控制手把,即時產生 SVG Path 的 d 屬性與 CSS clip-path: path() 程式碼,附愛心、星星等模板。
上傳您的網頁截圖,一鍵包裝精緻的 macOS 風格瀏覽器視窗外框、柔和陰影與漸層背板,即時匯出簡報級 PNG。
即時調校多層 text-shadow 陰影、顏色、發光半徑與呼吸閃爍動畫,快速預覽並複製 CSS。
拖入本地圖片,透過像素級高解析放大鏡精準抓取色值,支援 HEX、RGB、HSL 複製與 WCAG 網頁色彩對比度檢測。