Hack the Windows 8 Metro Start Screen Tiles, Icons, and Pictures

   Posted by Lê Hoàng in Windows 8

Windows 8 is all about Metro style. However, no self respecting geek wants his or her desktop to be plain and generic. By following these steps, you can customize and tweak the application tiles of the Metro applications. Change your tile images to personalize your Metro desktop!

Update 1 (10/24/2012): Working method for Windows 8 RTM.

Using these directions you should be able to change the images of the defaults apps and third-part applications as well. These steps are long and complex. Please read through several times before attempting.

Requirements:

Pictures for the tiles must be in PNG format. Large screen tiles will need to be a 310 x 150 picture. The square Metro tiles need to be a 150 x150 image.

Update: Make sure you prepared four versions of the image for the logos. You can check the resolutions for each once you identify to images in the folder. Here is the requirement in general:

- 1 “widelogo” image. (310 x 150, PNG format).

- 1 “widelogo.scale-100″. (310 x 150, PNG format).

- 1 “widelogo.scale-80″. (248 x 120, PNG format).

- 1 “widelogo.scale-140″. (484 x 210, PNG format).

Tiles that have large and square mode can be changed immediately after we complete our hack. Tiles that have square mode only will require a restart, an unpin, and then a re-pin of that tile.

If you want to replace the logo only, I would recommend finding that logo first and sizing it appropriately based on the image requirements above.

You will want to change your Metro background, lock screen, and profile picture too.

Directions

Before hacking the Start screen tiles, here is what you may have after completing the tutorial:

Update 1: Confirmed working hack for the Windows RTM.

1. Open Windows Explorer.

2. If you have not configure Windows Explorer to show hidden files and folders, click the View tab on the top of the window and check the Hidden items option.

3. Go to C:\Programs Files\WindowsApps (for both 32-bit and 64-bit versions), and right-click on this folder -> Properties. We will need to edit the permissions to access this folder.

4. In the WindowsApps Properties window, switch to the Security tab.

5. Click Advanced.

6. When the Advanced Security window pops up, click Change in the Owner line.

7. Provide the current email that you use to log in to Windows 8 to the blank field and hit OK.

Update (10/24/2012): Make sure you check the Replace owner on subcontainers and objects option as we will need to modify contents in folders later.

8. Click OK in the main Security window to save all the settings.

9. Now, you can access the WindowsApps folder. The folder will look like below. You can clearly see the names of the applications. While the folders of third-party apps can be found easily, folders of some default apps that come with Windows 8 are a bit hard to find. If you have trouble finding the right folders for apps, you can look at the names at the bottom of this post.

10. After you have found the right folder, look for its large tile picture (310×150). Because the folder structure of metro apps are not the same, there is no quick way to find it. For example, the wide logo (or large tile picture) for the weather app is located in the Bing weather-> Images folder. However, the large tile for Music app is located in the Zune music folder -> Images -> Tiles. If you are not sure if that is the right image, you can check its dimension and compare the picture with the logo at the Start screen.

11. (Updated). In this tutorial, I am going to replace the Weather app logo. Copy and replace the new PNG files (310×150, 248 x 120, 484 x 210) into this folder: Microsoft.BingWeather_version\images.

Old logos:

New logos:

12. (Updated). If you have a 150×150 picture for the small tile, copy and replace it with the logo.png file. Do not forget to rename it or it will not work. If the small logo has the scaled versions, then you will have to replace them too! (the process is the same as for the wide logo).

13. Back to the Start screen. Right click on the Weather tile and choose Larger or Smaller and the picture will be changed. You may need to change it more than once.

14. Again, if the tile you are modifying only has a square or small mode, restart the system, unpin the app, and re-pin it to make it work.

Here are some correct logo locations for common Windows apps:

Music: Microsoft.ZuneMusic_version/images/tiles.

Video: Microsoft.ZuneVideo_version/images/tiles.

Xbox Live: Microsoft.XboxLiveGames_version/images/tiles.

Xbox Companion: Microsoft.XboxCompanion_version/images/tiles.

Weather: Microsoft.BingWeather_version/images.

Map: Microsoft.BingMap_version/images. (square mode only).

Reader: Microsoft.Reader_version/images. (square mode only). To find the right image for the tile, check its manifest.xml file in the folder.

