Create glance-friendly packs for smartglasses

GFpack helps you compose short, ultra-readable frames for wearable displays. It’s fast, offline, and privacy-first — export video or PNG sequences in seconds.

Offline No sign-in WCAG contrast meter Ray-Ban preset

What you can make

  • High-contrast HUD text with safe-area guides
  • Multi-frame sequences with precise timing
  • Exports: MP4/WebM, ZIP of PNGs, GFpack JSON
  • Works entirely in your browser (service worker caches assets)
Supported & tested environments

Desktop: Chrome, Edge, Brave, Firefox, Safari

Android: Chrome/Edge/Brave (native “Install”), Samsung Internet (Add to Home screen), Firefox (Add to Home screen)

iOS/iPadOS: Safari — use Share → Add to Home Screen

Features

World-class readability

High-contrast styles, outline strokes, and a live WCAG contrast meter tuned for glance targets (7:1).

Device presets & safe-areas

Start with Meta Ray-Ban Display (600×400) and visualize safe-area overlays instantly.

Precision timing

Per-frame duration in ms, keyboard nudges [/], and quick preview P.

Export everything

MP4/WebM recording via MediaRecorder, plus ZIP of PNG frames and JSON pack for re-editing.

Offline & private

Service worker caching — your content stays on device. No telemetry. No login. No cloud.

Thoughtful controls

Reorder, duplicate, delete, and labeled inputs that work smoothly on iOS/Android & desktop.

How it works

Pick device & viewport

Select a device preset (e.g., Ray-Ban) or set width/height manually. Toggle safe-area outlines.

Choose a style

Start with Contrast / Daylight / Paper. Colors and outlines are tuned for legibility.

Compose frames

Type your text, set duration (ms), then duplicate/reorder with one click. Keyboard: ⌘/Ctrl+D duplicate, ⌥/Alt+↑↓ move.

Preview

Press Preview or P. The canvas renders each frame for the specified duration.

Export

Record to MP4/WebM, save PNG sequence as a ZIP, or download the pack JSON for later edits.

Install (optional)

Install GFpack to run full-screen and offline — see platform steps below.

Install

Click Install for supported browsers, or use the manual steps:

Open the App
Android — Chrome / Edge / Brave
  • Open the site → tap Install app (or Add to Home screen).
  • You may also see an Install icon in the address bar — tap it.
Android — Samsung Internet
  • Tap Add to Home screen.
Android — Firefox
  • Use ⋮ → Add to Home screen. (Firefox doesn’t show the PWA install prompt.)
  • This creates a launcher; it opens in Firefox. Offline works after caching.
iOS / iPadOS — Safari
  • Tap the Share icon → Add to Home Screen.
  • Launch from your Home Screen for a full-screen experience.
Desktop — Chrome / Edge / Brave
  • Click the Install icon in the address bar, or menu → Install.
Desktop — Firefox
  • Firefox doesn’t expose the PWA prompt. Use the app in the browser or pin it.

Quality & roadmap

Shipped

  • Pixel-accurate canvas with safe-area overlay
  • Accessible, labeled editor (desktop & mobile)
  • WCAG contrast meter tuned for 7:1 targets
  • Zero-dependency ZIP builder for PNG exports
  • MediaRecorder pipeline with MP4/WebM selection

Planned

  • Autosave to local storage + Undo/Redo
  • Additional presets (monospace, condensed, numerals)
  • Fit-to-safe-area and smarter line wrapping
  • Custom fonts (WOFF2) with fallback
  • Shareable pack links (encoded JSON)

FAQ

Does it work offline?

Yes. After first load, the service worker caches assets so you can work offline. Exports are generated on-device.

Where is my data stored?

Everything stays in your browser unless you export a file. No servers, no analytics.

What formats are supported?

MP4/WebM (browser-dependent), ZIP of PNGs, and GFpack JSON.

Why don’t I see “Install”?

Some browsers (e.g., Firefox) don’t expose the prompt. Use “Add to Home Screen” or run in the browser.