JAVASCRIPT + HTML · ANDROID & IPHONE

Less to remember. More to enjoy.

I want a shopping list app that works on my phone.

Add items, mark them as bought and remove them. The progress bar follows your list; saved items come back when you reopen.

Download the app · HTML Download · JavaScript (.js)Get the AI prompt

What Kapsula adds

Each project has its own local storage. Marking an item can request haptic feedback.

Try it on your phone

Install Kapsula from Google Play / App Store.
Download the HTML or .js above, tap Add project and select the file. When pasting, choose the matching format: HTML or JavaScript (.js).
Tap Run. Try the actions and reopen the project to check its saved state.

No Kapsula account, developer membership or separate project build. Your projects need Pro: a 7-day trial, then a subscription or lifetime purchase. The built-in demo is free.

9:41▂▄▆ ▰

Interactive web preview. Native notifications are tested in Kapsula.

Ask AI to write your own version

Build a mobile shopping list with add, remove and bought/unbought actions, a progress bar and persistence.

Return ONE complete HTML file for Kapsula (https://kapsula.app/), with inline CSS and JavaScript, a descriptive title, no external dependencies, imports, server or Markdown fences.
Use const K = window.kapsula || null; in Kapsula await K.ready.
Save project data using await K.storage.get(key) and await K.storage.set(key, value), never localStorage in Kapsula. Preserve existing data when updating code.
Supported native bridge: app.info, storage.get/set/remove, notify.schedule/cancel/list, sound.play while open, haptics.vibrate. Do not invent camera, network or location APIs.
If using a timer, store an absolute deadline. Schedule with await K.notify.schedule({at: epochMs, title, body}) -> {id}; allow at most 16 pending notifications. Cancel with await K.notify.cancel(id). Handle errors, prevent duplicate starts and cancel a late scheduled result if needed. Browser setTimeout is not a native notification.
Use an explicit browser-preview fallback and label it: no native background notifications. Do not promise delivery after Android force-stop.
Make the UI beautiful, mobile-friendly, accessible and self-contained.

Your code defines the design

Ask your AI for a different typeface, bigger buttons or categories. Keep the saved list format compatible when updating.

Open Update code in project settings: the saved source is already in the editor. Edit it and run the update for this project. If code fails, use Copy the error for your AI, then send the error and source to your assistant yourself.

JavaScript (.js) guide and prompt →

Format and compatibility

The JavaScript file and saved-source editor require Kapsula 0.4.0. The HTML version remains compatible with 0.3.0. Both formats use the same project data and API with no external dependencies. Update the existing project to keep its records; a new project has separate storage. The web preview demonstrates the UI and actions, not notification delivery on a locked phone. For the timer, check permissions and test a short alert on your device.

Bridge API · General prompt · Verified notification walkthrough · Privacy