Your first component in 5 minutes

1 · Create your Morphis account

Sign up at getmorphis.com/auth/register. The free tier includes 1,000 generations per month and unlimited sandboxed renders — no credit card required.

2 · Generate an API key

After logging in, open Dashboard → API Keys → Generate key. Morphis shows the plaintext key exactly once — copy it immediately and store it like a password. We only persist the SHA-256 hash; if you lose the key, you can always revoke it and generate a new one.

3 · Make your first call

The simplest possible integration is one script tag on any webpage:

<div id="widget"></div>

<script src="https://getmorphis.com/sdk/morphis.js"></script>
<script>
  Morphis.render({
    apiKey: 'mph_live_paste_your_key_here',
    intent: 'show a churn-risk summary table',
    contextData: { customers: 12, churn: 2.4, mrr: 5400 },
    target: '#widget',
    theme: 'light'
  })
</script>

Reload the page. Within about two seconds you'll see a rendered, sandboxed component containing a churn table built from your context data.

4 · Understand the response

The raw API returns a JSON envelope so you can also drive renderings yourself:

{
  "html": "<!DOCTYPE html><html>…</html>",
  "css": "…",
  "metadata": {
    "generationTime": 1840,
    "tokensUsed": 1240,
    "sanitized": true,
    "model": "openai/gpt-oss-120b",
    "source": "llm"
  }
}

• html — Safe, scoped markup ready to drop into a sandbox="allow-scripts" iframe.
• metadata.generationTime — Wall-clock time on our side.
• metadata.tokensUsed — LLM tokens billed against your plan.
• metadata.source — llm for live generation, fallback if the local template engine kicked in.

Next steps