Ajustar imagen con barras
Encaje una imagen en un lienzo fijo sin recortarla ni estirarla: una foto de 1920 por 1080 en un cuadrado de 1000 por 1000 queda en 1000 por 562, con barras de 219 píxeles arriba y abajo. Gratis en su navegador.
- Gratis
- Funciona en su navegador
- Sin registro
- Sus datos no salen de su equipo
Ejecutar — gratis
Ejemplo resuelto
- Ancho de origen
- 1 920
- Alto de origen
- 1 080
- Ancho del lienzo
- 1 000
- Alto del lienzo
- 1 000
- Escala
- 0,5208333333
- Fit
- letterbox
Ajuste una imagen dentro de un lienzo fijo sin adivinar, deformar ni recortar contenido. Introduzca el ancho y alto de origen junto con las dimensiones del lienzo para obtener la escala uniforme, el tamaño final en píxeles y las barras exactas superior, derecha, inferior e izquierda. El resultado distingue entre barras horizontales, barras verticales y coincidencia exacta de proporciones, por lo que resulta útil para vídeo, presentaciones, procesos de imagen y vistas previas.
Conserve la imagen completa y sus proporciones
Un ajuste de tipo «contener» cumple una promesa estricta: todos los píxeles de origen permanecen visibles dentro del lienzo de destino. La calculadora compara las relaciones de aspecto, elige el menor factor de escala horizontal o vertical y aplica ese único factor a ambas dimensiones. Así, los círculos siguen siendo círculos, los rostros no se comprimen y nunca se recorta la composición.
El ancho y el alto calculados son píxeles enteros que no superan el lienzo. Si una dimensión proporcional exacta cae entre dos píxeles, el lado restringido ocupa su borde y el otro se redondea hacia abajo, pues redondear hacia arriba podría sacar una fila o columna del lienzo. La respuesta también incluye la escala matemática anterior al redondeo, útil para configurar programas gráficos o comparar varios lienzos.
Las cuatro dimensiones deben ser enteros positivos; una dimensión cero no define una proporción válida y se rechaza como entrada no válida.
Interprete las barras horizontales y verticales
El objeto de barras indica el relleno en píxeles de los lados superior, derecho, inferior e izquierdo. Una imagen ancha dentro de un lienzo relativamente alto deja espacio vertical y genera barras arriba y abajo. Una imagen alta o estrecha dentro de un lienzo relativamente ancho deja espacio horizontal y genera barras a izquierda y derecha.
Si ambas proporciones coinciden, el ajuste es exacto y todas las barras valen cero. La imagen siempre queda centrada. Cuando el espacio sobrante es par, las barras opuestas tienen igual tamaño.
Si es impar, la barra superior o izquierda recibe la parte menor y la inferior o derecha recibe el píxel restante. Esta regla determinista hace que las cuatro barras recompongan exactamente el lienzo y evita posiciones ambiguas de medio píxel. Puede usar los valores directamente como relleno, desplazamientos o coordenadas de dibujo: el origen de la imagen está en izquierda y superior, y el rectángulo termina antes de las barras derecha e inferior.
Aplique el resultado en procesos multimedia
Use estas cifras antes de redimensionar, no después de exportar. Cree o seleccione el lienzo de destino, cambie la imagen al ancho y alto calculados con el método de remuestreo que prefiera y colóquela en los desplazamientos izquierdo y superior devueltos. Rellene el resto con un color sólido, transparencia, una extensión desenfocada u otro fondo.
El cálculo no examina bytes, elige colores ni remuestrea; es una etapa geométrica independiente del formato y de la biblioteca de renderizado. En procesos por lotes, valide pronto las dimensiones y guarde el resultado junto a la solicitud para que todas las etapas compartan la misma geometría. Una entrada repetida siempre produce el mismo tamaño y la misma posición.
Qué puede hacer con ella
Preparar fotogramas de vídeo
Ajuste metraje o imágenes fijas a una resolución concreta y obtenga las barras exactas antes de codificar.
Crear vistas previas sin recorte
Centre fotos de producto, portafolios o documentos en tarjetas uniformes sin eliminar contenido.
Planificar presentaciones
Calcule el rectángulo y el relleno equilibrado para diapositivas, cartelería digital y pantallas.
Preguntas frecuentes
¿Se recorta o deforma la imagen?
No. Se aplica una escala uniforme, se conserva la imagen completa y el espacio sobrante se cubre con barras.
¿Por qué dos barras opuestas pueden diferir un píxel?
Un espacio impar no puede dividirse por igual en píxeles enteros. El píxel adicional se asigna a la derecha o abajo.
¿Qué ocurre si las proporciones ya coinciden?
El ajuste se marca como exacto, la imagen llena el lienzo y las cuatro barras son cero.
¿Puedo usar cero para una dimensión desconocida?
No. Todas las dimensiones deben ser enteros positivos, porque cero no permite definir una relación de aspecto.
¿La capacidad redimensiona un archivo de imagen?
No. Solo calcula la geometría. Use el tamaño y los desplazamientos devueltos con el renderizador que prefiera.
Herramientas relacionadas
Para desarrolladores — acceso por API
Todo lo de esta página está disponible por programación. Esta sección es para equipos que quieren integrarlo en sus sistemas; el resto puede usar la herramienta de arriba sin más.
Endpoint de API
¿Prefiere automatizarlo? Un POST autenticado crea la tarea; el resultado llega por webhook o enlace firmado. La misma capacidad también se ejecuta aquí en la web, por email y desde Telegram — y pronto también desde nuestra app.
Llámela desde su stack
curl -X POST https://api.kit.forhosting.com/image/letterbox-fit \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"source_width":1920,"source_height":1080,"canvas_width":1000,"canvas_height":1000}'const res = await fetch("https://api.kit.forhosting.com/image/letterbox-fit", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"source_width": 1920,
"source_height": 1080,
"canvas_width": 1000,
"canvas_height": 1000
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/image/letterbox-fit",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"source_width": 1920,
"source_height": 1080,
"canvas_width": 1000,
"canvas_height": 1000
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/letterbox-fit", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"source_width":1920,"source_height":1080,"canvas_width":1000,"canvas_height":1000}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"source_width":1920,"source_height":1080,"canvas_width":1000,"canvas_height":1000}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/letterbox-fit", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)Ejemplo de solicitud
{
"source_width": 1920,
"source_height": 1080,
"canvas_width": 1000,
"canvas_height": 1000
}Ejemplo de respuesta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "image.letterbox_fit",
"status": "queued",
"_links": {
"result": "/tasks/tsk_…/result"
}
}La API es asíncrona: la llamada devuelve un task_id al instante y el resultado llega por webhook. El polling está limitado a 1 req/s por tarea.
Precio
Precio publicado — sin tokens ni créditos inventados. Una tarea fallida no se cobra.
Límites
max_mb | 15 |
max_megapixels | 12 |
Errores
| HTTP | Código | Significado |
|---|---|---|
401 | unauthorized | API key ausente o inválida. |
402 | insufficient_balance | El saldo no cubre el precio de la tarea. |
404 | unknown_type | El tipo de tarea no existe. |
429 | rate_limited | Demasiadas peticiones. Use el webhook en vez de sondear. |
Notas técnicas
Aplique el resultado en procesos multimedia
Por eso sirve con CSS, Canvas, SVG, FFmpeg, ImageMagick, API móviles, presentaciones o tareas de miniaturas. La solicitud de API cuesta $0.002, mientras que el mismo cálculo determinista puede ejecutarse en el navegador.
Preguntas técnicas
¿Cuánto cuesta el cálculo?
Cada solicitud de API cuesta $0.002. También puede ejecutarlo gratis en el navegador.