Calculadora de tipos con proporción áurea
Parta de un texto de 16 px y cada título crece según la raíz cuadrada de la proporción áurea, de modo que el título 5 cae justo en 16 por phi. Obtenga pie de foto, texto y seis títulos que se sienten emparentados. Gratis en su navegador.
- Gratis
- Funciona en su navegador
- Sin registro
- Sus datos no salen de su equipo
Ejecutar — gratis
Ejemplo resuelto
- Tamaño base
- 16
- Proporción áurea
- 1,6180339888 px
- Razón de paso
- 1,2720196495
- Cuerpo
- 16
- Pequeño
- 12,5784220441
La proporción áurea es la constante clásica phi, igual a uno más la raíz cuadrada de cinco, todo entre dos, aproximadamente uno coma seis uno ocho en decimal 1.618. Los diseñadores la usan como escala modular para que cada tamaño tipográfico se sienta proporcional al siguiente en lugar de saltar por píxeles arbitrarios. Dé a esta calculadora de tamaños con proporción áurea un tamaño de cuerpo base positivo y obtendrá la escalera completa de encabezados de h1 a h6, el propio cuerpo, un tamaño de pie de foto un semipaso por debajo del cuerpo y una interlínea de cuerpo igual a base por phi. Los semipasos usan la raíz cuadrada de phi para que la escalera siga siendo usable en pantallas y siga siendo geometría pura de proporción áurea.
Cómo la proporción áurea construye una escala tipográfica modular
Parta de un único tamaño de cuerpo base, normalmente dieciséis píxeles o un rem en kits de interfaz actuales. La proporción áurea phi se define exactamente como uno más la raíz cuadrada de cinco, dividido por dos. Una escalera de potencias enteras multiplica por phi en cada paso, lo que salta demasiado para seis niveles de encabezado en una pantalla de lectura normal, por eso este calculador usa el semipaso igual a la raíz cuadrada de phi, cerca de 1.272.
El cuerpo permanece en base por step a la potencia cero. El encabezado de nivel seis es base por step a la primera potencia, el de nivel cinco es base por step al cuadrado, exactamente base por phi, y así hasta el encabezado uno en base por step a la sexta potencia. Un semipaso por debajo del cuerpo es el tamaño small o de pie de foto en base dividido por step.
La interlínea del cuerpo suele fijarse cerca de base por phi porque ese ritmo vertical refleja la misma razón usada en horizontal en maquetaciones clásicas. Una base no positiva se rechaza porque un tamaño de fuente cero o negativo no es un origen modular válido y colapsaría o invertiría la escala. La unidad opcional es solo una etiqueta como px, rem, em o pt; los números no se convierten entre unidades absolutas, lo que mantiene la matemática honesta y determinista para tokens de diseño que pega en propiedades personalizadas CSS.
Dónde aparecen las calculadoras de tipos con proporción áurea
Los sistemas de diseño de producto necesitan constantemente una rampa tipográfica coherente para que las landing de marketing, los ajustes de la app y los centros de ayuda se sientan de una misma familia; un oráculo fiable que devuelva cada encabezado junto al cuerpo y el texto small acelera la autoría de tokens en el traspaso de Figma y en variables CSS.
Las plataformas de blog y los sitios de documentación asignan escalas modulares cuando los editores eligen un tamaño raíz por accesibilidad y necesitan encabezados que sigan dominando sin sopa de píxeles a mano. Las guías de marca y las migraciones de impresión a web reutilizan escaleras de proporción áurea para que carteles, PDF y sitios responsivos compartan jerarquía proporcional aunque la unidad absoluta pase de puntos a rem.
Los autores de planes de estudio de diseño visual introducen la proporción áurea con calculadoras en vivo para que el alumnado vea cómo phi se convierte en valores rem concretos y no solo en un diagrama de rectángulo. Si más adelante necesita paletas de color, rejillas de espaciado ajenas a la tipografía, calculadoras fluidas de clamp() o alineación óptica de márgenes, trátelos como intenciones de búsqueda y aterrizajes distintos en lugar de sobrecargar esta página de calculadora de tamaños con proporción áurea.
Qué puede hacer con ella
Tokens tipográficos de design system
Genere valores h1–h6, body, small e interlínea desde un tamaño base para que las variables CSS y los estilos de texto de Figma sigan una escala modular áurea.
Guías de estilo de blogs y documentación
Elija un tamaño de cuerpo legible por accesibilidad y derive encabezados proporcionales para artículos largos sin saltos arbitrarios de píxeles.
Preguntas frecuentes
¿Qué es una escala de tamaños de fuente con proporción áurea?
Es una escala tipográfica modular en la que los tamaños se relacionan por la proporción áurea φ ≈ 1.618 (o semipasos √φ). Desde un tamaño de cuerpo base multiplica por potencias sucesivas del step ratio para obtener h6 hasta h1.
¿Qué campos son obligatorios?
base (tamaño de fuente del cuerpo) es obligatorio y debe ser finito y estrictamente positivo. unit es opcional y por defecto es px; etiqueta tamaños y no convierte entre unidades.
¿Qué ocurre si el tamaño base es cero o negativo?
Una base no positiva no es un origen válido para una escala tipográfica modular y se rechaza en lugar de inventar tamaños.
¿Cómo se relacionan h1–h6 con la base?
Así h6 está un semipaso por encima del cuerpo, h5 es base × φ y h1 está seis semipasos por encima del cuerpo.
¿Cuánto cuesta?
La herramienta del navegador es gratuita y se ejecuta en local.
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/hobby/golden-ratio-type \
-H "Authorization: Bearer $KIT_KEY" \
-H "Content-Type: application/json" \
-d '{"base":16}'const res = await fetch("https://api.kit.forhosting.com/hobby/golden-ratio-type", {
method: "POST",
headers: {
"Authorization": `Bearer ${process.env.KIT_KEY}`,
"Content-Type": "application/json"
},
body: JSON.stringify({
"base": 16
})
});
const { task_id } = await res.json();import os, requests
res = requests.post(
"https://api.kit.forhosting.com/hobby/golden-ratio-type",
headers={"Authorization": f"Bearer {os.environ['KIT_KEY']}"},
json={
"base": 16
},
)
task_id = res.json()["task_id"]<?php
$res = file_get_contents("https://api.kit.forhosting.com/hobby/golden-ratio-type", false, stream_context_create([
"http" => [
"method" => "POST",
"header" => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
"content" => '{"base":16}',
],
]));
$task = json_decode($res, true);body := bytes.NewBufferString(`{"base":16}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/hobby/golden-ratio-type", 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
{
"base": 16
}Ejemplo de respuesta
{
"task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
"type": "hobby.golden_ratio_type",
"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.
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
Bases cero, negativas, ausentes, NaN e Infinity fallan con invalid_input claro para que una escala rota no llegue al CSS.
Cómo la proporción áurea construye una escala tipográfica modular
La tubería es aritmética de punto flotante pura sin red, semillas aleatorias ni marcas de tiempo de reloj, de modo que la misma base y unidad producen siempre el mismo JSON.
Qué envía y qué recibe a cambio
Envíe base como número finito positivo para el tamaño de fuente del cuerpo. Opcionalmente envíe unit como etiqueta breve como px o rem; por defecto es px y solo anota etiquetas, nunca convierte magnitudes. Comprobaciones clásicas: base dieciséis píxeles da body dieciséis, h5 igual a dieciséis por phi, y h1 igual a dieciséis por step a la sexta; base un rem para sistemas de diseño relativos a la raíz; y base dieciocho para cuerpos editoriales un poco mayores. Los alias incluyen base_size, font_size, size, body, body_size y base_font. Base ausente, cadenas no numéricas, NaN, Infinity, cero y valores negativos fallan con invalid_input y no se cobran. Si tiene éxito, la respuesta repite base y unit limpios, las constantes exactas golden_ratio y step_ratio, los tamaños body y small, un objeto headings con h1 a h6, campos planos h1 a h6 para clientes simples, line_height y line_height_ratio, un array scale de filas rol tamaño exponente y etiqueta desde h1 hasta small, etiquetas legibles para cada rol, más texto formula y method golden_ratio_type para que las pruebas afirmen el algoritmo. El precio de las llamadas API correctas es la base publicada de $0.002 por elemento; los fallos de validación no consumen saldo prepago.
Dónde aparecen las calculadoras de tipos con proporción áurea
Los ingenieros front-end que escriben paquetes de tema quieren JSON determinista que puedan capturar en CI en lugar de juzgar a ojo capturas del navegador para cada base. Como esta capacidad es un motor parse puro, el precio de la API es la base publicada de $0.002 por elemento correcto y la validación fallida no consume saldo.
Casos de integración
Paquetes de tema y fixtures de CI
Produzca en masa rampas tipográficas deterministas para varias bases y capture el JSON en pruebas de regresión antes de publicar un tema.