Formateador de código para JavaScript, HTML, CSS, SQL, Python y PHP
Este formateador de código convierte el código fuente desordenado, minificado o con sangría inconsistente en código limpio y legible. Elige un lenguaje, pega tu código y se embellece automáticamente con sangría uniforme y saltos de línea ordenados.
Está pensado para quienes programan y quieren formatear código online antes de confirmar un commit o compartirlo, para estudiantes que aprenden a sangrar correctamente, para quienes revisan y desenredan fragmentos densos y para quienes escriben documentación técnica y preparan ejemplos limpios. Cubre seis lenguajes, cada uno con un motor dedicado y de estándar en la industria.
Cómo formatear código online
Elige un lenguaje
Haz clic en una pestaña de lenguaje arriba: JavaScript, HTML, CSS, SQL, Python o PHP. Cada pestaña carga el motor de formato y las opciones correctas.
Pega o sube tu código
Escribe o pega el código en el panel de Entrada a la izquierda, o usa Subir para cargar un archivo desde tu dispositivo. Haz clic en Ejemplo para insertar código de muestra del lenguaje actual.
Ajusta las opciones de formato
Define el tamaño de sangría (2, 3, 4 u 8 espacios, o Tab) y cualquier opción propia del lenguaje, como el ancho de línea, las comillas y el punto y coma en JavaScript, o las mayúsculas de las palabras clave y el dialecto en SQL.
Copia o descarga el resultado
El código formateado aparece en el panel de Salida con resaltado de sintaxis. Usa Copiar para enviarlo al portapapeles o Descargar para guardarlo con la extensión de archivo correcta.
Funciones
Seis lenguajes, motores dedicados
Formatea JavaScript, HTML, CSS y PHP con Prettier, SQL con sql-formatter y Python con js-beautify.
Formato de JavaScript
Prettier con el parser de Babel, más controles para ancho de línea, punto y coma, comillas simples o dobles y comas finales.
Formato de HTML y CSS
HTML ordenado con ajuste de atributos y posición de las llaves, y CSS limpio con un ancho de línea configurable.
SQL con dialectos
Elige las mayúsculas de las palabras clave y un dialecto: SQL estándar, MySQL, PostgreSQL, MSSQL u Oracle, cada uno con sus reglas de sintaxis.
Sangría personalizable
Sangra con 2, 3, 4 u 8 espacios, o usa caracteres Tab. El ajuste se aplica a todos los lenguajes y actualiza la salida al instante.
Salida con resaltado de sintaxis
Prism.js colorea las palabras clave, las cadenas, los comentarios y los números, y el tema se adapta solo al modo claro y oscuro.
Salida editable
Haz clic en Editar para cambiar la salida a un editor CodeMirror completo con números de línea para ajustes manuales rápidos. Carga bajo demanda.
Formato en tiempo real
El código se reformatea solo un instante después de escribir, o al instante con Ctrl+Shift+F, para que veas resultados limpios mientras trabajas.
Subir, descargar y copiar
Carga un archivo de código desde tu dispositivo, copia el resultado con un clic o descárgalo con la extensión correcta (.js, .html, .css, .sql, .py, .php).
Estado y estadísticas
Una barra de estado muestra los estados Listo, Formateado o Error junto con el conteo de líneas y el tamaño de archivo de la salida formateada.
Preguntas frecuentes
¿Qué hace un formateador de código?
Reescribe tu código fuente con sangría, espaciado y saltos de línea uniformes para que sea más fácil de leer, sin cambiar lo que hace el código. Es lo opuesto a minificar, que elimina los espacios en blanco para hacer el código más pequeño.
¿El formato cambia cómo se ejecuta mi código?
No. El formato solo ajusta los espacios en blanco y la disposición, como la sangría, los saltos de línea y el espaciado. La lógica y el comportamiento de tu código quedan exactamente igual.
¿Qué lenguajes admite?
Seis lenguajes: JavaScript, HTML, CSS, SQL, Python y PHP. Como la pestaña de JavaScript usa Prettier con el parser de Babel, también puedes pegar TypeScript o JSX en ella.
¿Se sube mi código a un servidor?
No. Todo el formato ocurre por completo en tu navegador mediante librerías de JavaScript (Prettier, sql-formatter y js-beautify). Tu código nunca sale de tu dispositivo y no se guarda ni se registra nada.
¿Qué motores de formato se usan?
Prettier se encarga de JavaScript, HTML, CSS y PHP, sql-formatter se encarga de SQL y js-beautify se encarga de la sangría de Python. Son las mismas herramientas que muchos desarrolladores usan dentro de sus editores de código.
¿Qué significa el ancho de línea?
El ancho de línea define el número máximo de caracteres por línea. El formateador intenta ajustar las líneas que superan ese límite. Puedes elegir 80, 100 o 120 caracteres.
¿Qué dialectos de SQL admite?
SQL estándar, MySQL, PostgreSQL, MSSQL (Transact-SQL) y Oracle (PL/SQL). Cada dialecto tiene sus propias reglas de sintaxis que afectan cómo se formatea la consulta. También puedes fijar las mayúsculas de las palabras clave en MAYÚSCULAS, minúsculas o Conservar.
¿Puedo editar la salida formateada?
Sí. Haz clic en el botón Editar del panel de salida para cambiar a un editor CodeMirror interactivo con números de línea, luego haz ajustes manuales y copia o descarga el resultado. Haz clic en Ver para volver a la vista de solo lectura con resaltado de sintaxis.
¿Por qué mi código muestra un error?
El formateador reporta un error cuando la entrada contiene sintaxis que no puede analizar. Corrige el problema de sintaxis en el panel de entrada y se volverá a formatear automáticamente.
Aún no hay comentarios. ¡Sé el primero en comentar!