Huly
Auroras boreales en el Observatorio de Medianoche: el protagonista es un rayo vertical de color púrpura que se desvanece en coral, y cada sección tranquila debajo de él toma prestada la misma historia de dos tonos contada en un tono más sobrio.
Huly evoca la atmósfera de un espacio de trabajo cósmico: un lienzo casi negro con un único resplandor violeta-ámbar que atraviesa el elemento principal, y debajo, una cuadrícula más tenue para una mayor productividad. El sistema opera dentro de una gama cromática reducida: un azul brillante y un coral se encargan de toda la identidad visual sobre superficies de grafito superpuestas, por lo que el modo oscuro nunca resulta neutro. La tipografía es de estilo Inter para todo lo funcional, con una fuente personalizada (Esbuild) reservada para los puntos clave, con un espaciado entre letras de 80-84 px y un espaciado negativo agresivo. Los componentes tienen forma de cápsula: radios de 9999 px en los controles, 12 px en las tarjetas, sombra mínima y líneas degradadas brillantes como decoración principal. La página alterna entre áreas oscuras de página completa y secciones claras y tranquilas, por lo que cualquier nueva pantalla debe definir el modo antes de elegir los colores.
La página de inicio de ancho completo presenta un haz vertical de auroras boreales y un titular alineado a la izquierda, junto con una captura de pantalla del producto ubicada en la esquina inferior derecha. Debajo de la página de inicio hay un área de contenido de ancho máximo, 1200px, con franjas oscuras y claras alternadas. Cada sección es un único bloque vertical: un encabezado más una cuadrícula de tarjetas de 3 o 4 columnas separadas por espacios de 96px. La sección "MetaBrain" rompe la cuadrícula con un titular centrado y un mosaico de tarjetas de diferentes tamaños (una tarjeta principal grande más tarjetas de apoyo más pequeñas). La página tiene mucho contenido, siguiendo los estándares SaaS, pero utiliza franjas oscuras y claras alternadas para dar espacio a cada sección. La navegación es una única barra superior transparente que se vuelve opaca al desplazarse.
El elemento principal es un degradado de aurora boreal puro, sin fotografías. Todas las ilustraciones son capturas de pantalla reales de la interfaz de usuario del producto (Kanban en modo oscuro, bandeja de entrada, calendario), enmarcadas en marcos de tarjetas que sirven tanto de evidencia como de decoración. No hay fotos de estilo de vida, ni imágenes de archivo, ni renders 3D. El único elemento visual no relacionado con la interfaz de usuario es un cálido resplandor radial en la base de la aurora boreal, renderizado como un degradado CSS. Los iconos son monocromáticos, de línea, en color #95979 o blanco; nunca multicolor. El sistema trata su propia interfaz de usuario oscura como el elemento principal; el producto son las fotografías.
Paleta
Marca
- Electric Iris
#5683da— El fondo principal, el indicador de navegación activo y el llamativo detalle de la aurora boreal —un vibrante color azul violeta sobre un fondo negro azabache— crean una impresión de compromiso más que de actividad corporativa. - Ember Pulse
#ff8964— Un acento secundario, una cálida zona de auroras boreales, un punto de notificación y un elemento destacado en la ilustración: un tono ámbar que rompe la sobriedad del azul y añade calidez al haz de luz.
Neutral
- Obsidian Canvas
#303236— El fondo de la página, la superficie dominante, es de un color casi negro con un ligero matiz cálido, el entorno estándar para todo el contenido. - Void
#090a0c— La capa superficial más profunda para los degradados en la pantalla principal, los fondos modales y los marcos que deben integrarse en el lienzo. - Charcoal Card
#111111— Superficies elevadas hechas de cartón y paneles, colocadas un escalón por encima del lienzo. - Slate Edge
#4a4b50— Bordes y separadores sutiles en superficies oscuras - Iron Veil
#6b6c6d— Fondo atenuado para etiquetas, rellenos de elementos de lista y rellenos deshabilitados. - Smoke
#95979e— Los contornos de los iconos, el texto adicional y los controles inactivos son los elementos principales de trabajo, representados en gris medio.
Tipografía
De 11 a 80 píxeles · 8 pasos
- Inter — reemplazo: DM Sans · esquemas 300, 400, 500, 600, 700 · Todo el texto funcional de la interfaz de usuario (texto principal, navegación, botones, elementos de lista, etiquetas y encabezados pequeños) se utiliza con un grosor de fuente de 500-600 para resaltar, 400 para el texto principal y 300 de forma esporádica para metadatos discretos.
- Esbuild — reemplazo: Sora · esquemas 400, 500, 600 · Solo para visualización: títulos de inicio, encabezados de sección y títulos de artículos de MetaBrain. La geometría condensada y el espaciado reducido entre letras dan la impresión de que 84 px es más adecuado para trabajos editoriales que para proyectos SaaS. Nunca utilice un tamaño inferior a 28 px.
Intervalos y forma
| Objetivo | Significado |
|---|---|
| Densidad | espacioso |
| Paso básico | 12px |
| Radio del botón | 9999px |
| Radio de la tarjeta | 12px |
| Oscuridad | sombras suaves |
| Entre secciones | 96px |
| Ancho de página | 1200px |
La IA construirá tu sitio web al estilo de Huly y lo rellenará.
- Rellena con productos y publicaciones a través del enlace - Instagram, TikTok, Facebook.
- Transfiere el contenido de tu antiguo sitio web; solo tienes que especificar la dirección.
- Diseño moderno sobre el mejor motor: React ( Next.js) con renderizado del lado del servidor y optimización SEO integrada.
- Optimización SEO totalmente automatizada para resultados de búsqueda y recomendaciones mediante redes neuronales.
Estilos similares
- monday — Taller blanco con pegatinas en tonos pastel.
- Slack — El escenario es de color berenjena con focos blancos. Un tono ciruela intenso predomina en las zonas oscuras, mientras que el lienzo blanquecino permite que los grandes títulos vanguardistas respiren con libertad.
- Base44 — Cuaderno iluminado por el sol con rotulador verde lima
- Supahub — Luz diurna suave sobre una cresta púrpura. Un lienzo mayormente blanco y etéreo iluminado por un único sol púrpura brillante, con esferas decorativas degradadas que derraman color en el espacio negativo y una generosa geometría redondeada que confiere a cada superficie una agradable y tangible pesadez.
- Raycast — Centro de mando de medianoche, neón coral
- Dimension — un puesto de trabajo iluminado al anochecer con paneles de vidrio esmerilado
- Wiza — Un observatorio de exploración minera al anochecer, envuelto en una bruma de color lavanda.
- Paste — Una linterna ámbar sobre mármol blanco: el logotipo de la marca, con su cálido degradado, flota en el vasto espacio blanco, como la única ventana iluminada en un edificio cubierto de nieve.
- Reworkd — La suave luz natural en el diagrama del producto es el único color que habla por sí mismo, es el botón de acción y el título degradado que está encima.
- Reflect Notes — El espacio violeta estrellado es un observatorio oscuro donde las notas flotan como constelaciones contra un telón de fondo de un vacío índigo casi negro.
- Ameba — La sala de control a medianoche: un pulso azul eléctrico dentro de los paneles de vidrio esmerilado.
- Todoist — Un espacio de trabajo soleado con una agenda de papel: un escritorio color crema cálido, notas escritas con tinta, un bolígrafo rojo.