Plataforma SaaS white-label

Design System Bajar a Tierra

El sistema visual de la plataforma. Identidad Bajar a Tierra por default, lista para que cada cuenta cargue su propia marca. Probá el theme-switcher al final: repinta todo sin tocar un componente.

Probá un tema:

Colores de marca

Son tokens por tenant (--brand-*), no hardcode. Regla dura: magenta para CTAs, amber solo accent.

Teal · primary
#006666
Forest · sidebar
#0b3b43
Ink · texto
#0a1b2f
Cream · editorial
#e5e0d3
Plum · premium
#540545
Magenta · CTA
#b53c93
Pink soft
#f4d4ec
Amber · accent
#e7a83e

Tipografía

Playfair Display · títulos de pantalla
Tu marca, lista para crear
Lora · output editorial y previews de copy generado

Tu libro ya está escrito. Solo falta bajarlo a tierra. Empezá por una idea y la plataforma te propone el resto.

Inter · UI funcional (labels, botones, inputs, tablas)
Generá · Probá otra versión · Guardar borrador · Aprobar
Courier Prime · accent mono (IDs, dominios)
app.tucliente.com · tenant_id: 7b0dfb86

Tokens de sistema

Radios
--r-xs 6
--r-sm 8
--r-md 12
--r-lg 16
--r-xl 22
--r-pill
Sombras
xs
sm
md
lg
cta glow
Espaciado (escala 4px)
1
2
4
6
8
12

Botones

Primario = CTA magenta con glow. Secundario = outline teal. Microcopy siempre en voseo.

Tamaños

Inputs y forms

El punto de partida. La IA infiere el resto.
Ese dominio ya está tomado. Probá otra variante.

Cards

Estudio de creación

Landing, copy, campañas, placas y fotos. Todo desde un brief corto.

Identidad verbal

Tu manual de voz, generado de pocas señales. Editable con un clic.

Premium

Entrená tu marca

Subí tus fotos y la plataforma aprende tu cara y tu estética para cada pieza.

Badges y estados

Aprobado Pendiente Pide cambios En vivo Premium Borrador

Tabs

Suggestion chip · motor de sugerencias

Patrón Vera "vender conversando": una sugerencia por vez, pide permiso, no insiste, conecta con lo que estás haciendo.

Ya tenés la landing. El paso natural es la secuencia de bienvenida por email. ¿La armamos?

✍️

Con este brief sale algo genérico. Si me contás a quién le hablás, lo afinamos.

Tabla

PiezaTipoEstadoActualizada
Landing El MapaLandingAprobadohace 2 h
Bienvenida (3 emails)EmailPendientehace 1 d
Placa de lanzamientoPlacaPide cambioshace 3 d

Empty state

Acá van a vivir tus placas

Generá la primera y arrancamos.

Progress y stepper

Progress
Stepper (wizard del brief)
Marca
2Brief
3Generar
4Revisar
Avatares
KW JC BT

Modal y toast

Mostrados inline para la galería (sin overlay full-screen).

Listo. Tu placa está pronta. ✨
Algo se trabó al generar. Probá de nuevo en un momento.

White-label

El theme-switcher cambia data-tenant-theme en el body y repinta los --brand-*. Mismos componentes, otra marca. Probalo arriba o acá.

En vivo