Mesh Avatar Studio

mesh-avatar-element

HTML の埋め込みを試す

表情や口パクを試したり、自分のアバターを表示したりできます。src を省くと、https://shinshin86.github.io/mesh-avatar-studio/miko.mavatar から Miko を読み込みます。

自分のページに埋め込む HTML

<script type="module" src="https://cdn.jsdelivr.net/npm/mesh-avatar-element@0/dist/standalone.js"></script>
<mesh-avatar></mesh-avatar>
使い方を見る（英語） ↗

Miko

読み込み中…

アバターの操作

表情

HTML

<mesh-avatar></mesh-avatar>

JavaScript

文章で口を動かす

口の動きだけを試せます。音声は流れません。

JavaScript

const el = document.querySelector('mesh-avatar');
el.speak('こんにちは');

自分の .mavatar を表示

選択中: Miko

ファイルはブラウザ内で読み込み、外部には送信しません。

HTML

<mesh-avatar src="/path/to/your-avatar.mavatar"></mesh-avatar>

自分のサイトに置いたファイルのパスか URL を src に指定してください。