GlassKit

Ship your Meta Ray-Ban Display app
in a weekend.

Meta gives you a glasses-app scaffold. GlassKit gives you the SaaS around it: typed 600×600 components, auth, payments, pairing, and a six-demo platform showcase you can clone and run.

GlassKit
Clerk
ConvexConvex
Stripe
Resend
ViteVite
ReactReact
TailwindTailwind
TypeScriptTypeScript
ClaudeClaude
OpenAIOpenAI
The model

Two surfaces. One identity.

Your users can't type a password or a credit card with a D-pad. So the phone is the entry point: sign up, pay, see their dashboard, tap their Display to pair it. The glasses are the experience: 600 × 600, single-screen, sensor-driven. Sign in once on the phone, approve once on the glasses; the session carries over through the shared Convex backend. No password on a D-pad.

Companion

Sign up, pay, hand off.

A Next.js 16 site on the keyboard end of your product. Owns identity and money; passes the session to the glasses.

  • Sign in & sign up
    Clerk-hosted, OAuth + email.
  • Subscribe
    Stripe Checkout via the Convex component.
  • Account dashboard
    Plan, billing history, customer portal.
  • Pair glasses
    Tap your Display on /pair; approve on the glasses. Off the same network, a typed-code fallback covers it.

Real keyboard · real OS

Glasses600 × 600
120M
Turn left · Market St
D-pad · Neural BandNo keyboard
Convex + Clerk · one session
11 modules · wired in
Vite
React
TypeScript
Tailwind
Turborepo
pnpm
Convex
Clerk
Stripe
Resend
Vercel
The math
Setup · before
Two weeks
Setup · with GlassKit
0s

The first two weeks of every project are identical wiring: Stripe, auth, AI providers, deploys, docs, billing portal. Skip them. Spend the time on the part that's actually yours.

The problem

Two weeks of identical wiring, every single project.

Without GlassKit9 todo

You wire it all yourself.

  • 01Stripe checkout sessions + webhook signatures
  • 02Customer portal for subscription management
  • 03Auth + session middleware
  • 04Real-time database setup and schema management
  • 05AI provider toggle (Anthropic / OpenAI / Llama)
  • 06Display 600×600 viewport constraints
  • 07D-pad keyboard simulator for local dev
  • 08Neural Band gesture event hooks
  • 09Transactional email + delivery webhooks
With GlassKitdone

You edit config.ts and ship.

  • 01Stripe checkout + webhook handler, wired
  • 02Customer portal: one route
  • 03Clerk auth: drop-in components
  • 04Convex backend: schema + queries colocated
  • 05AI SDK swappable with one env var
  • 06<GlassViewport> primitive: drop in
  • 07useDpad() hook: works in browser
  • 08useNeuralBand() hook: placeholder ready
  • 09Resend wired via Convex component
The stack

The setup you'd build, already built.

Production-grade integrations for the stack every web product needs. Swap your keys, ship your product.

Clerk + Stripe + Convex

Auth and payments,
already plumbed.

Clerk auth on both surfaces. Stripe Checkout, Customer Portal, and subscription webhooks running through the official Convex Stripe component. Plan entitlement updates live the moment a webhook lands, no polling. Sign in on the companion, then approve on the glasses over your network; the session carries to the glasses via the shared Convex deployment.

CheckoutWebhooksPortalEntitlementsLive sync
companion/components/checkout-button.tsx
// Authenticated checkout — Convex action + Clerk identity
import { useAction } from "convex/react";
import { api } from "@glasskit/backend/convex/_generated/api";

export function CheckoutButton({
  priceId,
  mode,
}: {
  priceId: string;
  mode: "subscription" | "payment";
}) {
  const createCheckout = useAction(api.stripe.createCheckout);

  return (
    <button onClick={async () => {
      const { url } = await createCheckout({ priceId, mode });
      if (url) window.location.href = url;
    }}>
      Subscribe
    </button>
  );
}
01

Convex backend

