Pro Camera app template

Native camera under your HTML controls: flip, flash, timer, grid, gallery save and share.

MediaWorks offline4 phone features

This is the template running live. Phone features such as the camera, vibration and notifications work in the app you build.

Phone features this template uses

These come from the FreeApp JavaScript bridge that every app built with Free HTML to APK includes. In a normal browser the template still runs, and the calls simply do nothing.

Camera

FreeApp.camera.start() FreeApp.camera.capture() FreeApp.camera.switch()

Save to gallery

FreeApp.saveToGallery()

Saves an image to Photos.

Share files

FreeApp.shareFile()

Share a real file.

Toast messages

FreeApp.toast()

Short native toast.

How the template calls them

await FreeApp.camera.start({ facing: 'back', behind: true }); // body { background: transparent }
const photo = await FreeApp.camera.capture({ maxSize: 2048 });
img.src = photo.dataUrl;

Make it yours with AI

Copy this prompt into ChatGPT, Gemini or Claude, change the idea to yours, and paste the answer back into the editor. It already explains the app shell and the phone features to the AI.

Show the AI prompt

Build a single-file mobile web app (index.html with inline CSS/JS) for Android WebView.

The app: Pro Camera — a full-screen camera app whose shutter, flip, flash, timer and grid buttons are HTML drawn over the native preview. Native camera under your HTML controls: flip, flash, timer, grid, gallery save and share.

Requirements:
- Mobile-first, touch-friendly UI (min 44px tap targets), works in portrait, supports light and dark mode.
- Use <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover"> and pad for env(safe-area-inset-*).
- Must work fully offline: no CDN or external scripts, fonts or images; persist data in localStorage.

The page runs inside an Android app that injects a native bridge as window.FreeApp. Available APIs:
- FreeApp.camera.start(opts?: {facing?: 'back' | 'front', element?: string | Element /* place the preview over this element */, behind?: boolean /* draw under a transparent page so HTML controls float on top */}): Promise<{facing}>
- FreeApp.camera.capture(opts?: {maxSize?: number, quality?: number, mirror?: boolean}): Promise<{dataUrl, facing}> — still photo from the running preview
- FreeApp.camera.switch(): Promise<{facing}>; FreeApp.camera.torch(on: boolean): boolean; FreeApp.camera.stop(): void; FreeApp.camera.isOpen(): boolean
- FreeApp.saveToGallery(dataUrl: string, fileName?: string): Promise<{uri}> — saves an image to Photos
- FreeApp.shareFile(fileName: string, mimeType: string, base64OrDataUrl: string): boolean — share a real file
- FreeApp.toast(message: string): void — short native toast

Rules for the bridge:
- Always guard calls with `window.FreeApp &&` (or `if (window.FreeApp) { … }`) and provide a browser fallback so the page also works in a normal browser.
- The bridge may be injected after your script runs: do native setup inside `window.addEventListener('freeappready', …)` and also run it immediately if window.FreeApp already exists.
- Do not use alert/confirm for normal feedback; prefer FreeApp.toast when available.

Return the complete index.html in one code block.

My idea: [DESCRIBE YOUR APP IDEA HERE]

Turn it into an Android app

Tap Edit & build online. The template opens in the online editor.
Change the text, colors and code, then pick an app name, an icon and a package name.
Build. You get a signed APK to install and an AAB for Google Play, free, with no account and no watermark.

✏️ Edit & build online GET IT FREE ONGoogle Play