Add an HTML file to your iPhone or Android home screen, like an app

ChatGPT or Claude made you a packing list, a workout timer, a budget calculator, or a small game, as one HTML file. You want it on your phone as an icon you tap, like any other app.

The Apple and Google help pages quoted here were read on November 1, 2026, and the iPhone steps were tested the same day in Apple's iPhone Simulator.

Why the saved file isn't what you add

Safari's Add to Home Screen and Chrome's shortcut both start from a website. Apple's iPhone User Guide says "Go to the website you want to add to your Home Screen" in Safari. Google's Chrome Help says "Go to the website you want to create a shortcut for." Neither describes adding a file you saved in Files or Downloads. Apple's Shortcuts app can put other kinds of icons on the Home Screen; we didn't test one that opens an HTML file.

A saved file doesn't open in a browser the way a website does, either:

• On iPhone, tapping an .html file in Files opens a Quick Look preview. In our earlier test on iOS 26.3, that preview ran none of the page's JavaScript, so a timer or a checklist doesn't respond there (how to open an HTML file on iPhone).
• On Android, Chrome can open the file, but at an address that starts with content:// and points into your own phone (how to open an HTML file on Android). We didn't test adding such an address to the home screen.

So give the file an https:// address first. Then you add it like any website: open it in the browser and add it from there. To try the file on your phone before it's online, open it in the free HTML viewer in Safari or Chrome. That shows the page once; it gives you no icon to add.

Put an HTML file on your home screen in 4 steps

1. Drop the file or paste the code

Drop the .html file in the box at the top of this page, or switch to Paste code and paste it, then click Get my preview link. You can upload 1 .html or .htm file, up to 2 MB, with no account. The preview link works 3 minutes, with scripts and forms off. It's for checking the layout, not for your home screen: an icon made from it stops opening the page after 3 minutes.

2. Keep the page and publish it

Click Keep this page — free, no card and sign up. The page moves into your account, with its scripts running. Click Publish page. Under Who can open this page?, choose Public and click Next. The first time, click Publish free. Under it, Publish without the Convika bar opens an order for Pro monthly ($12 a month, after a free 1-day trial with a card). The page goes live at an address like yourpage.convika.page. On Free, a small Convika bar sits at the bottom of the page.

3. Open the address on your phone

Copy the address from Live URL on the page's screen and send it to yourself, or click Show QR code next to it and scan the code with the phone. On iPhone and iPad, open the address in Safari. On Android, open it in Chrome.

4. Add it to the home screen

Follow the steps for your phone below. In our iPhone test, described below, the icon opened the page from its address, with its script running.

On iPhone: Safari, Share, Add to Home Screen

Apple's iPhone User Guide gives these steps:

1. Go to the Safari app and go to the website.
2. Tap the ••• button (Apple calls it Page Menu in iOS 27 and More in iOS 26), then tap Share. If your Tabs layout is Bottom or Top, tap the Share button.
3. Scroll down the list of options, then tap Add to Home Screen. "If you don't see Add to Home Screen, you can add it. Scroll down to the bottom of the list, tap Edit Actions, then tap Add to Home Screen."
4. Turn on Open as Web App, then tap Add.

Apple says that with Open as Web App on, "When you tap the icon, the website opens just like an app." Its guide adds: "The icon appears only on the device where you add it."

What we saw on iOS 26.3. We used Apple's iPhone Simulator (iPhone 17 Pro) and a test page served with the security headers of a published Free Convika page. The Share sheet showed Add to Home Screen after we expanded its list of actions. Open as Web App was already on. The icon opened the page full screen, without Safari's address bar, and the page's script ran. Our server logged a new request for the page when we tapped the icon, so it loaded from its web address.

Saved data stays in Safari. Our test page counted taps and saved the count in the browser. After 1 tap in Safari, the same page opened from the icon showed 0. A checklist that saves its ticks in the browser keeps one list in Safari and another in the icon's app, so use one of them.

On iPad: Share, View More, Add to Home Screen

Apple's iPad User Guide: "While viewing the website, tap the Share button, tap View More, then tap Add to Home Screen." Then turn on Open as Web App and tap Add. As on iPhone, the icon appears only on that iPad. We didn't test an iPad. To hand a page to a whole class instead, a link or a QR code reaches every device at once (how to open an HTML file on iPad).

On Android: Chrome, Install and create shortcut

Google's Chrome Help for Android gives 2 routes, from the menu to the right of the address bar:

• A shortcut. "To the right of the address bar, tap More > Install and create shortcut > Create shortcut." Chrome then shows a dialog where you can keep or change the name, and you tap Add. Google's tip: "Shortcuts with Chrome logo will open in Chrome."
• An installed web app. For "a website with a web app", the same menu leads to Install. Google describes a web app as one that can work "as an app" from the home screen.

