For those who own a Mac, DMG files are a familiar sight. A DMG file is Apple’s Disc Image File. Instead of using a physical disc to download software to your mac, you can download it straight from the internet. DMG files are designed for compression, file spanning, as well as encryption. Opening one on your Mac is pretty self-explanatory and does not require too much in the way of an explanation.

However, because DMG files are specifically designed for Apple products, it is not quite so simple to open them on other programs such as Windows, or in our specific case Adobe XD. However, it is still possible to open them in Adobe XD, and we will explain how to do so step by step. Read on to find out how.

How Do I Open A DMG File in Adobe XD?

To open a DMG file in Adobe XD it does require that you download a user interface (UI) kit, which gives you common elements such as familiar buttons, navigation bars, and so on.

How To Download Adobe UI Kits

To download this UI kit, go into Adobe XD and take the following steps:

1. Click the file button. This will be located in the upper left corner and will either say “File” or will be indicated by a button with three horizontal lines.
2. Next, find the button labeled “Get UI Kits”. You will have several options available. Pick the one that says “Apple IOS.”
3. This will take you to developer.apple.com. This is their resources page, where you will be able to find Adobe XD’s UI kit.
4. Click the option labeled “Download for Adobe XD”. This will download the file to your computer.
5. Double click on the file. You will be asked to accept an agreement to continue. Once you do you will have access to the folder.
6. Double click the folder labeled “13 Adobe XD”. Now you will be able to see what is in the folder.
7. Save the guides and lessons that you find in the folder, to an area that you will remember and is easy to access. You will be referring back to these often during the next part, so it is important that you can get to them quickly and that they do not get lost.
8. Next, download the SF fonts. There are two ways to do this. You can either go back to the same window where you double-clicked “13 Adobe XD” and instead double-click the item labeled “Download San Francisco.webloc”. This will take you to a webpage where you can click the SF Pro Fonts button to download.

If you have already closed out the window you can still get to the download page by clicking this link: developer.apple.com/fonts/.

• Locate your downloads and double-click on the file to open it. Follow the directions on how to download the fonts.

How Do I Open the File Once I’ve Downloaded the UI Kit?

Once you have downloaded the UI Kit and the proper fonts, you should be good to go with opening it and transferring it to the file you are working on. First, open up your file in Adobe XD that you want to bring the UI Kit to, and take the following steps:

Go back into the lessons and guides. If you are not already, get back into Adobe XD and click “File”, then click “Open from your computer”. Scroll and click on the folder labeled “UI Elements+Design Templates+Guides”, then on the file labeled iphone.xd.

From here, you have a few options for what to do. To see everything press the Command and the 0 buttons. On the other hand, to narrow down your search, you will need to add the status bar. To do this, open up the Layers panel, type “status bars” in the search field (indicated by the magnifying glass), and then click on it to add it.  

Clear out the search field by clicking the X button to the right of it, then click on the folder icon, located to the left of the Status bar button. This will open up a list of status bars for you to choose from. Go through each status bar and click them until you have selected a status bar with dark text and a status bar with white text. To see the content of each of the status bars, click the folder to the left of them.

Select both of the status bars, by pressing the “Command” and “Control” keys, click on both bars to select them. To copy them, right-click with your mouse, click “Copy”, then paste them into your document using the “Command” and “V” buttons. When you have pasted everything that you need to into your document, close out any other files then save your document.

If you continue working on your project, make sure to refer back to the lessons and guides that you downloaded to transfer everything that you need over. Make sure to save as you go along so that no progress is lost.

Conclusion

DMG files are a way for Mac owners to download the necessary software updates and plug-ins that they need. However, because it is designed for Apple products, there may be certain programs where it is tricker to open a DMG file. If you are working on a project in Adobe XD, you will need to download the UI kit and then copy it to the Adobe XD file you are working on.

You can access the UI kit by clicking “File”, “Get UI Kits”, and Apple IOS. This will take you to Apple’s resource page where you will be able to download the kit, which contains all the guides and content that you will need to transfer over.

After you have downloaded the kit, refer back to each part to properly copy and transfer what you need back to your file. Carry on, until you have transferred everything, making sure to save and close out as needed.