Customize look and voice, copy the embed snippet, and ship a natural-speaking 3D avatar on your marketing site, in-app WebViews, or campaign pages. Usage and API keys are visible in the console so delivery and ops stay straightforward.
- Three embed modes
- iframe · Web Component · JS SDK
- Voice & lips
- TTS + blendshapes
- Productized delivery
- Projects · keys · usage metering
TRUSTED USE CASES
Project isolation, API keys, and usage dashboards make it easy to bolt on an avatar presentation layer beside existing systems—without replacing your chat or business logic.
Built for scaled delivery
From assets and voices to embeds and usage tracking, the platform covers the path from trial to production for B2B teams.
One snippet, consistent everywhere
After you configure in the console, paste the embed fragment into existing pages to load the 3D avatar and chat UI—no need to rebuild your frontend architecture.
TTS + lip sync that performs your content
Drive speech and lip sync from text; or align lips to your own audio for narration, training, and brand storytelling.
Transparent usage at a glance
Metered on TTS characters, lip-sync duration, and related signals—with clear usage views in the console so ops and content teams stay aligned.
API keys isolated per project
Each avatar project has its own keys and settings for multi-tenant and multi-environment deployments, reducing misuse and leakage risk.
Typical scenarios
From “content is ready” to “the avatar performs it”—ideal when you already have scripts, courses, or broadcast copy.
Training & course delivery
Challenge · Long docs and recorded lessons struggle to hold attention; learners need a more natural pacing.
Approach · Hand finalized scripts to the platform for TTS + lip sync, embed the avatar inside lesson pages alongside your existing LMS.
Suggested integration: iframe / Web Component
Marketing & campaign pages
Challenge · Campaign pages need on-brand narration and guidance without maintaining many separate video assets.
Approach · Configure look and voice in the console; when copy changes, regenerate voiceovers and embed on landing pages—switch languages or variants when supported.
Suggested integration: JS SDK · iframe
Three ways to integrate—pick one
Same avatar capabilities; choose the path that fits your stack and release cadence.
- Low touch01
iframe embed
Fastest to validate: drop the hosted URL, communicate with the host page via postMessage—great for campaigns and support widgets.
- Composable02
Web Component
Declarative custom elements that align more easily with your site’s layout and design system—ideal for long-lived brand sites.
- Programmable03
JavaScript SDK
Initialize in code, subscribe to events, and wire in business logic—best for product teams that need deep customization.
Developers
Each project has its own API key; embed URLs and domain allowlists are configured in the console. Minimal JS SDK example below (replace the placeholder URL with your host).
<!-- 1. Load the SDK -->
<script type="module" src="https://embed.avataraisdk.com/sdk.js"></script>
<!-- 2. Initialize (copy apiKey from the console) -->
<script type="module">
const widget = AIAvatar.init({
agentId: 'YOUR_AGENT_ID',
apiKey: 'YOUR_API_KEY',
behavior: { llmMode: 'external' },
// Route A: your LLM returns text, we do TTS + lip-sync
onUserInput: async (msg) => {
const reply = await myCustomerLLM(msg.content);
widget.replyText(reply);
},
});
</script>Web Component and JS SDK setup—see documentation.
From setup to launch in four steps
A self-serve flow that cuts handoffs so teams can focus on content and operations.
- 1
Sign up & create a project
Create an avatar project in the console—the container for look, voice, and keys.
- 2
Configure look & voice
Pick from the asset library or upload resources to match your scenario.
- 3
Copy the embed snippet
Choose iframe, Web Component, or SDK init based on your site’s stack.
- 4
Ship & observe
After launch, monitor usage and keys; adjust project configuration as needed.
Frequently asked
The questions we hear most often about the free phase, data handling, and supported environments.
How long will the limited-time free phase last?
No hard end date yet. We're focused on polishing the product first. When paid plans launch, we'll notify all registered users at least 30 days in advance via the console and website — no surprise cutover.Are the avatars, API keys, and usage records from this phase preserved?
Yes, fully. All projects, look/voice configurations, API keys, and historical usage created during the free phase remain available in the paid version — no need to re-create or migrate.What will the paid pricing look like?
Metered on TTS characters and lip-sync seconds, with monthly plan quotas and top-up packs. We don't plan to charge for console-side actions like creating projects or copying embed snippets. Exact pricing will be announced before launch — no numbers committed right now.Are there usage limits during the free phase?
There are soft per-account fair-use ceilings to prevent abuse and runaway consumption. Typical workloads won't hit them. If you expect a spike (e.g. a campaign day with >5k calls), email us in advance and we'll raise your limit manually.Which browsers and environments are supported?
Latest two major versions of Chrome / Edge / Safari / Firefox on desktop; iOS Safari and Android Chrome on mobile. The embedded 3D avatar requires WebGL 2.0 — very old devices may fall back to a static image.Can I install on WordPress, Shopify, Webflow, Wix, or Squarespace?
Yes. WordPress and Shopify have dedicated integrations (WordPress plugin and Shopify Theme App Extension). For Webflow, Squarespace, Ghost, Wix, or plain static HTML, paste the SDK snippet from the console — 1–3 minutes per platform, no coding required. Step-by-step guides live in the console's integration docs.Can I embed it in WeChat official accounts, mini programs, or app WebViews?
WeChat article bodies don't allow iframes or Web Components, so direct embedding isn't possible there. Mini programs can use web-view pointing to your own domain where the SDK works. App WebViews are supported as long as they allow JavaScript and WebGL.
Ready to put the avatar in front of your users?
Open the console to create your first project and get a testable embed preview and API key in minutes.
Go to console