За иконку на домашнем экране iPhone отвечает отдельный тег apple-touch-icon в head страницы, а не обычный favicon вкладки браузера. Нужна картинка 180 на 180 пикселей в формате PNG без прозрачного фона: iOS сама скругляет углы и добавляет тень, а прозрачные места на исходнике превращаются в чёрные пятна. Без этого тега система подставляет автоматический скриншот страницы, и получается ровно то, что вы описали.
Тег выглядит так: `<link rel="apple-touch-icon" href="/apple-touch-icon.png">`. Картинку кладут в корень сайта или в папку с изображениями и прописывают путь в head. Если делаете иконку с нуля, начните с логотипа или знака компании на сплошном фоне - мелкая деталь на белом полупрозрачном фоне на маленьком экране превращается в кашу из пикселей.
Отдельно от apple-touch-icon работает обычный favicon - маленькая иконка вкладки в браузере, обычно favicon.ico или favicon.svg. Это два разных файла и два разных тега, один не заменяет другой: favicon видно во вкладке на компьютере, apple-touch-icon только на домашнем экране телефона после добавления сайта.
Если сайт собран в конструкторе, ищите в настройках отдельное поле именно для иконки iOS или apple touch icon - оно не всегда рядом с обычным favicon. Если такого поля нет вовсе, а конструктор позволяет вставить произвольный код в head, тег можно добавить туда руками. На кастомной вёрстке это одна строка, которую разработчик прописывает один раз при сдаче сайта.
Проверить результат просто: откройте сайт в Safari на айфоне, нажмите "Поделиться" и выберите "На экран Домой". Если иконка настроена правильно, на рабочем столе появится ваша картинка со скруглёнными углами, а не обрезок страницы.