Sobre esta plantilla
Stark Minimal Footer conserva el rastro de sus decisiones: el brief que hay detrás de pie de página ocupa 5.437 caracteres. Abre con “© 2026 EngineTech. All rights reserved” y le da el marco a esa línea en lugar de encogerla en una tarjeta. La paleta es negro #0A0A0A de base y blanco #FFFFFF para la tipografía, con la tipografía Geist. Se entrega como un único componente, así que el conjunto de pie de página se puede trasladar a un proyecto sin traspaso de diseño. El movimiento se limita a transiciones de 180ms, lo bastante discreto para que el texto siga mandando. Esta referencia es para una empresa industrial que quiere la primera pantalla resuelta antes de empezar a construir.
Pensado para
- Pensado para estudios que tienen que explicar a un cliente el comportamiento a 1820px sin construir antes un prototipo.
- Equipos de growth que retintan su pie de página de una empresa industrial y quieren conservar el marco de 640x472 mientras cambia el texto de la oferta.
- La página sirve a desarrolladores front-end que rehacen su pie de página de una empresa industrial en un único componente y buscan los números que hay detrás del aspecto.
Qué incluye
- Los enlaces colapsan a un ancho. La navegación es una sola fila, sin un segundo nivel debajo. Por debajo de 1820px los enlaces se pliegan en una superposición a pantalla completa. Por debajo de 1820px los enlaces colapsan en lugar de saltar a una segunda línea.
- Franja de datos, no tabla. Una franja compacta de cifras sostiene las afirmaciones que de otro modo pedirían un párrafo, lo que evita que la composición de pie de página se convierta en una lista de funciones. Las etiquetas van bajo las cifras, en el paso más pequeño del brief, así la fila se lee como dato y no como adorno. La captura de la referencia es de 640x472.
- Una familia, dos papeles. Las fuentes tienen papeles asignados y no se mezclan: Geist sostiene a la vez la línea display y la interfaz. Cambiar de tipografía es seguro mientras los tamaños y los pesos se queden donde los puso el brief. Conserva los pasos de tamaño aunque cambies la fuente.
- La escala se limita, no se escalona. Lo alto de la escala es fluido (un clamp entre 22px y 14px) y el resto es fijo, así el marco se mantiene compuesto a medida que se estrecha el viewport. El tipo cambia de tamaño, no de papel, a medida que se estrecha el viewport. Conserva la jerarquía; cambia la escala.
Movimiento e interacción
Una duración para los controles
Cada cambio de estado de la especificación lleva una duración: las transiciones se resuelven en torno a 180ms. Nada queda en el valor por defecto del navegador, y por eso la página se siente diseñada y no animada. La misma duración se reutiliza en todos los controles, lo que mantiene las interacciones como un solo sistema. Mantén las duraciones cuando rehagas la piel de la página.
Puntero solo donde ayuda
La capa interactiva es pequeña a propósito: estados hover en los botones y los enlaces y no en todas las tarjetas. Los estados de pulsación están especificados igual que el hover, así que un toque confirma lo mismo que un clic.
El orden detrás de pie de página
Podrías reordenar estos bloques y la página seguiría cargando. Pero dejaría de leerse como un argumento: navegación, la fila de cifras y el pie de página son una secuencia, y pasos de espaciado de 14px y transiciones de 180ms solo funcionan en ese orden. Quien busca industria recibe la oferta antes que las opciones.
Las cifras detrás de pie de página
Esto es lo que hace reutilizable la referencia: pasos de espaciado de 14px, transiciones de 180ms y un breakpoint de 1820px. Nada queda en un valor por defecto, así que una sustitución que conserve esos números conserva la composición. Nada de este tipo de pie de página depende de un valor por defecto.
El reflujo de pie de página
Si tus breakpoints se eligieron para que todo cupiera y no para cambiar la maquetación, lee esta ficha: la escala es fluida en lugar de escalonada y la maquetación cambia a 1820px en lugar de una lista de elementos escondidos. La escala cambia con el viewport; la secuencia, no.
Preguntas frecuentes
¿Puedo reconstruir este diseño de pie de página de Stark Minimal Footer con otro stack?
Stark Minimal Footer se construyó en un único componente, y la ficha lo dice por procedencia. El brief describe posiciones, tamaños y tiempos, así que se puede reconstruir en cualquier framework capaz de componer tipografía y colocar elementos.
¿Cuánto ocupa el prompt que hay detrás de Stark Minimal Footer?
El brief capturado ocupa 5.437 caracteres y describe la maqueta, la escala tipográfica, la paleta y las transiciones. Copiarlo te da ese texto; si lo mandas a Studio, la misma petición queda preparada con la página ya descrita.
¿Puedo quedarme con las transiciones de Stark Minimal Footer y cambiar los tiempos?
Las entradas y los cambios de estado se quedan en 180ms. Los dispara un cambio de estado, no una biblioteca de scroll, y nunca retrasan el contenido.
