La firma del arquitecto: un solo sistema para todas las empresas del grupo.

DARXI no es una agencia. Es el autor de las arquitecturas que corren detrás de cada empresa del holding. Este documento es la prueba pública de eso — y la única fuente de verdad para cualquiera que dibuje, escriba o construya en nombre de la marca.

Versión 1.0 28 · 07 · 2026 Lima, Perú darxi.io
01

Construcción

Todo se dibuja sobre una retícula de altura de caja 100 con peso de asta 17. Cada nodo está puesto a mano: no hay vectorizado automático en ninguna parte del sistema.

100 157 10

La X no cruza. Se empalma.

Cuatro piezas sueltas que no se tocan. Un trazo se corta recto y el otro en sesgo: las puntas se traban desplazadas, dejando una junta abierta de 10 unidades. Es un empalme de arquitectura, no un cruce tipográfico. Es el único elemento de la marca que puede vivir solo: de ahí salen el ícono, el favicon y el acento de color.

Altura de caja100
Peso de asta17
Junta abierta10
Tracking base48
Kerning ópticoDA +0 · AR +4 · RX −4 · XI −2
Ancho del wordmark717

La A sin travesaño no es un capricho: su ápice repite el ángulo de las diagonales de la X, y es lo que hace que el wordmark se lea como un dibujo y no como una fuente elegida.

02

Variantes

Nueve archivos, un solo dibujo. Cada uno tiene un lugar; ninguno es intercambiable con otro.

Primario sobre oscuro
darxi-wordmark-white.svg
Primario sobre claro
darxi-wordmark.svg
Ceremonial
Portadas y OG · nunca en interfaz
Dispositivo X
Cuando el nombre ya está en contexto
Monograma D/X
Avatares y créditos
Ícono de aplicación
Store · PWA · escritorio
03

Escala y límites

El wordmark no baja de 96px de ancho. El dispositivo X no baja de 16px. Debajo de eso, la marca deja de ser la marca.

340 px
176 px
96 px · mínimo

Por qué existe una variante compacta

A 16 píxeles, la junta de 10 unidades se cierra por antialiasing y el dispositivo colapsa en una X genérica — se pierde exactamente lo que hace propia a la marca. La variante compacta engrosa las astas y abre la junta al doble. Abajo, los dos archivos rasterizados a 16 px reales y ampliados sin suavizado.

Dispositivo estándar rasterizado a 16 píxeles
Dibujo estándar a 16 px
La junta se cierra
Variante compacta rasterizada a 16 píxeles
Variante compacta a 16 px
La junta sobrevive

La compacta se usa solo en el favicon. En cualquier otro tamaño, el dibujo estándar.

04

Color

Cuatro escalones de tinta, no un negro plano. El #000 puro se reserva para impresión: en pantalla fatiga y aplana la jerarquía.

Tinta
Fondo#060607
Negro de marca#0A0A0B
Superficie#121214
Superficie +2#1B1B1F
Borde sólido#2A2A30
Papel
Blanco de marca#FAFAFA
Papel 100#F2F2F3
Papel 200#E6E6E8
Papel 300#D4D4D8
Acento
Índigo eléctrico#4F3BE8
Hover#6450F0
Pulsado#4232C9
El acento ocupa menos del 5% de la pantalla.

Vive en el estado activo de la navegación, un CTA primario, un dato clave o un indicador de estado. Nunca en titulares ni en fondos de sección. Siempre plano: sin degradado, sin glow, sin halo radial. El púrpura con resplandor es el aspecto genérico del SaaS con IA de 2024–2026, y es exactamente lo que esta marca no es.

Texto sobre oscuro: primario al 94%, secundario al 58%, terciario al 34%. Nunca #FFF puro en párrafos.

05

Tipografía

Geist para display, interfaz y cuerpo. Geist Mono para metadatos, etiquetas de sector, cifras y código. Ambas SIL OFL. El wordmark nunca se compone con ellas: es dibujo propio, siempre SVG.

DARXI 0123
Geist · Variable 400–600
LEGAL-TECH · EDTECH · 2026
Geist Mono · Variable 400–500

Escala cerrada

Nueve tamaños. Si algo no encaja, cambia el tamaño de la caja, no el del texto.

96 · display

Arquitectura

64 · display

Arquitectura

40 · título

Arquitectura

28 · título

Arquitectura

20 · subtítulo

Arquitectura

16 · cuerpo

Arquitectura

13 · nota

Arquitectura

11 · etiqueta

ARQUITECTURA

Tres pesos

400, 500, 600. Sin Bold 700 ni Black: el peso alto grita, y la marca no.

Tracking

Display −0.03em · cuerpo −0.01em · mono en versalitas +0.08em.

Mono es para datos

Etiquetas, años, sectores, cifras e índices. Nunca para párrafos.

06

Retícula, espacio y movimiento

Doce columnas, medianil 24, ancho máximo 1280. La retícula se ve — es lo que da precisión sin agregar color, y sustituye a la ilustración, que esta marca no usa. Las columnas de fondo de esta página son ese sistema en funcionamiento.

Espacio en base 4

4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 96 · 128 · 192. El aire va entre bloques densos, no dentro de ellos.

Esquina viva

El radio se gana: 4px en controles, 8px en tarjetas, 12px en superficies grandes. 22.37% solo en el ícono de aplicación.

Movimiento contenido

Fades de 150–300ms al entrar en viewport. Hover que revela un borde o desplaza 3px — como esta tarjeta. Nada de parallax global ni scroll hijack.

Un único momento de movimiento caro por página, en el hero. La sensación de autoridad viene de que el sitio responde rápido, no de que se mueva mucho. prefers-reduced-motion desactiva todo.

07

Usos incorrectos

Cada ejemplo de abajo está mal a propósito. Si dudas de una aplicación, compárala con esta página.

No estirar

Las proporciones son la geometría. Escalar sí; deformar nunca.

No rotar

La marca siempre a nivel. Un logotipo inclinado es un logotipo caído.

Sin sombra ni relieve

Plano siempre. La sombra se ve cara en un JPG y barata en pantalla.

No encerrar

Ni píldora, ni rombo, ni escudo. El aire de respeto es el único contenedor.

DARXI
No recomponer con tipografía

El wordmark es un dibujo con kerning propio. Escribirlo con una fuente no es la marca.

El acento solo en la X

El índigo marca el empalme. Sobre cualquier otra letra pierde su razón de ser.

08

Archivos

La geometría es la fuente de verdad; todo lo demás se genera. Tras cualquier cambio de dibujo: node src/build.mjs && ./src/export.sh

brand/
├── src/
│   ├── glyphs.mjs      geometría autoral — la fuente de verdad
│   ├── build.mjs       genera los 17 SVG
│   └── export.sh       rasteriza la colección PNG
├── logo/               wordmark · ícono · monograma · lockups · app icon
├── favicon/            SVG · ICO · PNG 16/32/48 · apple-touch · PWA 192/512
├── social/             OG image · twitter card
├── png/                400 / 800 / 1600 / 3200 y tamaños de ícono
├── tokens.css          custom properties, tema oscuro y claro
├── tokens.json         los mismos tokens para herramientas
└── DESIGN-SYSTEM.md    la especificación escrita
Volver al sitio