HTML Playground
Editor HTML/CSS/JS en vivo con vista previa mediante un iframe en sandbox. Guarda automáticamente en localStorage. Se ejecuta completamente en el cliente.
La vista previa se actualiza automáticamente 300ms después de que dejas de escribir.
Vista previa
Cómo usar
- 1 Edita cualquiera de los paneles — HTML, CSS o JS. La vista previa se actualizará 300ms después de que dejes de escribir.
- 2 Guarda el fragmento (snippet) para conservar tu trabajo en localStorage y recuperarlo en tu próxima visita.
- 3 Pulsa Reiniciar para volver a cargar el ejemplo de muestra.
Por qué usar esta herramienta
- Tres paneles de edición — HTML, CSS, JS — conectados a un único iframe de vista previa en vivo.
- El fragmento se guarda mediante localStorage — cierra la pestaña, vuelve más tarde y tu código seguirá ahí.
- El iframe está en sandbox (solo allow-scripts) — el JS puede ejecutarse, pero no puede acceder al origen de la página de herramientas.
- Se ejecuta completamente en el cliente — sin idas y vueltas al servidor cada vez que pulsas una tecla.
Preguntas frecuentes
¿Puedo importar librerías externas?
Sí — agrega una etiqueta <code class="font-mono text-xs"><script src="https://…"></code> dentro del panel de HTML. El iframe las cargará en la próxima reconstrucción de la vista previa.
¿El iframe está en sandbox?
Sí — configuramos <code class="font-mono text-xs">sandbox="allow-scripts"</code> y omitimos intencionalmente <code class="font-mono text-xs">allow-same-origin</code>, de modo que la vista previa no puede leer esta página ni su almacenamiento.
¿Dónde se guarda mi trabajo?
Solo se guarda en el <code class="font-mono text-xs">localStorage</code> del navegador cuando pulsas Guardar. No se envía nada a un servidor.
¿Qué es HTML Playground?
HTML Playground es una herramienta que permite editar HTML, CSS y JavaScript al mismo tiempo, renderizando el resultado en directo dentro de un iframe en sandbox. La herramienta guarda automáticamente tu trabajo en el localStorage del navegador, de modo que el código se mantiene entre sesiones. Al ejecutarse completamente en el cliente, todo ocurre en el propio navegador sin que nada se envíe a un servidor, creando un espacio privado para probar fragmentos de frontend.
HTML Playground es una utilidad desarrollo gratuita de Zerethon Tools. Editor HTML/CSS/JS en vivo con vista previa mediante un iframe en sandbox. Guarda automáticamente en localStorage. Se ejecuta completamente en el cliente. Funciona totalmente en el navegador — sin registro, sin subida de archivos.
- Categoría
- Desarrollo
- Precio
- Gratis
- Privacidad
- Basado en el navegador
- Registro
- No necesario
Privacidad
Tus datos nunca salen de tu navegador, salvo que se indique explícitamente. HTML Playground funciona completamente del lado del cliente — sin subida a servidor, sin registro de actividad, sin seguimiento de tu contenido.
Herramientas relacionadas
Formateador de JSON
Formatea, valida y minifica JSON en línea. Gratis, sin necesidad de registro — tus datos nunca salen de tu navegador.
Abrir herramientaFormateador de SQL
Formatea consultas SQL en línea — embellece el código para MySQL, PostgreSQL, SQLite, SQL Server, Oracle y BigQuery.
Abrir herramientaGenerador de UUID
Genera UUID en línea — v1, v4, v7 y Nil. Genera hasta 10.000 en lote. Gratis, sin registro.
Abrir herramientaGenerador de contraseñas
Genera contraseñas aleatorias fuertes y criptográficamente seguras. Personaliza la longitud y los conjuntos de caracteres — todo se ejecuta en tu navegador.
Abrir herramientaCrea, comparte y crece en Zerethon Social
Registro gratuito. Gana puntos, colecciona logros y conecta con creadores de todo el mundo.