Calculadora de relación de aspecto
Calcula proporciones y escala dimensiones de forma proporcional.
Escalar
Introduce un nuevo ancho o alto; la otra dimensión se calculará automáticamente.
Relaciones de aspecto habituales
| Relación | Uso habitual | Ejemplos de resoluciones |
|---|---|---|
| 16:9 | Pantallas panorámicas, YouTube, TV | 1920x1080, 3840x2160 |
| 4:3 | TV clásica, presentaciones, iPad | 1024x768, 2048x1536 |
| 1:1 | Publicaciones de Instagram, fotos de perfil | 1080x1080, 400x400 |
| 9:16 | TikTok, Reels, Stories, vídeo en móvil | 1080x1920 |
| 21:9 | Pantallas ultrapanorámicas, cine | 2560x1080, 3440x1440 |
| 3:2 | Cámaras réflex, Surface | 1440x960, 6000x4000 |
Preguntas frecuentes
¿Qué es una relación de aspecto?
Una relación de aspecto es la relación proporcional entre el ancho y el alto. Una relación 16:9 significa que por cada 16 unidades de ancho hay 9 unidades de alto, independientemente del tamaño real en píxeles.
¿Por qué es importante la relación de aspecto en vídeo?
Usar una relación incorrecta provoca bandas negras (letterboxing/pillarboxing) o estiramiento. YouTube usa 16:9, TikTok/Reels usan 9:16 y las publicaciones de Instagram usan 1:1 o 4:5.
Las matemáticas detrás de la proporción
Una relación de aspecto es la relación proporcional entre el ancho y el alto, escrita como W:H, como 16:9, o como un único decimal, 16 ÷ 9 = 1.777…, normalmente redondeado a 1.78:1. Dos resoluciones de píxeles diferentes pueden compartir la misma proporción: 1920×1080 y 1280×720 son ambas 16:9 porque ambas se reducen a la misma fracción.
Para simplificar cualquier par, divide ambos números por su máximo común divisor: el mayor entero que divide a ambos, ancho y alto, de forma exacta. Para Full HD:
gcd(1920, 1080) = 1201920 ÷ 120 = 161080 ÷ 120 = 9- →
16:9
Esta calculadora ejecuta esa reducción por MCD cada vez que cambias un número, y también resuelve el problema inverso: dada una proporción objetivo y una dimensión conocida, la otra se deduce de new height = (known width × H) ÷ W: así, una imagen de 1080 de ancho escalada a 16:9 necesita un alto de 1080 × 9 ÷ 16 = 607.5, normalmente redondeado a 608.
Una breve historia del rectángulo
En 1891, W.K.L. Dickson, que trabajaba para Thomas Edison, eligió un fotograma 4:3 para el Kinetoscopio porque cortar por la mitad la película Kodak de 70 mm daba 35 mm, y cuatro perforaciones por fotograma producían esa proporción. Una convención de París adoptó 1.33:1 como el estándar del cine mudo en 1925. Cuando las bandas de sonido óptico empezaron a invadir el área de la imagen, la Society of Motion Picture Engineers estandarizó la relación Academy en 1.375:1 el 9 de mayo de 1932, el formato que usó cada película de estudio durante los siguientes veinte años.
La televisión se estaba comiendo el negocio del cine a principios de la década de 1950, y Hollywood respondió con anchura. Shane se estrenó en 1.66:1 en mayo de 1953. Cinco meses después, la 20th Century Fox estrenó The Robe en CinemaScope, originalmente 2.55:1 (reducido del máximo óptico de 2.66 para dejar espacio para cuatro bandas de sonido magnético). La SMPTE fijó la apertura de proyección anamórfica en 2.35:1 en 1957 y la actualizó a 2.39:1 en 1970 para que las marcas de empalme fueran menos visibles.
16:9 tampoco es arbitrario. En 1984, Kerns H. Powers, que trabajaba en el grupo de trabajo de alta definición de la SMPTE, lo dedujo geométricamente: cuando se superponen de forma concéntrica rectángulos de igual área con la forma de todas las proporciones populares de cine y televisión (4:3, 1.85:1, 2.35:1), todos caben dentro de un rectángulo exterior de 1.77:1 y todos cubren un rectángulo interior de 1.77:1. Matemáticamente, es la media geométrica de los extremos, √(1.33 × 2.35) ≈ 1.77. La Recomendación ITU-R BT.709 consagró el 16:9 para la HDTV en 1990, y la industria de los PC pasó de 16:10 a 16:9 alrededor de 2009 para compartir las líneas de fabricación de paneles con los televisores.
Proporciones comunes en 2026
| Proporción | Decimal | Dónde la ves |
|---|---|---|
| 1:1 | 1.000 | Publicaciones cuadradas de Instagram, fotos de perfil, carátulas de álbum |
| 4:5 | 0.800 | Feed vertical de Instagram (el formato con mayor interacción) |
| 2:3 | 0.667 | Pin estándar de Pinterest, copias fotográficas verticales de 35 mm |
| 3:2 | 1.500 | Réflex digitales de fotograma completo, negativos de 35 mm, portátiles Microsoft Surface |
| 16:10 | 1.600 | Portátiles más antiguos, MacBook Pro de 14 y 16 pulgadas, muchas tabletas |
| 16:9 | 1.778 | HDTV, monitores modernos, YouTube en horizontal, la mayoría de los portátiles |
| 1.85:1 | 1.850 | Estreno en salas «flat» moderno |
| 1.91:1 | 1.910 | Tarjetas para compartir de Open Graph / Facebook / LinkedIn (1200×630) |
| 2:1 | 2.000 | Univisium, usado por algunos originales de streaming |
| 21:9 | 2.333* | Monitores ultrapanorámicos (*etiqueta de marketing; técnicamente 64:27 = 2.37:1) |
| 2.39:1 | 2.390 | Pantalla ancha anamórfica moderna («scope») |
Tamaños para plataformas sociales en 2026
- Feed de Instagram: el formato vertical 4:5 (1080×1350) es el predeterminado actual, optimizado para la interacción: ocupa bastante más espacio vertical de pantalla en un teléfono que un cuadrado 1:1. También se aceptan el cuadrado (1080×1080) y el horizontal 1.91:1. Las Stories y los Reels son 9:16 (1080×1920).
- TikTok: 9:16 nativo a 1080×1920. Se acepta el cuadrado, pero se recorta por el centro en la vista a pantalla completa.
- YouTube: 16:9 horizontal (1920×1080 o 3840×2160 para 4K). Los YouTube Shorts son 9:16 a 1080×1920.
- LinkedIn: tarjeta de enlace o para compartir de 1200×630 (1.91:1). Portada del banner de 1584×396 (4:1). Se recomienda el vertical 1080×1350 (4:5) para las publicaciones del feed.
- Pinterest: pin estándar de 1000×1500 (2:3). El centro de ayuda de Pinterest señala que otras proporciones pueden afectar negativamente al alcance, y los pines más altos de aproximadamente 1:2.1 se truncan en el feed de inicio.
- Facebook / Open Graph: la vista previa de enlace de 1200×630 (1.91:1) es el estándar de facto para la vista previa más grande en el News Feed y Messenger.
Letterbox, pillarbox, windowbox
Cuando la relación de aspecto de un fotograma no coincide con la superficie en la que se muestra, obtienes barras negras; el formato depende de qué dimensión se desborda.
- Letterbox: barras arriba y abajo. La fuente es más ancha que la pantalla. Mostrar una película de 2.39:1 en un televisor 16:9 es el ejemplo canónico. Las barras se comen aproximadamente
1 − (1.78 / 2.39) ≈ 25%del espacio vertical. - Pillarbox: barras a izquierda y derecha. La fuente es más estrecha que la pantalla. Mostrar una comedia de situación 4:3 en un televisor 16:9 es el caso clásico.
- Windowbox: barras en los cuatro lados. Ocurre cuando un contenido que ya tiene letterbox (o pillarbox) se escala a un fotograma de otra proporción más.
- Pan and scan es la alternativa destructiva: la imagen se recorta para llenar la pantalla y la cámara «recorre» el fotograma original para mantener la acción centrada. Era el estándar para publicar películas de 2.35:1 en VHS 4:3 en los años ochenta y noventa, y fue muy criticado por cortar la composición.
El aspect-ratio de CSS
Los navegadores incluyen una propiedad CSS que hace las matemáticas por ti en la maquetación. aspect-ratio: 16 / 9; declara la forma preferida de ancho a alto de un elemento. Cuando al menos uno de los dos, el ancho o el alto, es auto, el navegador dimensiona la caja para respetar la proporción; si ambos son explícitos, la proporción se ignora. Según MDN, la propiedad está disponible en todos los motores principales desde septiembre de 2021 y tiene el estado «Baseline ampliamente disponible».
Antes de eso, el truco estándar era el hack del padding (Thierry Koblentz, 2009): poner a cero la altura del envoltorio y establecer padding-bottom: 56.25%, que es 9 ÷ 16 × 100. El relleno en porcentaje se calcula respecto al ancho del padre, así que la caja acaba teniendo 9 unidades de alto por cada 16 de ancho. El equivalente moderno para una incrustación responsiva de YouTube es una sola línea:
<iframe src="…" style="width:100%; aspect-ratio: 16 / 9; border:0;"></iframe>Establecer aspect-ratio en una etiqueta <img> también reserva el espacio de maquetación antes de que la imagen cargue, lo que es una de las mejoras más baratas que puedes hacer en el Cumulative Layout Shift, una Core Web Vital que afecta al posicionamiento en las búsquedas.
Errores comunes
- Estirar en lugar de recortar o aplicar letterbox. Escalar cada eje de forma independiente distorsiona las caras y convierte los círculos en óvalos. La regla: nunca escales el ancho y el alto con factores diferentes.
- No te fíes de la etiqueta de marketing. Los monitores «21:9» son técnicamente 64:27 (≈ 2.37:1). Los paneles de portátil «1366×768» son casi 16:9 (1366÷768 = 1.7786 frente a 16÷9 = 1.7778), pero la proporción simplificada es en realidad 683:384, razón por la cual el vídeo de 1080p a veces se reduce de forma ligeramente imperfecta. «4K» puede significar 3840×2160 (UHD, 16:9) o 4096×2160 (DCI cine, ≈ 1.90:1) según el contexto.
- Recortar de nuevo sin volver a centrar los sujetos. Un retrato 1:1 compuesto justo en el centro perderá la cabeza y los pies al recortarlo de nuevo a 9:16; un vertical 9:16 perderá las manos y los objetos al recortarlo a 1:1. Los diseñadores graban con una «zona segura» (aproximadamente el 80% central) que sobrevive a cada recorte común.
- Confundir la relación de aspecto con la densidad de píxeles. 1920×1080 y 3840×2160 comparten una relación de aspecto, pero producen una nitidez muy diferente en la misma pantalla física.
- Cuadrícula frente a feed en Instagram. Una publicación 4:5 se muestra a toda altura en el feed, pero se recorta por el centro a 1:1 en la cuadrícula de tu perfil, así que cualquier cosa importante (caras, titulares, logotipos) tiene que sobrevivir al recorte cuadrado.
- Confundir el 16:9 con la proporción áurea. Phi (≈ 1.618) se sitúa entre 3:2 (1.5) y 16:10 (1.6). Los rectángulos áureos reales se parecen más a una tarjeta de crédito que a un televisor.
Más preguntas
¿Es 1.91:1 lo mismo que 16:9?
No. 16:9 es 1.778, mientras que 1.91:1 es 1.910. Se parecen a primera vista, pero las tarjetas para compartir de Open Graph de 1200×630 (1.91:1) son ligeramente más anchas que los fotogramas de vídeo 16:9 de 1920×1080. Confundir ambas es una de las razones más comunes de que las vistas previas para compartir en redes sociales se recorten de forma extraña.
¿Cuál es la diferencia entre el 4K UHD y el 4K DCI?
El 4K UHD es de 3840×2160 con una relación de aspecto 16:9 (1.78:1): eso es lo que usan los televisores de consumo y la mayoría del streaming. El 4K DCI es de 4096×2160 con una relación de aspecto 256:135 (≈ 1.90:1): es el estándar de masterización de cine digital que requieren las cámaras profesionales como RED, ARRI y Blackmagic. Los dos formatos difieren en 256 píxeles horizontales, aproximadamente un 6.7% más de área total en DCI.
¿Cómo encuentro dimensiones equivalentes para una relación de aspecto diferente?
Elige una proporción objetivo (digamos 16:9) y una dimensión que quieras mantener fija (digamos un ancho de 1080 píxeles). La otra dimensión se deduce de una única multiplicación: alto = 1080 × 9 ÷ 16 = 607.5, redondeado a 608. El panel «Escalar» de arriba lo hace automáticamente: cambia el nuevo ancho o el nuevo alto y la dimensión correspondiente se calcula en tiempo real.
¿Por qué desapareció el 16:10 de los monitores?
Los PC favorecieron brevemente el 16:10 (1680×1050, 1920×1200) entre aproximadamente 2003 y 2009. La industria pivotó al 16:9 alrededor de 2009-2010 porque los fabricantes de televisores ya producían paneles LCD de 16:9 en volumen para los televisores HD, así que dar a los monitores la misma forma permitía que todos compartieran las mismas líneas de fábrica. El 16:10 ha vuelto en los portátiles de gama alta (los modelos recientes de MacBook Pro de 14 y 16 pulgadas, además de varios portátiles Windows) porque da más espacio vertical para el código y los documentos.
¿Funciona esto enteramente en mi navegador?
Sí. La calculadora son unas pocas líneas de JavaScript que calculan el MCD y la fórmula de escalado localmente; no se envía nada a un servidor, no se necesita ninguna cuenta y funciona sin conexión una vez que la página está en caché. Lo mismo se aplica a todas las demás herramientas de Absolutool.