Formateador de Números en Línea

Formateador de Números en Línea — Separadores, Moneda y Código Intl.NumberFormat

Pega cualquier número y ve al instante cómo aparece formateado como moneda, decimal o porcentaje para cualquier locale del mundo. ¿Necesitas añadir comas a un número grande, formatear un precio en euros o generar el código JavaScript exacto que reproduce el resultado en tu app? Esta herramienta cubre los tres casos en un solo lugar.

A diferencia de los formateadores genéricos que solo añaden separadores de miles, esta herramienta expone toda la potencia de la API nativa Intl.NumberFormat del navegador: elige el locale, la moneda, el número mínimo y máximo de decimales y el agrupamiento. El snippet de código se actualiza en tiempo real para que lo copies y pegues directamente en tu proyecto.

Cómo Usar el Formateador de Números

Formatear un número lleva segundos:

1. Introduce el número en la barra de Modo Rápido — el resultado aparece al instante con separadores de miles, convirtiendo 1250500,75 en 1.250.500,75 (es-ES) o 1,250,500.75 (en-US) mientras escribes.
2. Configura el formato en el panel de Configuración Técnica — selecciona un locale, el estilo (monetario, decimal o porcentaje), el código de moneda y la cantidad de decimales. El resultado se actualiza en vivo.
3. Copia el resultado o el código — haz clic en "Copiar Resultado" para obtener la cadena formateada, o en "Copiar Código" para obtener el snippet Intl.NumberFormat listo para pegar.

Ejemplos de Formateo de Números

Así luce el mismo número en distintas configuraciones:

La fila de India muestra una diferencia crucial: ₹12,50,500.75 usa grupos de dos dígitos después de los tres primeros, siguiendo el sistema de lakh y crore del sur de Asia. Los formateadores convencionales no reproducen esto correctamente. El locale hi-IN lo resuelve de forma nativa con Intl.NumberFormat.

Intl.NumberFormat — El Estándar JavaScript para Formatear Números

Intl.NumberFormat es la API nativa de JavaScript para formatear números con conciencia de locale. Todos los navegadores modernos y Node.js la soportan sin dependencias externas:

new Intl.NumberFormat('es-ES', {
  style: 'currency',
  currency: 'EUR',
  minimumFractionDigits: 2,
}).format(1250500.75);
// → "1.250.500,75 €"

El constructor recibe una etiqueta de idioma BCP 47 y un objeto de opciones. La propiedad style controla si el número se presenta como cadena de moneda, decimal o porcentaje. useGrouping: false elimina todos los separadores cuando necesitas una cadena numérica limpia.

Casos de Uso Comunes

• Precios en e-commerce: Formatea el mismo precio de la base de datos para cada locale de la tienda — 12,99 se convierte en €11,99, $12.99 o R$ 12,99 según el país del cliente.
• Dashboards financieros: Muestra valores de cartera, ingresos y capitalización de mercado con separadores correctos para que 1250000 se lea como 1.250.000 (es-ES) de un vistazo.
• Añadir separadores de miles a un número: El caso de uso más habitual — la barra de Modo Rápido está diseñada exactamente para esto.
• Facturas y reportes: Genera cadenas con locale correcto para documentos enviados a clientes en distintos países.
• Aprendizaje y prototipado: Prueba cómo distintas opciones de Intl.NumberFormat interactúan antes de confirmar una configuración en producción.

Preguntas Frecuentes

¿Cómo añado separadores de miles a un número en JavaScript?

Usa Intl.NumberFormat con el estilo decimal y useGrouping: true (el valor por defecto): new Intl.NumberFormat('es-ES').format(1250500) devuelve "1.250.500". Para el locale americano, cambia a 'en-US' — usa comas como separadores de miles y punto como decimal. Esta herramienta genera el snippet listo para cualquier configuración que configures.

¿Qué hace minimumFractionDigits en Intl.NumberFormat?

minimumFractionDigits establece el mínimo de decimales mostrados — el número formateado siempre mostrará al menos esa cantidad tras la coma. Establecerlo en 2 garantiza que 1250500 aparezca como 1.250.500,00 € y no 1.250.500 €. maximumFractionDigits es el techo. Cuando ambos son 2, el número siempre muestra exactamente dos decimales.

¿Intl.NumberFormat soporta el sistema indio de lakh y crore?

Sí. El locale hi-IN implementa el sistema de numeración indio de forma nativa: grupos de dos dígitos tras los tres primeros, produciendo ₹12,50,500.75 para 1.250.500,75. No se necesita ninguna lógica adicional — forma parte del estándar Unicode CLDR que implementan los navegadores.

¿Cuál es la diferencia entre el estilo porcentaje y multiplicar por 100?

Intl.NumberFormat con style: 'percent' trata el valor como fracción, no como porcentaje — multiplica internamente por 100. Pasa 0.45 para obtener "45%", no 45. Si tu valor ya es un porcentaje (como 45), divídelo por 100 antes de formatear: formatter.format(45 / 100).

¿Cómo formateo números para distintos países sin cambiar la moneda?

Usa el selector de Locale en la Configuración Técnica para sobreescribir el locale de visualización de forma independiente al código de moneda. Por ejemplo, puedes mostrar un importe en EUR con las convenciones del locale en-US para obtener €1,250,500.75 en lugar de 1.250.500,75 €.

Recursos

• MDN — Intl.NumberFormat — Referencia oficial con todas las opciones del constructor y tabla de compatibilidad de navegadores.
• Unicode CLDR — Formatos de número — Los datos que los navegadores usan para separadores, símbolos de moneda y formateo regional.