Formateador de código
Pega código desordenado o minificado y recupéralo con una indentación limpia, o redúcelo para producción. Quince lenguajes, formateados con Prettier en tu navegador.
- Con Prettier
- También minifica
- 15 lenguajes
- El código no sale de aquí
Opciones
Las líneas más largas se dividen.
Cómo formatear código
Pega, lee, copia.
- 1
Pega tu código o suelta un archivo
El lenguaje se detecta automáticamente; también puedes elegirlo en la lista.
- 2
Ajusta el estilo
Indentación, ancho de línea, comillas, punto y coma y comas finales, o bien el dialecto SQL y las mayúsculas de las palabras clave.
- 3
Copia o descarga
Llévate el resultado formateado o pulsa Minificar para obtener la versión compacta.
Un solo formateador para todo el stack
El mismo motor que muchos equipos usan en sus editores.
Calidad Prettier
JavaScript, TypeScript, CSS, HTML, Markdown, YAML y GraphQL se formatean con Prettier, el formateador estándar de facto.
SQL para tu base de datos
SQL estándar, MySQL, MariaDB, PostgreSQL, SQLite, SQL Server, Oracle, BigQuery, Snowflake y más, con las palabras clave en mayúsculas o minúsculas, como prefieras.
Minifica para producción
Terser comprime el JavaScript; en CSS, HTML, JSON, XML y SQL se eliminan los comentarios y los espacios en blanco innecesarios.
Detecta el lenguaje
Pega lo que sea: la herramienta reconoce JSON, HTML, XML, CSS, SQL, TypeScript, JSX, YAML y más, o lee la extensión del archivo.
Mensajes de error claros
El código no válido no se destroza: se te indica la línea del error de sintaxis y con un clic queda seleccionada.
Fuera del hilo principal
El formateo se ejecuta en un worker en segundo plano, así que ni siquiera los archivos grandes bloquean la página.
Privado por diseño
Todo funciona en tu navegador. Lo que escribes o abres no se envía a ningún servidor.
Gratis y sin registro
Sin cuenta, sin límites y sin marca de agua: en el móvil, la tableta o el ordenador.
Formatear, minificar y por qué importan ambas cosas
Formatear (embellecer) reescribe el código con una indentación, unos espacios y unos saltos de línea coherentes, sin cambiar lo que hace. Vuelve legible el código minificado o generado automáticamente, deja ver la estructura real de los datos muy anidados y zanja los debates de estilo en las revisiones de código: cuando una herramienta decide dónde van las llaves, los diffs solo muestran cambios reales.
Minificar es el paso contrario, pensado para la entrega: se eliminan los comentarios, los espacios en blanco y, en JavaScript, los nombres largos de variables para que viajen menos bytes hasta el navegador. Un script típico se reduce entre un 30 y un 60 % antes de la compresión. Conserva el código fuente legible en el control de versiones y minifica como parte del build; el código minificado no está hecho para editarse.
Esta herramienta formatea con Prettier, un formateador con criterio propio que analiza el código, lo convierte en un árbol sintáctico y lo vuelve a escribir desde cero. Por eso necesita código válido: si falta una llave, se informa del número de línea en lugar de intentar adivinarla. Las pocas opciones (ancho de línea, indentación, comillas, punto y coma, comas finales) coinciden con las de un archivo .prettierrc, de modo que el resultado tiene el mismo aspecto que el de tu proyecto.
Lenguajes compatibles
| Lenguaje | Formatear | Minificar |
|---|---|---|
| JavaScript, JSX | Sí | JavaScript: sí (Terser) |
| TypeScript, TSX | Sí | No: compílalo antes a JavaScript |
| JSON | Sí | Sí |
| CSS, SCSS, Less | Sí | CSS: sí |
| HTML, Vue, XML, SVG | Sí | HTML y XML: sí |
| SQL, Markdown, YAML, GraphQL | Sí | SQL: sí |
Consejos
- Para JSON con vista en árbol, validación y reparación, usa el formateador JSON específico.
- Comprueba una expresión regular de tu código en el probador de regex.
- Incrusta un recurso pequeño en CSS o HTML como URI de datos con el codificador Base64.
- Pulsa Ctrl + Intro para formatear. La tecla Tab inserta una sangría en el campo de entrada en lugar de salir de él.
Preguntas frecuentes
¿No encuentras tu respuesta? Escríbenos: respondemos rápido.
¿Se sube mi código a un servidor?
No. Prettier, Terser y el formateador SQL se descargan en tu navegador y se ejecutan ahí. Tu código nunca sale de tu dispositivo, así que puedes usarlo sin problema con código propietario.
¿Por qué falla el formateo con un error de sintaxis?
El formateador tiene que analizar primero el código. Si falta una llave, una comilla o una etiqueta, no puede saber qué querías decir, de modo que indica la línea en lugar de generar un resultado incorrecto. Corrige ese punto y vuelve a formatear.
¿El formateo cambia el funcionamiento de mi código?
No. Solo cambian los espacios en blanco, los saltos de línea, las comillas y la puntuación opcional, como el punto y coma o las comas finales. El comportamiento del programa sigue siendo el mismo.
¿Es seguro usar JavaScript minificado?
Sí. Terser elimina espacios en blanco y comentarios y acorta los nombres de las variables locales sin alterar el comportamiento. Desactiva «Acortar nombres de variables» si otros scripts dependen de nombres del ámbito global.
¿Qué dialectos de SQL son compatibles?
SQL estándar, MySQL, MariaDB, PostgreSQL, SQLite, SQL Server (T-SQL), Oracle PL/SQL, BigQuery, Snowflake, Redshift, Spark, DB2, Hive y Trino/Presto.
¿Qué tamaño puede tener la entrada?
Se pueden abrir archivos de hasta 5 MB. El formateo en vivo se pausa por encima de los 200 000 caracteres: en ese caso, pulsa Formatear. La velocidad depende de tu dispositivo, ya que todo el trabajo se hace en él.
Más herramientas gratuitas para desarrolladores
Codifica, formatea, prueba, convierte y genera: pequeñas herramientas que funcionan en tu navegador y dejan tus datos en tu dispositivo.