Overview
Screens that explain notifications and tracking before the phone's own prompt, each with a real "Not now". It comes from the Mobile onboarding and paywall kit and also works on its own. Keyboard and screen readers: Each screen is a labelled section; the primary button and Not now are plain buttons in that order. Nothing imitates the operating system's dialog: example reminders are drawn as this app's own cards and the next step is said in words. The page dots are one image with "Permission 1 of 2" as its name; focus moves to the next screen's heading. With reduced motion the example reminders appear without sliding and screens swap without movement. Built with React 19 and TypeScript, Tailwind CSS 4, Lucide icons and Motion. Light and dark themes come from CSS variables you can edit, and every demo uses believable sample data you replace with your own. Included: the component source, its sample data, light and dark theme variables, a runnable demo page, and setup guides for people and for AI coding agents.
Highlights
- Production-ready, documented source
- Clean, componentized architecture
- Drops into your stack with minimal setup