TypeScript-native real-time database. Reactive queries, file storage, vector search, scheduled jobs, all in one place. Free up to 1 GB and 1M function calls.

02

AI providers, swappable

Anthropic, OpenAI, Llama API wired through the Vercel AI SDK. Toggle providers with one env var. Streaming responses out of the box.

03

Production landing template

A conversion-tuned, SEO-ready landing page with Inter typography, Lighthouse-100 SEO, JSON-LD schemas, and a single config file. Swap one file to rebrand the entire site for your product. The boilerplate ships its companion as a polished template, not a placeholder.

04

Display primitives

@glasskit/glasses-ui: typed 600×600 + D-pad library. useDpad() works with arrow keys locally and Neural Band events on the glasses. Plus six SDK + AI integration showcase demos in app/src/apps/ that wire each sensor + AI primitive. Fork the one closest to your product.

05

Transactional email

Resend wired through the official Convex component: welcome emails, receipts, notifications. Auth-related mail (verify, reset, magic-link) is Clerk's job; Resend is for the transactional stuff you send yourself. Webhooks update delivery state live.

06

AI coding agent ready

Tuned AGENTS.md across every workspace + Meta's official Web Apps plugin ships pre-installed under .claude/. Clone it and Claude Code, Cursor, or Codex already know how to build for the glasses. /test-on-device, /publish-to-vercel, and /qr-code are live on day one.

Showcase

Six demos. One platform.

The vite app ships as a launcher with all six demos behind it. Clone, run, sign in once on the companion, and walk through every sensor + AI composition the platform supports. Cherry-pick the demo closest to your product, copy the file, rewrite the prompt and visuals. Design notes for each pattern live in docs/recipes/.

  1. 01

    AI Wayfinder· Ask for a place. Get walked there.

    GPS · Orientation · AI
  2. 02

    AI Tour Guide· Walk a city, hear its history.

    GPS · Orientation · AI
  3. 03

    AI Running Coach· Coach on your wrist and in your view.

    Motion · GPS · AI
  4. 04

    AI Sous-Chef· Cook with both hands free.

    Neural Band · AI · Storage
  5. 05

    AI Presentation Coach· Rehearse it, then deliver it.

    Neural Band · AI · Storage
  6. 06

    AI Trail Companion· Hike smarter, not blinder.

    GPS · Motion · AI

The showcase isn't your product. It's the proof that every primitive works. Pick one demo, fork it, replace the screen specifics and the AI prompt for your use case. The recipes name the adapt-and-ship steps.

License

Pay once. Build unlimited apps.

01 · IndieMost popular

Maker

For indie makers shipping their own apps

$299$449
One-time · Yours to keep
  • Production landing template: SEO + conversion-tuned, swap one config to rebrand
  • @glasskit/glasses-ui: the typed 600×600 + D-pad library
  • The complete monorepo: glasses app, companion, backend
  • Three opt-in add-ons (Payments / Email / AI Showcase): clone, sign in, deploy. Add billing when you're ready.
  • Six SDK + AI integration showcase demos to fork from
  • AI-driven first-time setup: point Claude Code / Cursor / Codex at AGENTS.md, ship in 20 min
  • License for unlimited products · Private Discord · priority support
  • $50 GlassKit Studio credit: coming soon (our pay-as-you-go AI app builder)
Get Maker · $299
02 · Studio

Agency

For agencies building for clients

$1299$1799
One-time · Yours to keep
  • Everything in Maker
  • White-label rights: ship under your client's brand
  • License for unlimited client projects
Get Agency · $1299

Global VAT handled · Customer Discord role

Questions

Questions,
answered.

Anything missing? DM @JarJarMadeIt on X. Paying developers also get a Maker or Agency role (depending on tier) unlocking the private customer Discord on purchase.

Ship

Ready to ship.

The Meta Ray-Ban Display platform is new. Be the team that ships first in a category that will have thousands of apps by the end of the year. Or wait until everyone else has shipped.