Código a imagen
Pega un fragmento de código, elige uno de los cuatro temas incluidos, ajusta colores, tamaño de fuente, relleno, cabecera opcional y números de línea, y descarga un PNG renderizado desde un canvas del navegador. La herramienta dibuja texto plano: sirve para imágenes limpias de código, pero no analiza lenguajes ni aplica resaltado de sintaxis.
Cómo crear un PNG de código
-
1
Pega el fragmento
Usa el cuadro de código para JavaScript, HTML, CSS, JSON, comandos de shell o cualquier otro texto plano. El renderizador conserva hasta las primeras 400 líneas.
-
2
Define el aspecto
Elige Oscuro, Claro, Dracula o Solarized, y ajusta título, tamaño de fuente, relleno, fondo, texto y color de acento.
-
3
Revisa el canvas
El navegador dibuja cada línea como texto de canvas, con cabecera de ventana y números de línea opcionales. Las líneas largas pueden ensanchar el canvas hasta el máximo integrado.
-
4
Descarga el PNG
Exporta el canvas actual como imagen PNG para documentación, notas, diapositivas o publicaciones. No incluye exportación SVG, JPEG ni HTML.
Qué hace el renderizador
| Control | Qué puedes cambiar | Notas |
|---|---|---|
| Tema | Oscuro, Claro, Dracula, Solarized | Cada tema establece los colores iniciales de fondo, texto y acento. |
| Estilo del texto | Título, tamaño de fuente, relleno | La fuente está limitada a 10–40 px y el relleno a 20–200 px. |
| Colores | Fondo, texto, acento | El color de acento se usa para los números de línea. |
| Cabecera | Cabecera estilo ventana activada o desactivada | El título aparece en la cabecera cuando está activa. |
| Números de línea | Mostrar u ocultar | Los números se dibujan como texto plano en el canvas. |
| Exportación | Descarga PNG | El botón de descarga guarda el canvas actual como imagen PNG. |
Límites prácticos
- El navegador dibuja el fragmento como texto plano con la API Canvas. No detecta JavaScript, Python, HTML ni ningún otro lenguaje.
- La vista previa usa las primeras 400 líneas para evitar que archivos muy grandes bloqueen la página.
- El ancho del canvas se mantiene entre 420 px y 2200 px. Las líneas muy largas pueden alcanzar el ancho máximo.
- La versión de dos pasos guarda tus entradas en
sessionStoragepara la pestaña actual mientras pasas de edición a descarga.
Nota de accesibilidad
El código dentro de una imagen no se puede buscar, copiar ni leer con lectores de pantalla. Usa el PNG como apoyo visual y conserva el fragmento real cerca en texto seleccionable cuando publiques documentación, tutoriales o informes de errores.
Preguntas frecuentes
No. Dibuja exactamente el texto que pegas sobre un canvas. Puedes cambiar colores y temas, pero no hay selector de lenguaje ni analizador de sintaxis.
El menú incluye Oscuro, Claro, Dracula y Solarized. Después de elegir un tema puedes sobrescribir fondo, texto y color de acento.
No. La salida es una descarga PNG creada desde el canvas. No hay exportación SVG, JPEG ni copiar como HTML.
La vista previa dibuja las primeras 400 líneas para mantener el navegador ágil. Para publicar imágenes, suele ser mejor recortar a las pocas líneas que explican la idea.
Herramientas relacionadas
Referencia de la tabla ASCII
Tabla ASCII completa del 0 al 127 con decimal, hex, octal, binario y referencia numérica HTML para cada carácter, incluidos los códigos de control como NUL, LF y DEL.
Generador de letras aleatorias
Genera letras aleatorias A-Z. Elige la cantidad, usa mayúsculas, minúsculas o mezcla de ambas, y aplica el resultado en juegos, consignas o clase.
Referencia de caracteres HTML
Lista buscable de entidades HTML, sus códigos nombrados y numéricos, y una copia con un clic para caracteres y símbolos especiales.
Formateador de JSON
Pega JSON para verlo con sangría de 2 o 4 espacios, minificarlo en una salida compacta o comprobar rápidamente la sintaxis antes de copiar el resultado.
Simplificador de Álgebra Booleana
Evalúa una expresión booleana para cada combinación de entradas y muestra la tabla de verdad completa. Admite hasta cinco variables y los operadores &, |, ! y ^.
Referencia de atajos de teclado
Busca los atajos predeterminados documentados de VS Code, Chrome y Bash con GNU Readline en macOS, Windows y Linux.