Calculadora de viñeta
Con una intensidad de 0,35, las esquinas de una imagen de 1920×1080 conservan el 65 % de su brillo, un oscurecimiento del 35 %, y el centro queda intacto. Indique ancho, alto e intensidad para obtener el factor de esquina y la distancia en píxeles. Gratis en su navegador.
- Gratis
- Funciona en su navegador
- Sin registro
- Sus datos no salen de su equipo
Ejecutar — gratis
Ejemplo resuelto
- Ancho
- 1 920
- Altura
- 1 080
- Fuerza
- 0,35
- Factor del centro
- 1
- Factor de la esquina
- 0,65
- Esquina frente al centro
- 0,65
- Oscurecimiento de la esquina (%)
- 35
Esta calculadora de efecto viñeta convierte la anchura, la altura y la intensidad de una imagen en una comparación clara del brillo entre el centro y las esquinas. Emplea un modelo radial cuadrático normalizado: el centro conserva un factor de uno y cada esquina recibe la máxima reducción solicitada. El resultado incluye el multiplicador de esquina, el porcentaje de oscurecimiento y el radio en píxeles desde el centro hasta la esquina, datos útiles para planificar el efecto antes de renderizarlo en un editor, shader, lienzo o flujo de procesamiento de imágenes.
Interprete los factores de brillo antes de aplicar el efecto
Una viñeta reduce el brillo conforme los píxeles se alejan del centro de la imagen. Esta calculadora expresa el cambio como un multiplicador, por lo que el resultado se puede trasladar a editores y código de renderizado. El factor central siempre es 1: el centro conserva su brillo original.
Si el factor de esquina es 0.65, la esquina mantiene el 65 por ciento de los valores originales de sus canales bajo este modelo simplificado y queda un 35 por ciento más oscura que el centro. Una intensidad de 0 no altera nada; una intensidad de 1 lleva el factor teórico de la esquina a cero. La herramienta no modifica ni examina una imagen cargada, sino que estima la máscara a partir de datos numéricos.
Esto permite comparar ajustes, documentar una especificación creativa o entender un control antes de renderizar un recurso grande. Considere el multiplicador como una máscara para luz lineal o como aproximación si su editor utiliza otro espacio de color.
Comprenda el modelo radial cuadrático
El cálculo sitúa el centro de la imagen a distancia radial cero y normaliza como uno la distancia hasta cualquier esquina. Para un radio normalizado r, el multiplicador de brillo es 1 menos la intensidad multiplicada por r al cuadrado. Elevar el radio al cuadrado mantiene gradual el cambio en la zona central y acelera el oscurecimiento hacia el exterior.
En el centro exacto, r vale cero y el multiplicador permanece en 1. En cada esquina, r vale uno y el multiplicador resulta 1 menos la intensidad. La anchura y la altura determinan el radio físico en píxeles mediante la distancia pitagórica entre sus mitades.
No cambian el factor normalizado de esquina, pues cada rectángulo se normaliza respecto de su propio radio. Es una definición deliberada y reproducible; no implica que todos los editores empleen la misma curva. Un programa puede ofrecer punto medio, redondez, calado, perfiles de lente o mezcla con corrección gamma y producir otra transición aunque coincida el multiplicador final.
Use la estimación en diseño e implementación
Introduzca las dimensiones finales en píxeles y una intensidad entre cero y uno. Use el factor devuelto cuando necesite una condición compacta, por ejemplo que las esquinas conserven el 72 por ciento del brillo central. El porcentaje de oscurecimiento resulta más directo al hablar con diseñadores o comparar ajustes preestablecidos.
El radio en píxeles ayuda a implementar la máscara en Canvas, WebGL, CSS o un renderizador sin conexión, porque proporciona la distancia con la que se normaliza cada píxel. Mida la distancia de un píxel al centro, divídala por el radio indicado, limite el valor normalizado a uno, elévelo al cuadrado, multiplíquelo por la intensidad y reste el resultado de uno. Multiplique después el brillo original por ese factor.
Si trabaja con RGB codificado en sRGB, recuerde que multiplicar canales directamente no equivale físicamente a operar en luz lineal, aunque quizá sea el efecto artístico deseado. Revise siempre la imagen, sobre todo los bordes, y adapte la curva si necesita imitar un editor concreto.
Qué puede hacer con ella
Planificar un ajuste fotográfico
Convierta una intensidad propuesta en un multiplicador explícito antes de aplicar el ajuste a toda una colección.
Especificar una máscara de shader
Use el radio de esquina y el modelo cuadrático para implementar una máscara radial determinista en un flujo gráfico.
Comparar decisiones creativas
Explique la retención de brillo y el porcentaje de oscurecimiento de dos intensidades sin renderizar cada imagen candidata.
Preguntas frecuentes
¿Qué significa el factor de esquina?
Es el multiplicador de brillo de cada esquina respecto del centro intacto. Un factor de 0.7 indica que la esquina conserva el 70 por ciento del brillo central modelado.
¿Por qué las cuatro esquinas son iguales?
El modelo es radial y está centrado, de modo que todas las esquinas quedan a la misma distancia normalizada aunque difieran la anchura y la altura.
¿Por qué importan las dimensiones si el factor depende de la intensidad?
Las dimensiones fijan el radio en píxeles desde el centro hasta la esquina, necesario para normalizar distancias al implementar la máscara.
¿La herramienta modifica mi imagen?
No. Solo calcula factores numéricos; no carga, decodifica, renderiza ni devuelve ninguna imagen.
¿Mi editor de fotos dará exactamente la misma viñeta?
No necesariamente. Los editores añaden ajustes como punto medio, redondez, difuminado, perfiles de objetivo o mezcla según la gamma, así que la transición puede verse distinta aunque el valor de las esquinas coincida.
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/vignette-estimate \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"width":1920,"height":1080,"strength":0.35}'const res = await fetch("https://api.kit.forhosting.com/image/vignette-estimate", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"width": 1920,
"height": 1080,
"strength": 0.35
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/image/vignette-estimate",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"width": 1920,
"height": 1080,
"strength": 0.35
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/vignette-estimate", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"width":1920,"height":1080,"strength":0.35}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"width":1920,"height":1080,"strength":0.35}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/vignette-estimate", 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
{
"width": 1920,
"height": 1080,
"strength": 0.35
}Ejemplo de respuesta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "image.vignette_estimate",
"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. |
Preguntas técnicas
¿Qué sucede si la intensidad queda fuera del intervalo de 0 a 1?
La solicitud devuelve un error invalid_input porque los valores fuera del intervalo inclusivo no pertenecen a este modelo.
¿Cuánto cuesta una solicitud a la API?
Cada solicitud a la API cuesta $0.002. La versión del navegador ejecuta localmente el mismo cálculo determinista.