Download Icon Pack Iphone

0 views
Skip to first unread message

Carolina Schmalzried

unread,
Aug 4, 2024, 8:23:16 PM8/4/24
to rewerbottka
Ive made websites in the past where a simple favicon suffices and the website icon on the iPhone displays properly. However, when using Bootstrap studio, even when entering all the favicon information, I'm having trouble with this step. When I add to my iPhone's homescreen it shows up as a screenshot of the website itself. I've also tried adding favicon.ico and favicon.png manually to my hosting. Any suggestions would be welcome!

I never have issues with favicons, but I don't get too fancy with them. I just create one in Photoshop, save it as a .png, and then use one of the many online favicon generator websites to create the .ico file. I drop it in the BSS website export folder, upload to server, and it's always worked fine.


When iOS Safari users add Progressive Web Apps (PWAs) to their home screens, the icon that appears is called the Apple touch icon. You can specify what icon your app should use by including a tag in the of your page. If your page doesn't have this link tag, iOS generates an icon by taking a screenshot of the page content.


I went through this with Yosemite as well. Don't recall which step(s) resolved it, but things were fine until I upgraded to El Capitan. The 'Message' icon will not stop appearing on the left side of my Dock bar. I've done the following based on advice found in searches:


I was having this exact same issue Sierra 10.12.3 ... the Handoff suggestion seems to have fixed the issue. Appreciate you taking the time to respond and support the thread and community. *Two thumbs up*


Thanks for responding so quickly. The icon first appears on the left side of the Dock bar. After a few seconds it will go away, but of course will reappear later after another text. If I right-click that icon, I get only the "Open" option. If I select this option (or double-click the icon to begin with), the iMessage app pops up and of course the icon appears on the right edge of the Dock bar. Right-clicking that icon gives me these options:


Same issue here. I did just notice that one of my alternate icons had an extra pixel in height, so I'm going to see if that fixes the warnings on next submission, but I wouldn't be surprised if that was just a coincidence.


I didn't have to modify the Info.plist at all. I didn't have files of all required resolution. Used -icon to generate App icons. Copied all files under AppIcon.appiconset to Images.xcassets/AppIcon.appiconset(XCode automatically detected the iPad versions) and the app upload to app store succeeded


If you do create a set of custom icons, you can set the UIPrerenderedIcon option to true in your info.plist file and it will not add the gloss effect but it will place a black background under it and still round the image corners with these corner radii so if the corner radius on any of the icons is greater then it will show black around the edges/corners.


Edit: See comment from @devin-g-rhode and you can see that any future icon sizes should have a 1:6.4 ratio of corner radius to icon size. There is also a very good answer from which has the location of image mask files used in the SDK for rounding icon corners


To add a retina-compatible file, use the same file name and add '@2x'. So if I had a file for my 72x72 icon named icon.png, I would also add a 114x114 PNG file named [email protected] to the project/target and Xcode would automatically use that as the icon on a retina display. You can see this in action on the Summary page of the application target if you've done it right. The same works for your launch images. Use launch.png at 320x480 and [email protected] at 640x960.


After trying some of the answers in this post, I consulted with Louie Mantia (former Apple, Square, and Iconfactory designer) and all the answers so far on this post are wrong (or at least incomplete). Apple starts with the 57px icon and a radius of 10 then scales up or down from there. Thus you can calculate the radius for any icon size using 10/57 x new size (for example 10/57 x 114 gives 20, which is the proper radius for a 114px icon). Here is a list of the most commonly used icons, proper naming conventions, pixel dimensions, and corner radii.


Also, as mentioned in other answers, you don't actually want to crop any of the images you use in the binary or submit to Apple. Those should all be square and not have any transparency. Apple will automatically mask each icon in the appropriate context.


Knowing the above is important, however, for icon usage within app UI where you have to apply the mask in code, or pre-rendered in photoshop. It's also helpful when creating artwork for websites and other promotional material.