A Convika page has no web app manifest (the next section explains why), so expect Create shortcut. We didn't test whether Chrome offers Install for a Convika page, or any of these steps on an Android phone or emulator. Chrome's menu names can change between versions, so follow the names on your screen.

Set the icon and the name in the HTML

To choose the icon yourself, the page's <head> needs a square PNG image. A page published as one HTML file has no separate image file, so the image goes inside the page as a data: address:

<link rel="apple-touch-icon" href="data:image/png;base64,PASTE-THE-IMAGE-DATA-HERE">
<meta name="apple-mobile-web-app-title" content="Packing">

Apple's guide for web developers names both tags. The first sets the "icon for a single webpage", and Apple lists 180 by 180 pixels for an iPhone with a Retina screen. The second sets the name under the icon; without it, "the <title> tag is used."

We tested both on a page served with the same security headers as a published Convika page. On iOS 26.3, the Add to Home Screen sheet showed our PNG from the data: address and the name from apple-mobile-web-app-title, and the icon on the home screen kept both. The image counts toward the 2 MB the file can hold.

A web app manifest, the file Chrome reads for an installed app's name and icons, doesn't work this way on Convika. A Convika page's security headers allow a manifest only from the page's own address, and one HTML file can't bring a second file. In Chromium, a manifest written into the page as a data: address was refused. We didn't test which icon Chrome on Android picks for a Convika page.

Ask the AI for the tags by uploading your square PNG with the HTML file: "Put this image inside the page as an apple-touch-icon, as a data: address, and set apple-mobile-web-app-title to Packing." Before you tap Add, check that the sheet shows your image and name.

Ways to put a page on your home screen, compared

Keep the icon working after you change the page

The icon holds the page's address. Publish a new version to the same address, and the next tap opens it.

• Change the page, not the address. Upload the edited file under Update from an HTML file on the page's screen, or type the change into Edit with AI, then click Publish. Upload an HTML file in the dashboard makes a new page with a new address, which the old icon doesn't open. For the steps, see how to update an AI-made page at the same address.
• Keep the page published. After Unpublish, or a swap that puts another page live in its place, the icon opens no page. On Free, a workspace publishes 1 page at a time.
• Mind the month's page views. Free includes 10,000 page views a month across your pages, and each time the icon loads the page counts as one. Past that, editing pauses, and 7 days later the page shows a notice that it's paused, until the month ends or you upgrade.
• Plan on a connection. The icon loads the page from its address, as our test showed. We didn't test opening it with no connection.

Frequently asked questions

Can I add an HTML file to my home screen on iPhone?

Not from Safari's Add to Home Screen: Apple's steps start from a website open in Safari, and a file in Files opens in a Quick Look preview that ran no scripts in our test. Put the file online first, for example by publishing it on Convika's Free plan, open the address in Safari, tap Share, then Add to Home Screen, and turn on Open as Web App.

How do I add a local HTML file to the home screen on Android?

Give it a web address first, then add the address from Chrome. Google's steps start from a website: tap More, then Install and create shortcut, then Create shortcut, and tap Add. A file opened from Downloads shows a content:// address that points into your own phone, and we didn't test adding one to the home screen.

Can I choose the icon for a web page I add to the home screen?

Yes, on iPhone: put a square PNG in the page's <head> as an apple-touch-icon link. On a single-file page the image goes inside the HTML as a data: address, and on iOS 26.3 the icon and the name from apple-mobile-web-app-title both showed up in our test. A web app manifest can't come from a data: address on a Convika page.

Does a page on my home screen work offline?

Don't count on it. In our iPhone test, the icon loaded the page from its web address each time, and we didn't test it without a connection. Google notes that web apps "may not work completely without an internet connection."

Will the icon still work after I change the page?

Yes, if the new version goes to the same address. On Convika, use Update from an HTML file or Edit with AI on the page's screen and click Publish. Uploading the file again with Upload an HTML file makes a new page with a new address, and the old icon won't open it.

Sources

• Turn a website into an app in Safari on iPhone (Apple) (checked November 1, 2026)
• Bookmark a website in Safari on iPhone (Apple) (checked November 1, 2026)
• Turn a website into an app in Safari on iPad (Apple) (checked November 1, 2026)
• Configuring Web Applications, Safari Web Content Guide (Apple Developer) (checked November 1, 2026)
• Create shortcuts for websites in Chrome, Android (Google Chrome Help) (checked November 1, 2026)
• Use web apps, Android (Google Chrome Help) (checked November 1, 2026)