Demo TTS de ElevenLabs en HTML único – Prompt de ejemplo con IA
VISTA DE CÓDIGO
Prompt
Create a single-file HTML page that demonstrates ElevenLabs Text-to-Speech API. The page should have: a textarea for input, a voice selector (predefined voice IDs), a 'Speak' button, and a playback/stop control. Use the free-tier API key from ElevenLabs. Show loading state during synthesis. Use a clean modern UI with Tailwind CSS (via CDN). Include error handling. The page title should be 'ElevenLabs TTS Demo'.
この単一HTMLファイルで、ElevenLabsの音声合成をブラウザで体験できます。日本語テキストを入力し、3つの声（Rachel、Bella、Patrick）から選択、「再生」ボタンを押すだけで合成音声がAPIからストリーミングされ、すぐに再生されます。Tailwind CSSでダークモダンなUIに。ローディング表示、エラーハンドリング、停止機能も搭載。APIキーのプレースホルダーを自身の無料キーに変更してお試しください。
Resumen del prompt
Con este único archivo HTML, puedes experimentar la síntesis de voz de ElevenLabs directamente en tu navegador. Simplemente ingresa texto en japonés, selecciona una de las tres voces (Rachel, Bella o Patrick) y presiona el botón "Reproducir" para que el audio sintetizado se transmita desde la API y se reproduzca al instante. La interfaz de usuario tiene un diseño oscuro y moderno gracias a Tailwind CSS. También incluye indicadores de carga, manejo de errores y función de detención. Cambia el marcador de posición de la clave API por tu propia clave gratuita para probarlo.
¿Te resultó útil este prompt?
Comentarios
Los comentarios aparecen después de la moderación
この記事が役に立ったら投げ銭で応援
Apple Pay / Google Pay / カード (Visa/Mastercard/JCB/Amex) / Link / Alipay / WeChat Pay 対応 · Stripeで安全に決済
開発者が選ぶ最強ツール集
運営者が毎日使っているツール・ガジェット 6選