How to Create Widgets with Transparent Backgrounds on iPhone

An empty space on the home screen of an iPhone.Khamosh Pathak

Although you can completely customize your iPhone’s home screen with widgets and icons, unfortunately you cannot add empty space between them. However, there is a solution for this!

How to create a transparent widget background with scriptable

To do this we will use the free app Scriptable to cut out part of the background via a ready-made script. You don’t have to write a line of code! All you do is copy, paste, then hit the run button.

The way the app does this is pretty smart. First, you take a screenshot of an empty home screen page. When you decide where you want to place the widget, Scriptable then cuts off the right part of the wallpaper.

RELATED: How to add sticky notes to your iPhone home screen

Once you have a screenshot of your iPhone background, you will only use it as a widget background. This is supported in many third party apps, like Widgetsmith, Sticky widgets, and even scriptable (more on that later).

An iPhone with empty space on its home screen and one without.

So, first of all: take a screenshot of a blank home screen on your iPhone. To do this, tap and hold an empty part of the iPhone home screen to enter Jiggle mode.

Next, slide your finger across the last page of the Home screen (or a page that doesn’t have app icons or widgets). Simultaneously press the side and volume up buttons. If your iPhone has Touch ID, press the side and home buttons.

Press the side and volume up buttons to take a screenshot on your iPhone.

Now go to this GitHub page and copy the entire code. Open the Scriptable app, then tap the plus sign (+) at the top right.

Tap the plus sign.

Next, double-tap an empty part of the screen, then tap “Paste.”

Now that the code has been added, tap the Run icon (it looks like a “Play” symbol) in the toolbar at the bottom.

Tap the Run icon.

If you have followed the steps outlined above and taken a screenshot, press “Continue”.

Select the screenshot in the media downloader.

Select the screenshot of the blank home screen.

Choose the size of the widget you want to create (small, medium or large); we chose “Medium”. Then tap on where you want to place the widget; we have selected “Top”.

Tap where you want to place the widget.

Tap “Export to Photos” to save the image in the Photos app.

You will now find the background of the widget in the Photos app.

How to create a widget with a transparent background

Now that you have a transparent background, all you have to do is create a custom widget. In this example we will use Widgetsmith.

RELATED: How to Create Custom Widgets on iPhone

In Widgetsmith, you can create an empty widget (using the image you created above) or use an image as the background for a date and time widget.

Open Widgetsmith and go to the “Widgets” section. We create an average widget, so we tap on “Add average widget”, then choose a widget to edit.

Tap the preview.

Tap the widget preview in Widgetsmith.

On the widget’s personalization screen, tap “Photo date and time” in the “Style” section. Tap “Photo” if you want to create a blank widget.

In the “Selected photo” section, tap “Choose photo”.

Tap the image you created in Scriptable.

Tap the image.

Tap the Back arrow.

Tap the Back arrow.

Here you can rename the widget. Press “Save” when finished.

Now it’s time to add the widget to your iPhone home screen. Return to the Home screen, then press and hold any blank area. Tap the plus sign (+) at the top left.

Tap the plus sign.

Tap “Widgetsmith”.

Navigate to the widget you want to add, then tap “Add Widget”.

By default, the widget you just created should appear here; if not, tap on it to customize it.

Tap the widget for more options.

Tap “Widget”.

Tap on the widget you just created.

Tap on the widget you created.

If the widget is not where you want it, you can move it around to align with the wallpaper. Press “Done” when you are satisfied with the home screen layout.

You now have a widget with a transparent background! Just repeat the process to create more and use them on all of your iPhone’s home screens.

Want to install more widgets on your iPhone home screen? Stack them!

RELATED: How to Create a Stack of Widgets on Your iPhone Home Screen

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.