tool hub Centro de herramientas

JS/CSS Formatter

JS/CSS Formatter — se ejecuta en el navegador. No se guardan datos.

Se ejecuta en el navegador Sin registro Gratis


Sangría básica de JS / CSS

Modo

Sangría simple según llaves. No es un analizador al nivel de Prettier.

Cómo usar

  1. En modo, elige JavaScript o CSS.
  2. Pon código de una línea o con sangría rota en origen.
  3. Pulsa Formatear para obtener un resultado con líneas partidas en llaves y puntos y coma.
  4. Si hace falta, tómalo con Copiar resultado.
  5. Restablecer vacía entrada/salida y recupera el modo JavaScript.

Conceptos clave

El formateador JS/CSS no es un analizador de lenguaje como Prettier. Solo cuenta la profundidad de llaves y añade sangría de dos espacios. Un punto y coma empieza una línea nueva; una llave de cierre se alinea un nivel hacia fuera. Los modos JavaScript y hoja de estilos se etiquetan por separado en pantalla pero comparten las mismas reglas de sangría. Ayuda a desplegar un one-liner minificado para humanos. Se reducen las líneas vacías y solo se vuelven a unir las de contenido a su profundidad, lo que encaja para desplegar un borrador compacto y revisarlo.

Las llaves dentro de cadenas o plantillas literales pueden tomarse por estructura, así que la sintaxis compleja es más estable en un formateador dedicado. Este formateador JS/CSS no construye un AST, así que no aplica orden de import, estilo de comillas ni reglas de coma final. Corre solo en el navegador y no sube el origen. Encaja mejor como paso auxiliar para desplegar un fragmento que minificaste y luego revisarlo. La salida del formato solo rellena el campo de solo lectura, así que puedes conservar el original y comparar en paralelo.

Ejemplo

Pon .box{color:red;margin:0} en origen, modo CSS, y Formatear: las declaraciones se sangran dos espacios en la línea tras la llave de apertura, y la de cierre coincide con la profundidad original. En modo JavaScript, function a(){return 1;} sangra dentro de las llaves del mismo modo. Copiar resultado toma el código limpio al momento.

Relacionado: Minificador JS/CSS · Formateador HTML · Formateador SQL

Preguntas frecuentes

¿El formateador JS/CSS es lo mismo que Prettier?

No. Solo sangra según posiciones de llaves y puntos y coma. No hay reglas de plugin ni analizadores por lenguaje.

¿JavaScript y CSS usan algoritmos distintos en el formateador JS/CSS?

Solo cambia el modo en pantalla; la lógica de sangría es la misma. Selectores y funciones cuentan la profundidad de llaves del mismo modo.

¿El formateador JS/CSS despliega código minificado de una línea?

Si hay llaves y puntos y coma, las líneas se parten. Las expresiones cortas sin punto y coma pueden quedarse en una línea.

¿Las llaves dentro de cadenas pueden romper la sangría del formateador JS/CSS?

Sí. Cuenta las llaves carácter a carácter, así que los símbolos dentro de plantillas pueden tomarse por estructura.

¿Se guarda el origen del formateador JS/CSS en un servidor?

No. Formatear y copiar son solo en el navegador. Restablecer vacía los campos.

¿Qué pasa con el modo tras Restablecer el formateador JS/CSS?

Se vuelve a seleccionar el radio JavaScript y se vacían el texto de origen y el de resultado.

JS/CSS Formatter imagen de portada
La entrada no se envía al servidor y desaparece al cerrar la página.

Última revisión: 2026-09-04