Solitaire: Microsoft.Solitaire_version/assets.

Pinball: Microsoft.PinBallFX2_version/win8_assets.

Skydrive: Microsoft.MicrosoftSkydrive_version/ModernSkyDrive/product/Skydrive/resources/images.

Mail: Microsoft.Windowscommunicationapps_version/ModernMail/res.

People: Microsoft.Windowscommunicationapps_version/ModernPeople.

Chat: Microsoft.Windowscommunicationapps_version/ModernChat.

Calendar: Microsoft.Windowscommunicationapps_version/ModernCalendar.

 

About Lê Hoàng

When not creating exciting new Android games, Lê Hoàng is here crafting tutorials, tweaks, and fixes for your enjoyment.
View more articles by Lê Hoàng

The Conversation

Follow the reactions below and share your own thoughts.

  • john smith

    Awesome Tutorial. Now how do we get metro tiles for standard Windows apps?

    • Hayden

      I noticed that Google Chrome’s tile has a dark background on the Start Screen, so I decided to see how they did it.
      In the most obvious location, I found the following contents of the file at this location: C:\Program Files (x86)\Google\Chrome\Application\VisualElementsManifest.xml

      • Kevin

        Changing this file does not correct the start tile color on the start screen

  • Lê Hoàng

    @John Smith: I have not found the way to change the tiles for standard apps yet. I will write a tutorial if I find the way to hack it :)

    • James

      > have you found a hack for this yet please?

      • Lê Hoàng

        > It was not possible in the previous Consumer Preview version. I will take a look at the Release Preview one.

    • Brad3rs

      thanks for the tutorial :) i’m a perfectionist and those app shortcuts need to be nice tiles… i looked at visual studio but not really sure what i’m doing but creating a tile and displaying it in the metro ui took 5 mins. i created a tile for an application “say notepad” it puts it in the metro ui and looks really nice but i can’t work out where to put in the link to the exe so i click the tile and it launches notepad.exe if someone can tell me how then creating nice tiles for standard windows apps would be quite easy.

  • andre

    Is there already a way to bypass Windows8′s access permissions? I know I have to change ownership but that didn’t work for me, just as it didn’t in Windows 7. It still gives me “Access denied”.

  • a7mad

    I was wondering if there’s a way to choose albums that the pictures live tile choose photos from.

  • Lê Hoàng

    @andre: Have you done step 4 to 8? If configuring through the Security->Advanced window does not work for you, maybe the Group or user names section in the Security tab will help. Just choose your username, hit Edit, and then check the Full control box?

    Hope this helps :)

    • Zoom

      Yes, work it! Thanks ;)>

      • maz

        I cant gain access. Access denied whatever I try to do. I tried every security permisision option… any suggestion why I cannot gain access? its win 8.1

  • Lê Hoàng

    @a7mad: You can only set one picture as the live tile of the photos app. There is a built-in function in the Photos app for that.

  • Marko

    Also interested in changing others apps pictures in metro :)
    Hope we’ll have it soon.
    Thank you for this article.

  • Quarien

    Is it possible, to somehow change app manifest and just change the background colour, leaving all the icons alone?

  • Lucas Maniero

    Internet Explorer 10 fixes sites that the user wishes on the start screen. There they appear with the icon and the predominant color of the icon. I wonder if there is any way to change that image, that square. Put any image of 150x150px?

    • Lê Hoàng

      > It was not possible in the Cosumer Preview version. I will take a look at the Release Preview version and see if it is possible.

      • Lucas Maniero

        Thank you! If possible too, to know for any non metro program.

  • lex

    Hi, when I change appmanifest.xml (values of background color) in app folder, there is no change on my screen. Do you know if there is sort cache for the metro environnment ? How refresh ?
    thanks

    • Lê Hoàng

      > You can use the system tool to clean the C drive up. After that, restart your computer if there is no change

      • Quarien

        > The problem is, when app finally changes colour, it appears “broken” and I can’t fire it up, because everytime I do that it takes me to Store to redownload the whole thning…
        Any clues?

  • Chris

    Can this be done with local account as well?

    • Lê Hoàng

      > Yes it is possible

  • cydgeno

    hi

    your tutorial doesnt work anymore in the final version of win 8 enterprise or pro

    do you have any upgrade ?

    thanks

    CYD

    • Lê Hoàng

      > It still works fine in the Release Preview version. I have just tested it today. I will update the tutorial if necessary when the final version is out.

    • Lê Hoàng

      > Can I know which step causes trouble for you?

  • Jonathan

    Any update on making Metro tiles for non-Metro applications?

  • onGri

    Hi there,

    your tutorial ist not working for me, too. I just tried to change the weather tile (wide & square) and follow all your steps, but nothings happens. Sad.

    I’m using windows 8 enterprise final version.

    greetz
    onGri

    • Lê Hoàng

      > Hello,

      I have updated the tutorial to make it work in the Windows 8 RTM. Make sure to follow the guide carefully.

      Enjoy :)

      • teeza

        > hey is there a way to change the background color of live tiles

  • Andrea

    Hi everything works fine for me, I use RTM final version pro, except for point 14, the tiles that just have the small tile don’t change, even restarting the system unpin the tile and pin it again

  • Carlo

    Great tutorial and it works (for me!).
    I’m just wondering how to change Screen Tiles, Icons, and Pictures of a direct link to a web page that I’ve added to the Start. I just can’t find the appropriate folder in the WindowsApps subfolders.
    Thanks
    Carlo

  • absz

    Great tutorial. Is there a way to edit the number of tiles the Photo tile generates for rotation. I can see it generates 5 tile images in the following folder: C:\Users\~username~\AppData\Local\Packages\microsoft.windowsphotos_8wekyb3d8bbwe\LocalState

    As the tile doesnt update often with my images from FB and Local images. Any way we can set the number of images to 50 or so instead of 5 ?

  • teeza

    how can i change background color of a live tiles? is that possible

  • damian

    Will the same process work with a website bookmark/shortcut tile that has been pinned to the start screen?

  • Kyle

    Hi, I’m having trouble finding the widelogo images in each app specific folder. I have a large bunch in the ‘Tiles’ folder and even in ‘Music’ there’s stuff from Video and Games, I’m not sure what to edit (I tried a few random ones, to no avail)
    Using Win8 Pro most recent

    Thanks

  • TroubleEveryDay

    Can you find a way to change the image of pinned websites?

  • O’Ryan

    just wanted to thank you. you’re very kind and find the time to answer almost every question being asked.

  • Andrew

    I can seem to be able to change the icon for pinned websites. When pinning websites on metro IE10, where are they located in windows explorer in order to change the icon? also pinning sites to the metro from desktop just launches the desktop internet explorer, although I prefer the metro version. any help?

  • anne

    hey could you do a tutorial for how to change the start screen picture, we are so limited with the backgrounds and colors and im to cheep to buy decor8, Thanks :)

  • Dale Harris

    I followed step-by-step. I started with Zune Music folder. Everything went smoothly but I can’t find wide logo anything. I experimented with a couple of MusicIcon.pngs but nope. I know I’m doing something wrong. But then I’m running Win 8 Pro. Maybe a video?

  • karen

    hey, do you know how to change the permissions back as it was before? :S

  • Dan

    How to refresh small tile mode ?
    restart the system, unpin the app, and re-pin it.
    But it not work for me.

  • JaGGeD

    Does anyone know how to make the Tile Backgrounds completely transparent but have the Icon of the Tile show as normal? (elimenating the ‘block’ tile and for instance The Weather Tile, will only show the little sun, or on Mail it will only show the envelope instead of a full colored block tile.)

  • rusty

    Hello could you please hlp with xbl_live tile as there is no widelogo.png file that i can see?

  • carlos

    It seemed to changed all the permits and allowed me to navigate to the appsfolders but even though I changed the icon files they’re not changing in the metro startscreen. Besides it seems like Apps wont get installed from the store now… any way to reverse this?

    C.

  • Tigran

    Is there any way to disable automatic background color for standart Windows Apps in Windows 8.1 (Preview)? The start screen now looks like a mess, cause’ every app has own bgcolor.
    Thank you for your work!

  • James

    Still having issues replacing the icons. I’m given permission to access the Windows Apps folder, but when I try to replace the files it tells me I need permission.

    • James

      Also, it tells me that to edit files I need permission from SURFACEPRO\MYNAME.
      I would think that would just be me though?

  • Slim_Shady_94

    it works, but you cant edit the “imported from the desktop apps”