Web Component

Embed Liforma in any framework with a single HTML tag.

Overview

The <liforma-experience> web component works in React, Vue, Angular, plain HTML, and no-code tools that support custom elements.

Basic usage

index.html
<script src="https://cdn.liforma.ai/sdk/v1/client.js"><\/script>

<liforma-experience experience-id="exp_01DEMO1SPANISHCAFE"></liforma-experience>

Attributes

AttributeDescription
experience-idPublic experience ID
session-endpointSame-origin route for authenticated minting

React example

function Avatar() {
  return (
    <liforma-experience
      experience-id="exp_01DEMO1SPANISHCAFE"
      style={{ width: '400px', height: '600px', display: 'block' }}
    />
  );
}

ElevenLabs compat element

For migrations, a compat element is also available:

<liforma-convai agent-id="YOUR_AGENT_ID"></liforma-convai>

See Migrate from ElevenLabs.