ZenovayTools

Calculadora de relación de aspecto

Calcula las relaciones de aspecto de imágenes y videos. Ingresa dos valores cualesquiera para encontrar el tercero, o elige una relación preestablecida para tamaños de video y redes sociales comunes.

Common presets

Aspect Ratio

16:9

Decimal

1.7778

Percentage (W/H)

177.78%

Visual preview

16:91,920px1,080px

CSS

aspect-ratio: 16 / 9;

Cómo usar Calculadora de relación de aspecto

  1. 1Ingresa el ancho y alto de tu imagen o video.
  2. 2La relación de aspecto y la fracción simplificada se muestran al instante.
  3. 3O elige una relación preestablecida e ingresa una dimensión para calcular la otra.
  4. 4Visualiza resoluciones comunes para la relación seleccionada.
ZenovayAnalytics

Ve quién está en tu sitio ahora mismo.

  • Seguimiento de visitantes en tiempo real
  • Privacidad primero, sin aviso de cookies
  • Configurado en dos minutos
Descubre Zenovay

Herramientas relacionadas

Formateador y Validador JSON
Formatea, valida y embellece datos JSON con resaltado de sintaxis y detección de errores.
Decodificador JWT
Decodifica e inspecciona tokens JWT. Consulta el encabezado, la carga útil y verifica firmas.
Base64 Codificar/Decodificar
Codifica texto a Base64 o decodifica Base64 a texto. Soporta UTF-8 y datos binarios.
Codificador/Decodificador de URL
Codifica o decodifica componentes de URL. Maneja caracteres especiales, cadenas de consulta y URLs completas.

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 de una imagen o video, expresada como A:H. Por ejemplo, 16:9 significa que por cada 16 unidades de ancho hay 9 unidades de alto. Relaciones comunes: 16:9 (video HD panorámico, YouTube), 4:3 (televisores/monitores antiguos, iPad horizontal), 1:1 (cuadrado, Instagram), 9:16 (video vertical, TikTok/Reels), 3:2 (fotos DSLR, película de 35mm), 21:9 (cine ultrawide).
¿Por qué importan las relaciones de aspecto para web y video?▾
Las relaciones de aspecto importan para: (1) Incrustaciones de video — usar la relación incorrecta provoca barras negras o distorsión. (2) Optimización de imágenes — recorte las imágenes a la relación de visualización exacta antes de subirlas para evitar el recorte por parte del navegador. (3) CSS — establecer aspect-ratio: 16/9 en un contenedor garantiza que siempre mantenga sus proporciones independientemente del ancho. (4) Redes sociales — cada plataforma tiene diferentes relaciones requeridas para visualización óptima (Twitter: 16:9 o 1:1, Instagram: 1:1, 4:5 o 9:16).
¿Cómo mantengo la relación de aspecto en CSS?▾
CSS moderno: aspect-ratio: 16 / 9 directamente en el elemento. La altura del elemento coincidirá automáticamente con su ancho en la relación dada. Método heredado (truco con padding): establezca height: 0 y padding-bottom: 56,25% en un contenedor (56,25% = 9/16 × 100%) — esto funciona en navegadores más antiguos. Para videos responsivos, envuelva en un div con aspect-ratio: 16/9 y establezca el iframe/video en width: 100%; height: 100%.
¿Qué resolución debo usar para diferentes relaciones de aspecto?▾
16:9 — 1280×720 (720p HD), 1920×1080 (1080p Full HD), 3840×2160 (4K UHD), 2560×1440 (2K QHD). 4:3 — 1024×768, 1280×960, 800×600. 1:1 — 1080×1080 (Instagram). 9:16 — 1080×1920 (Stories/Reels/TikTok). 3:2 — 1920×1280, 2400×1600. 21:9 — 3440×1440, 2560×1080. Para imágenes web, sirva a 2× el tamaño de visualización CSS para pantallas retina.
¿Cómo calculo una dimensión que me falta?▾
Si conoce el ancho (A) y la relación de aspecto (A_ratio:H_ratio), la altura es: H = A × (H_ratio / A_ratio). Por ejemplo, 1920 px de ancho en 16:9 → H = 1920 × (9/16) = 1080 px. Si conoce la altura, el ancho es: A = H × (A_ratio / H_ratio). Esta calculadora realiza todos estos cálculos automáticamente — solo ingrese dos valores cualesquiera.