Telegram, WhatsApp+380637610482
Valery Danyuk
Valery DanyukreveladorDesarrollamos herramientas de IA para empresas. De alta calidad. A precios asequibles.Escribir por Telegram
Vivid+Co — una vista previa de un sitio con este estilo

Vivid+Co

luz prismática a través de la obsidiana

Vivid+Co opera en un vacío oscuro y cinematográfico: un lienzo casi negro de #101010–#495764, interrumpido por un único tono casi blanco (#fffdf9) utilizado para casi todas las tipografías y elementos de la interfaz. La tipografía se presenta principalmente en Neue Montreal con un grosor de 400, un rechazo deliberado a la negrita, donde la autoridad se logra a través de la escala (136px y 105px) en lugar del grosor. Una técnica distintiva es el prisma cromático: bloques de luz roja/verde/azul saturada, separados por RGB, se filtran a través de cubos de vidrio, interrumpiendo la superficie monocromática. El diseño es centrado y espacioso; la navegación, el texto principal y los enlaces están todos en un solo color #fffdf9, sin botones de acento, rellenos ni sombras separados; la diferenciación se logra a través del espaciado, la escala y un artefacto de arcoíris que sirve como el único acento de color de la marca.

Un lienzo oscuro de ancho completo con una sola columna de contenido que mide ~1440px como máximo. El elemento principal es un artefacto prismático centrado con un título superpuesto (texto que intersecta los cubos) y un subtítulo alineado a la izquierda. La navegación se encuentra en una delgada barra superior: el logotipo a la izquierda, cuatro enlaces invisibles a la derecha y un botón dedicado de "Contacto" al final de la fila. El ritmo de la sección alterna entre paneles principales de altura completa y tiras de contenido más estrechas con espacios de ~108px. El diseño del contenido es asimétrico: el artefacto prismático sirve como centro visual y los títulos lo rodean. Los bloques de texto de una sola columna tienen un ancho máximo de aproximadamente 440px; no hay cuadrículas de varias columnas, matrices de tarjetas ni tablas de precios. El pie de página es una delgada tira, dividida por una delgada línea, con dos columnas de metadatos.

El elemento de diseño principal es una imagen abstracta en 3D de cubos de vidrio con aberración cromática en los bordes, separados por colores RGB. No hay fotografías, ni imágenes de personas, ni tomas de productos. El prisma es la imagen de la marca; todo lo demás es tipografía monocromática sobre un fondo oscuro. La iconografía es mínima: sutiles etiquetas de navegación y un pequeño acento de cursor/glifo (área 142765) al final de uno de los encabezados sugieren un único icono monolineal de 16 píxeles. No hay ilustraciones, ni patrones decorativos, ni texturas.

Paleta

Neutral

  • Bone White #fffdf9 — El texto principal, las etiquetas de navegación, el color de los enlaces y el relleno de los encabezados son casi blancos, ocupando todas las superficies tipográficas sobre un fondo oscuro.
  • Obsidian #101010 — El lienzo de la página, que sirve de fondo para las franjas principales y divisorias, es de un color negro intenso con un efecto prismático en su interior.
  • Graphite Veil #495764 — Detrás de los títulos y los bloques de contenido, predomina un tono gris oscuro y frío, que aporta profundidad al lienzo sin necesidad de utilizar un negro plano.
  • Ash Border #403f3f — Se utiliza una sutil línea divisoria y el contorno de la tarjeta a 1 píxel para separar las líneas sin que compitan con el texto.
  • Fog Blue #6f879c — Texto secundario discreto y etiquetas de botones sutiles (contraste de 3,7:1): las designaciones de categorías de servicio, como "Estrategia", "Creatividad" y "Comunicación + Marketing", se perciben como metadatos sin resaltar.
  • Pure Black #000000 — Relleno decorativo para iconos e ilustraciones SVG: se utiliza en la imagen del prisma y en los glifos de los iconos; no es un fondo.

Tipografía

De 15 a 136 píxeles · 9 pasos

  • Neue Montreal — reemplazo: Söhne · esquemas 400, 700 · La tipografía exclusiva se utiliza en toda la interfaz de usuario: títulos, texto principal, navegación, botones, enlaces y pie de página. El grosor predeterminado es de 400; el de 700 está reservado exclusivamente para los subtítulos. Los títulos con grosores de 105 px y 136 px tienen un interlineado de 1,00–1,01 em y un espaciado entre letras de -0,02 em, lo que crea titulares cinematográficos y apilados que resultan más esculturales que tipográficos.

Intervalos y forma

ObjetivoSignificado
Densidadespacioso
Paso básico7px
Radio del botón0px
Radio de la tarjeta15px
Oscuridadno - bordes en lugar de sombras
Entre secciones108px
Ancho de página1440px

La IA construirá tu sitio web al estilo de Vivid+Co 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

  • Sequel — Una proyección privada al anochecer es la única luz cálida en un cine que, por lo demás, está a oscuras.
  • ThoughtLab — Un monumento de obsidiana con una señal carmesí. Un lienzo de vacío negro, donde el único objeto de color rojo intenso en la catedral, impreso en grandes letras blancas, es una sola figura cromática.
  • Dovetail — Un plano bajo una luna negra: líneas gráficas apenas visibles, fuente blanca, un destello púrpura.
  • MekaVerse — Una galería monocromática de artefactos digitales: un vacío negro sólido donde el mundo renderizado cuelga como una pieza de museo, y toda la interfaz de usuario es tinta blanca sobre cristal negro mate.
  • Krea — galería noir a medianoche
  • Factory — La terminal de la "sala de guerra" a medianoche. La "fábrica" es un panel de control de un negro austero donde una sola tarjeta blanca aterriza como un despacho iluminado por una linterna; el único objeto en la sala es el trabajo en sí.
  • basement — Una imprenta vacía a las 3 de la madrugada: fuentes enormes y comprimidas que se extienden sobre la oscuridad absoluta, un único destello de luz naranja en la barra de navegación, todo lo demás blanco o gris fantasmal.
  • Stink Studios — Un estudio de cine a medianoche: el proyector zumba, la sala está oscura, solo la película está iluminada.
  • Apple (España) — Teatro negro con iluminación ambiental.
  • Charlie — Tipografía tallada en piedra de monasterio sobre obsidiana. Un portafolio donde una sola pared roja crea un silencio ensordecedor.
  • Rive — Visión nocturna de alta precisión. La interfaz incorpora una lente especial que penetra la oscuridad para enfocar los detalles técnicos con absoluta claridad.
  • Datalands — Una catedral negra con un único pulso de neón. El logotipo llena la nave; todo lo demás es texto apenas audible debajo.