---
title: "Add a macOS-style drop shadow to your \"partial\" screen captures or plain-bordered images"
description: "By default, and like it or hate it, the macOS keystrokes to capture full app screen (⇧- ⌘- 5) will add a subtle drop shadow around your saved image.  This can make it more visually appealing when…"
canonical: https://oozou.com/til/add-a-macos-style-drop-shadow-to-your-partial-screen-captures-or-plain-bordered-images-153
locale: en
date: 2021-08-20
topic: macos
---

# Add a macOS-style drop shadow to your "partial" screen captures or plain-bordered images

> By default, and like it or hate it, the macOS keystrokes to capture full app screen (⇧- ⌘- 5) will add a subtle drop shadow around your saved image.  This can make it more visually appealing when…

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

By default, and like it or hate it, the macOS keystrokes to capture full app screen (⇧- ⌘- 5) will add a subtle drop shadow around your saved image.  This can make it more visually appealing when adding a screen shot or image to a document.  The convert app, part of the [ImageMagick](https://imagemagick.org/script/download.php#macosx) distribution, has a nice command line function to add this same drop shadow effect to any of your images (e.g., a partial screen capture using .⇧- ⌘- 4)  

Once installed, you can use the following command line to update your image with a drop-shadow:

```
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"
```

which will turn this:  

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

into this:  

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

Pro-tip: You can create a pseudo-function in your BASH or ZSH environment - e.g., in your ~/.bashrc file, add this line:

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

and then source your ~/.bashrc file (first time) to activate it:

```
source ~/.bashrc
```

Now, from your command line, you can add a drop shadow to any image file by simply typing:

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

*(remember to add double-quotes around your file if it contains spaces)*

# Enhancing PNG Images with Drop Shadows

Adding a drop shadow to a PNG image can significantly enhance its visual appeal, making it stand out against any background. This shadow effect creates a sense of depth, giving the image a more three-dimensional look. For designers and content creators, incorporating shadow png images into their projects can elevate the overall aesthetic, making designs more engaging and professional.

# How to Add a Drop Shadow Using CSS

For web developers looking to add a drop shadow to PNG images via CSS, the box-shadow property is a versatile tool. Here's a quick example:

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

This code snippet adds a subtle shadow effect to images, using a black shadow with 50% opacity. Adjust the values to achieve the desired shadow projection and intensity.

# Creative Uses of Shadow PNG Images

Shadow png images are not just for aesthetic purposes; they can also serve functional roles in design. For instance, using shadows can help guide the viewer's attention to specific elements, create a sense of hierarchy, or add texture to flat designs. Whether you're designing a website, creating digital art, or preparing a presentation, shadows can be a powerful tool in your creative arsenal.

By leveraging tools like ImageMagick or CSS, you can easily apply a drop shadow effect to your PNG images, enhancing their impact and ensuring they capture the viewer's attention.

**Done.**

---

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

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