Captura de código como imagen
Code Screenshot
Convierte un fragmento de código en una imagen con resaltado de sintaxis, marco de ventana y el tema que elijas.
Convierte un fragmento de código en un PNG que puedes poner en una diapositiva, un issue o una publicación: con resaltado de sintaxis, en un marco de ventana, a la escala de exportación que elijas. Se dibuja en un canvas aquí; nada se sube y no se carga ningún resaltador externo.
Código
Vista previa
Qué hace esta herramienta
- · El resaltado de sintaxis sale de los tokenizadores que usan los formateadores de este sitio (JavaScript, TypeScript, CSS, HTML, SQL) más otros pequeños escritos aquí (JSON, Python, Go, Rust, Shell). No se carga ningún resaltador externo.
- · El texto se dibuja directamente sobre un lienzo con la tipografía monoespaciada que tenga tu dispositivo. El coreano cae en una fuente coreana del sistema, así que se ve como texto y no como cuadros, y el coreano y los emojis cuentan como dos celdas al ajustar líneas. Las tipografías cambian de un dispositivo a otro, así que el mismo código se ve algo distinto en cada uno.
- · Los PNG se generan a 1×, 2× y 3×, y no se sube nada.
Para que el PNG pese menos, usa la compresión PNG; para meterlo en un marco de dispositivo, usa el mockup de dispositivo.
Cómo se usa
Pega el código
El lenguaje se detecta, y puedes cambiarlo. El resaltado usa los mismos tokenizadores que los formateadores de este sitio para JS, TS, CSS, HTML y SQL, más otros pequeños para JSON, Python, Go, Rust y Shell.
Ajusta el marco
Tema, tamaño de fuente, relleno, un título de ventana, semáforos o ninguno, números de línea, una sombra. La vista previa es la exportación a 1×.
Elige un ancho de ajuste para las líneas largas
Los emojis y los caracteres CJK cuentan como dos celdas al ajustar, como los cuenta una terminal, así que una línea con escrituras mezcladas se parte donde parece que debería.
Exporta a 2× para cualquier sitio donde se vaya a redimensionar
1× para un blog de ancho fijo, 2× para diapositivas y pantallas retina, 3× cuando se va a ampliar. O copia la imagen directamente al portapapeles.
Preguntas frecuentes
¿Por qué se ve distinto en mi otra computadora?
Porque el texto se dibuja con la fuente monoespaciada que tiene ese dispositivo, y no hay dos máquinas con exactamente la misma. Los emojis y los caracteres CJK en particular caen en la fuente del sistema que esté instalada. La contrapartida es que no se descarga nada y el renderizado es instantáneo.
¿Puedo obtener un SVG?
No, solo PNG. Un SVG necesitaría la fuente incrustada para verse igual en todas partes, e incrustar una fuente con emojis o CJK son megabytes. Un PNG a 2× es más pequeño y se renderiza idéntico en todas partes.
¿Debería publicar siquiera una captura de código?
Para una diapositiva o una publicación en redes, sí. Para un informe de error o un pull request, pega el texto: una imagen no se puede buscar, copiar, comparar ni leer con un lector de pantalla. Esta herramienta es para el primer caso.
Puede recibir de
Formateador y minificador de JavaScript
JavaScript Beautifier & Minifier
Quita comentarios y espacios de JavaScript o TypeScript sin renombrar nada, y vuelve a indentar un paquete minificado para poder leerlo.
Generador de tablas en texto
ASCII Table Generator
Dibuja una tabla en ASCII monoespaciado, en Markdown o con caracteres de recuadro, para READMEs y comentarios.
Letras grandes en ASCII
ASCII Text Art
Dibuja un texto como letras grandes de ASCII en varias tipografías estilo figlet, para banners y mensajes de commit.
Editor de diagramas ASCII
ASCII Diagram Editor
Dibuja cajas, líneas, flechas y etiquetas sobre una rejilla de caracteres; cada esquina y cada cruce se deducen de qué celdas vecinas están ocupadas, en caracteres de recuadro Unicode o en ASCII puro.
Después
Estas aceptan lo que produce esta herramienta, así que el resultado puede pasar directamente.
Generador de tablas en texto
ASCII Table Generator
Dibuja una tabla en ASCII monoespaciado, en Markdown o con caracteres de recuadro, para READMEs y comentarios.
Maquetas de dispositivo
Device Mockup
Coloca una captura dentro de un marco de teléfono, tableta, portátil o navegador, con fondo y sombra.
Formateador y minificador de JavaScript
JavaScript Beautifier & Minifier
Quita comentarios y espacios de JavaScript o TypeScript sin renombrar nada, y vuelve a indentar un paquete minificado para poder leerlo.
Compresor de PNG
PNG Compressor
Reduce la paleta de colores y reescribe el flujo comprimido para bajar el peso de un PNG sin cambiar sus dimensiones.
Codificador y decodificador Base64
Base64 Encoder & Decoder
Codifica y decodifica Base64 y Base64URL, para texto o archivos, tratando UTF-8 correctamente.
JSON a CSV y de vuelta
JSON ⇄ CSV
Aplana JSON anidado en columnas o reconstruye los objetos desde una tabla, con nombres de columna en notación de puntos.