DANIEL_OS v1.0·STATUS: AVAILABLE FOR WORK--:--:--
← Design Systems
// KINETIK

Midnight Pro

Kinetik Studio — dark-only, gris + acento cian único

Producto

kinetik-site + panel interno "Supercomputer AI / AI Command Center" (Lovable)

Fuente de verdad

Figma "Kinetik Studio Design System" — página 🎨 Color

Generaciones

Una sola — sin rediseños documentados

Estado

Documentado internamente; no expuesto en texto en el sitio público

Cómo se construyó

A diferencia de Serenia, Midnight Pro no tiene generaciones previas: se construyó de una sola vez como librería de todo el estudio, para que cualquier producto nuevo de Kinetik sea consistente pixel-perfect sin reinventar tokens cada vez.

La decisión de diseño más deliberada es el lenguaje visual: en vez de un dashboard SaaS genérico, todo se siente como el panel de control de un sistema en vivo — status bar con reloj corriendo, badges de estado con punto pulsante, terminales simuladas. Es el mismo vocabulario del negocio (agentes autónomos, "trabajadores digitales") traducido a interfaz.

Gray ramp (950 → 50)

95090085080070060050040030020010050

Cyan ramp — único acento

90060050040030050

Tokens

bg-base#050507Fondo base de toda la app
bg-surface#0a0a0fSuperficie estándar de paneles
bg-raised#14141bCards y elementos elevados
bg-overlay#0f0f15Modales y overlays
text-primary#f4f4f8Texto principal
text-secondary#8b8b9eTexto de apoyo
text-tertiary#5a5a6bLabels, metadatos
accent-default#22d3eeÚnico acento — CTAs, focus, glow
accent-hover#67e8f9Estado hover del acento
accent-muted#083344Fondos con tinte de acento
state-success#34d399Confirmaciones, "[ACTIVE]"
state-warning#fbbf24Advertencias
state-danger#f87171Errores, "[ERROR]"

Tipografía

Space GroteskTítulos y encabezados
JetBrains MonoKINETIK_OS v1.0 · STATUS: ONLINE · LATENCY 9ms
Inter — labelsPROYECTOS · CONEXIONES · GRAY · CYAN

Vocabulario visual

Estado actual

Es el más maduro de los dos en documentación: rampas completas, capa semántica completa, tres roles tipográficos sin ambigüedad, y un vocabulario de componentes con nombre propio. El único vacío real es de divulgación, no de definición — el detalle de tokens vive en Figma y en la guía interna, no en texto rastreable del sitio público.

← Design Systems