![]() Upload your icon, adjust the color and size, then export the image. If you want to create a maskable icon based off your existing icon, you can use the Maskable.app Editor . How do I adopt maskable icons? #Open an icon, then Maskable.app will let you try out various shapes and sizes, and you can share the preview with others on your team. If you want to preview your maskable icon in other shapes it may appear in on Android, I 've created a tool called Maskable.app . If your logo is visible within this safe area, you 're good to go. Your icons will be trimmed so that only the safe area is visible. In the Icons section, you can choose to Show only the minimum safe area for maskable icons . With your Progressive Web App open, launch DevTools and navigate to the Application panel.You can check which parts of your icons land within the safe zone with Chrome DevTools. The important parts of your icon, such as your logo, should be within a circular area in the center of the icon with a radius equal to 40% of the icon width. Luckily, there 's a well-defined and standardized " minimum safe zone " that all platforms respect.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |