Materia cromática
Shell
#F4F0E6Kelp
#0B4F3CPersimmon
#FF7043Lagoon
#74DCD4LH-11
Liquid Habitat
La interfaz aprende a fluir.
INTENCIÓN DEL SISTEMA
Sistema líquido y biomórfico inspirado en tensión superficial, arrecifes y membranas. Amable sin volverse infantil.
IDEAL PARAWellnessHerramientas creativasEducación
Voz tipográfica
- Display
- Fraunces Soft / serif amable
- Body
- Manrope
- Utility
- Space Mono
Comportamiento
- Forma
- Metaballs, cavidades y radios asimétricos.
- Movimiento
- Morphing elástico con sensación de viscosidad.
- Firma
- Una membrana conecta controles cercanos de la misma acción.
04 / REGLAS DE VUELOEl sistema funciona
El sistema funciona
cuando decides así.
Haz esto
01La forma explica relación
02El movimiento conserva masa
03La fluidez no sacrifica lectura
Evita esto
×1Blobs aleatorios
×2Resortes exagerados
×3Pasteles sin contraste
05 / COMPONENT KIT
Piezas del universo.
Componentes de referencia para trasladar la dirección visual a un producto completo.
Hero metaball
↗Control líquido
↗Blob card
↗Slider de viscosidad
↗Menú radial
↗Formulario ambiental
↗06 / HANDOFF
Listo para tu agente.
El prompt preserva la intención del tema sin obligar a copiar esta página. Así se adapta al producto que ya existe.
Implementa el sistema visual “Liquid Habitat” (LH-11) de Co.De Strategy Systems Atlas. Intención: Sistema líquido y biomórfico inspirado en tensión superficial, arrecifes y membranas. Amable sin volverse infantil. Paleta: Shell #F4F0E6, Kelp #0B4F3C, Persimmon #FF7043, Lagoon #74DCD4 Tipografía: display Fraunces Soft / serif amable; cuerpo Manrope; utilidad Space Mono. Forma: Metaballs, cavidades y radios asimétricos. Movimiento: Morphing elástico con sensación de viscosidad. Firma visual: Una membrana conecta controles cercanos de la misma acción. Principios: La forma explica relación; El movimiento conserva masa; La fluidez no sacrifica lectura. Evita: Blobs aleatorios; Resortes exagerados; Pasteles sin contraste. Adapta el sistema al producto existente; conserva accesibilidad, semántica, responsive y reduced-motion. No copies la maqueta literalmente: aplica sus reglas.