1# Sliced Images
2
3You should output materials included in your design, such as icons, images, and sequence frames, in a proper format and provide them to developers so that developers can use them in the actual application UI.·
4
5
6To better display clear images on a device based on its DPI, an excellent application must contain multiple sets of sliced images with the same name stored in the **mdpi**, **ldpi**, **xldpi**, and **xxldpi** folders. They will be stored in the corresponding path in the application resource package.
7
8
9Folders with multiple sets of sliced images of the same name
10
11
12![4.8-folders-of-sliced-images](figures/4.8-folders-of-sliced-images.png)
13
14
15Icon resources can be in .png, .jpg, .webp, or .svg format. You are advised to use .svg icon resources in multi-device design, because vector images are small in size, can be freely scaled without aliasing, and can be colored in real time based on color parameters.
16
17
18Image resources can be reused for multiple devices or delivered separately for different devices based on the design effect.
19
20
21One image about night for different devices
22
23
24![4.8-one-image-about-night-for-different-devices](figures/4.8-one-image-about-night-for-different-devices.png)
25
26
27Multiple images about a sunny day for different devices
28
29
30![4.8-multiple-images-about-a-sunny-day-for-different-devices](figures/4.8-multiple-images-about-a-sunny-day-for-different-devices.png)
31