WEBLEB
Inicio
Editora de código
Iniciar sesión
Pro
Español
English
Français
Español
Português
Deutsch
Italiano
हिंदी
convertir texto a voz
1414
kuzma
Abrir en el editor
Publica tu código
Recomendado
25 September 2025
Diseño de tarjeta CSS con fondo degradado
16 October 2025
Ejemplo de elemento de carga animado CSS
8 June 2025
Un código de alejandrokundrah
HTML
Copy
Text to Speech
Speak
CSS
Copy
<style> body { font-family: Arial, sans-serif; background-color: #f0f0f0; display: flex; justify-content: center; align-items: center; height: 100vh; margin: 0; } div { background-color: #fff; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); } input[type="text"] { width: 92%; height: 40px; margin-bottom: 10px; padding: 10px; font-size: 16px; border: 1px solid #ddd; border-radius: 5px; } button { font-weight: 600; width: 100%; height: 25px; font-size: 16px; background-color: #299893; color: #fff; border: none; border-radius: 5px; cursor: pointer; } button:hover { background-color: #299893; } </style>
JS
Copy
<script> function speak(){ var text = document.getElementById("input").value.trim(); if (text !== "") { var utterance = new SpeechSynthesisUtterance(text); speechSynthesis.speak(utterance); } else { alert("Please enter some text"); } } </script>