Live demo

Connect to OpenRouter

This demo streams an LLM's response into <aktion-app>. Pick a mode, ask for any UI, and watch a complete interface render in real time. There is no backend: this page is static and your browser calls OpenRouter directly with a key you supply.

Need one? Grab a free key from openrouter.ai.
Any chat-completion model your key has access to.
Browse demos
  • Four generation modes
  • Live, streaming UI
  • Open in playground
  • Export as standalone HTML
How this demo works, and what happens to your key

The four modes

Every mode sends the same generated system prompt with a different scope. Switch between them with the tabs above the chat.

  • Chat · Compact — ask it a question, not for an app. It answers the way any assistant would, but emits the answer as components instead of Markdown: headings and prose become Heading/Markdown, a comparison becomes a Table, a trend becomes a chart, a caveat becomes a Callout. Read-only — no state, actions, or network calls — and by far the cheapest prompt (~40k characters against ~255k for the others).
  • Chat · Full — the whole language, so the reply can be interactive: reactive state, actions, $http, routing.
  • Website Builder — full language, asked for a navbar above stacked marketing sections rather than a dashboard shell.
  • App Builder — full language, asked for an app shell with a sidebar, routes, wired actions, and realistic seed rows.

Guide → Generation modes gives the exact getSystemPrompt() call and prompt size behind each one.

Where your key goes

  • Saved in this origin's localStorage, under aktion.chat.openrouter-key, so a reload keeps you connected.
  • Sent as an Authorization header on the only network request this page makes: POST https://openrouter.ai/api/v1/chat/completions. There is no other destination — there is no server on our side.
  • Settings → Reset key deletes it; so does clearing site data for this origin.
  • Use a key you can revoke. localStorage is not a secret store: any script on this origin can read it, and it persists until you remove it.

What each request carries

The active mode's system prompt, your message, the last few turns (Settings → History size, five by default), and any images or PDFs you attach. OpenRouter also receives this page's URL as HTTP-Referer and X-Title: Aktion chat bot for traffic attribution. Export chat writes the transcript, model, theme, and mode — never the key.