I did some tests in Photoshop CS6 and it seems as though 3 digits after the decimal point is enough precision to end up with the exact same vector (at least as displayed by Photoshop at 3200% zoom). The Round Rect Tool sometimes rounds the input to the nearest whole number, but you can see a significant difference between 90 and 89.825. And several times the Round Rectangle Tool didn't round up and actually showed multiple digits after the decimal point. Not sure what's going on there, but it's definitely using and storing the more precise number that was entered.


Anyhow, I've updated the list above to include just 3 digits after the decimal point (before there were 13!). In most situations it would probably be hard to tell the difference between a transparent 512px icon masked at a 90px radius and one masked at 89.825, but the antialiasing of the rounded corner would definitely end up slightly different and would likely be visible in certain circumstances especially if a second, more precise mask is applied by Apple, in code, or otherwise.


The best approach is not rounding the corners of your icons at all. If you set your icon as a square icon, iOS will automatically overlay the icon with a predefined mask that will set the appropriate rounded corners.


If you manually set rounded corners for your icons, they will probably look broken in this or that device, because the rounding mask happens to slightly change from an iOS version to another. Sometimes your icons will be slightly larger, sometimes (sigh) slightly smaller. Using a square icon will free you from this burden, and you will be sure to have an always up-to-date and good looking icon for your app.


This approach is valid for each icon size (iPhone/iPod/iPad/retina), and also for the iTunes artwork. I followed this approach a couple of times, and if you want I can post you a link to an app that uses native square icons.


To better understand this answer, please refer to the official Apple documentation about iOS icons. In this page it is clearly stated that a square icon will automatically get these things when displayed on an iOS device:


So, you can achieve whatever effect you want just drawing a plain square icon and filling content in it. The final corner radius will be something similar to what the other answers here are saying, but this will never be guaranteed, since those numbers are not part of the official Apple documentation on iOS. They ask you to draw square icons, so ... why not?


You don't need to apply corner radius to icons for iOS. Just provide square icons. But if you still want to know how, the actual shape is called Squircle and below is the formula:


As others have said, you don't want to round your corners. You want to ship flat (no layers or alpha) square graphics. Apple changed the mask they use for rounding your corners in iOS7 and then again in iOS8. You can find these masks inside your Xcode application bundle. The path changes with every new SDK version they release. So, I'll show you how you can always find it.


At this very moment, the path found by that command is /Applications/Xcode.app/Contents/Developer/Platforms/iPhoneSimulator.platform/Developer/SDKs/iPhoneSimulator.sdk/System/Library/PrivateFrameworks/MobileIcons.framework but don't trust that. Use the command to find it yourself.


You can use that to test your icon to see if it will look okay after it is masked. But, don't round your corners. If you do, when Apple changes those masks again, you will have artifacts.


Now, Xcode 14 automatically generates all the required app icon sizes based on a single input icon 1024x1024 pix (Single Size). However, if you need an old-school approach, choose All Sizes from dropdown menu.


What I do now is create an empty project with Xcode, set a completely white PNG file as the icon, and turn off the preset bevel & gloss. Then, I run the app and take a screenshot of the home screen. Now, you can easily create a mask from that image, which you can use in Photoshop. This will get you perfectly rounded corners.


I just downloaded the Obsidian app on the iPhone and I was wondering if there was an option to change the app icon? I think it would be cool to remove the white background and make it transparent or dark so it better matches dark theme on iPhone.


Used icons from Big Sur icon - after that screenshot, I switched to the icon from that link with a lighter background, and suspect all this really needed for me was not having harsh rgb(255,255,255) white surrounding the icon.


If the information I've provided was helpful, give us some reinforcement by clicking the Accepted Solution and Kudos buttons, that'll help us and others see that we've got the answers!

Have a great day!


Its possible that the app icon is located on a different page on the homescreen. If you see dots at the bottom of the homescreen for each page, swipe through all the pages and look for HP Smart App icon. If you don't see the icon, remove the app again, restart iPhone and then try re-installing HP Smart App. Also refer to the threads below:

3a8082e126
Reply all
Reply to author
Forward
0 new messages