---
title: "為你的「部分」螢幕截圖或純邊框圖片加上 macOS 風格的陰影"
description: "不論你喜不喜歡，macOS 擷取完整應用程式視窗的快捷鍵（⇧- ⌘- 5）預設會在儲存的圖片周圍加上一層淡淡的陰影。當你把螢幕截圖或圖片加進文件時，這能讓畫面更…"
canonical: https://oozou.com/til/add-a-macos-style-drop-shadow-to-your-partial-screen-captures-or-plain-bordered-images-153
locale: zh-Hant
date: 2021-08-20
topic: macos
---

# 為你的「部分」螢幕截圖或純邊框圖片加上 macOS 風格的陰影

> 不論你喜不喜歡，macOS 擷取完整應用程式視窗的快捷鍵（⇧- ⌘- 5）預設會在儲存的圖片周圍加上一層淡淡的陰影。當你把螢幕截圖或圖片加進文件時，這能讓畫面更…

Published: 2021-08-20 · Topic: [macos](https://oozou.com/zh-Hant/til-topics/macos) ([markdown](https://oozou.com/zh-Hant/til-topics/macos.md))

不論你喜不喜歡，macOS 擷取完整應用程式視窗的快捷鍵（⇧- ⌘- 5）預設會在儲存的圖片周圍加上一層淡淡的陰影。當你把螢幕截圖或圖片加進文件時，這能讓畫面更有視覺吸引力。convert 這個應用程式是 [ImageMagick](https://imagemagick.org/script/download.php#macosx) 套件的一部分，提供了一個好用的命令列功能，可以為你的任何圖片加上同樣的陰影效果（例如用 .⇧- ⌘- 4 擷取的部分螢幕截圖）  

安裝完成後，你可以用以下的命令列指令為圖片加上陰影：

```
convert "Screen Shot 2021-07-07 at 09.47.13.png" \( +clone -background black -shadow 80x20+0+15 \) +swap -background transparent -layers merge +repage "Screen Shot 2021-07-07 at 09.47.13.png"
```

執行後會把這張圖：  

![](https://oozou.com/images/til/til-153-1.png)

變成這張：  

![](https://oozou.com/images/til/til-153-2.png)

小技巧：你可以在 BASH 或 ZSH 環境中建立一個偽函式，例如在你的 ~/.bashrc 檔案裡加入這一行：

```
shadow () { convert "$@" \( +clone -background black -shadow 80x20+0+15 \) +swap -background transparent -layers merge +repage "$@"; }
```

然後（第一次使用時）source 你的 ~/.bashrc 檔案來啟用它：

```
source ~/.bashrc
```

現在，你只要在命令列輸入以下指令，就能為任何圖片檔加上陰影：

```
shadow "Screen Shot 2021-07-07 at 09.47.13.png"
```

*（記得如果檔名包含空格，要在檔名前後加上雙引號）*

# 用陰影強化 PNG 圖片

為 PNG 圖片加上陰影可以大幅提升它的視覺吸引力，讓它在任何背景上都更加突出。這種陰影效果能營造出深度感，讓圖片看起來更立體。對設計師和內容創作者來說，在專案中運用帶陰影的 png 圖片能提升整體美感，讓設計更吸睛、更專業。

# 如何用 CSS 加上陰影

對想透過 CSS 為 PNG 圖片加上陰影的網頁開發者來說，box-shadow 屬性是個非常靈活的工具。以下是一個簡單的範例：

css img \{ box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.5); }

這段程式碼會為圖片加上淡淡的陰影效果，使用不透明度 50% 的黑色陰影。你可以調整數值來達到想要的陰影投影範圍與強度。

# 陰影 PNG 圖片的創意用法

帶陰影的 png 圖片不只是為了美觀，在設計上也能發揮實際功能。例如，陰影可以引導觀看者的注意力到特定元素、建立層次感，或為扁平化設計增添質感。無論你是在設計網站、創作數位藝術，還是準備簡報，陰影都是創作工具箱裡的一項利器。

透過 ImageMagick 或 CSS 這類工具，你可以輕鬆為 PNG 圖片套用陰影效果，強化它們的視覺衝擊力，確保能抓住觀看者的目光。

**完成。**

---

Contact OOZOU: hello@oozou.com · +66 2544 0000 · https://oozou.com/zh-Hant/contact

More for AI agents: https://oozou.com/llms.txt · every page has a markdown twin at its URL plus ".md"