GestiFalla GestiFalla v1.0 · 2026
Sistema de Diseño · GestiFalla

Gestión profesional
para la falla.

Identidad visual, tokens y componentes para construir un SaaS moderno, confiable y con raíces valencianas — sin caer en el folclorismo.

Mercado
Comisiones falleras
Voz
Cercana · técnica
Estética
Limpia · contemporánea
01 — Marca

Logo y aplicaciones

La llama refleja la foguera sin reproducirla. Tres trazos — oro, rojo y azul — para una identidad gráfica que respira tecnología.

assets/logo.png · 1024×1024
Logotipo oficial GestiFalla
Isotipo
Lockup CSS · claro GestiFalla
Lockup CSS · inverso GestiFalla
Lockup CSS · lino GestiFalla
Lockup CSS · primario GestiFalla
Construcción

Reglas de uso

  • El wordmark se compone siempre en Sora Bold (700) sobre navy #1E3A5F.
  • Mantén un margen mínimo equivalente al ancho de la base de la llama.
  • Nunca rotes, recortes ni reordenes los trazos del isotipo.
  • Sobre fondo oscuro, el wordmark pasa a lino; nunca rojo o naranja.
  • Sobre fotografía, usar el logo dentro de un panel de color sólido.

Tamaños mínimos

16 px · favicon
24 px · UI
40 px · cabecera
72 px · marketing
02 — Color

Paleta cromática

Naranja fuego para acción, navy para confianza, oro para acentos. El contraste claro–oscuro estructura toda la interfaz.

WCAG AA · ratios verificados
Tokens primarios
Primario
Naranja Fuego
#E8520A · acción / CTA
Secundario
Navy
#1E3A5F · estructura / texto
Acento
Oro
#F5A623 · acento / highlight
Superficies y texto
Fondo claro
Lino
#F7F5F0
Fondo oscuro
Tinta
#0F1923
Texto principal
Texto base
#0F1923
Texto secundario
Texto suave
#4A5568
Estados
Éxito
Cobrado
#1F8A5B
Aviso
Pendiente
#C97A0A
Error
Vencido
#C0392B
Info
Aviso
#2A6FDB
Composición de marca

Proporciones recomendadas para piezas de marketing: 50% naranja primario · 30% navy · 12% oro · 8% neutros.

03 — Tipografía

Sora & Inter

Sora aporta carácter geométrico y diferenciador en titulares. Inter mantiene la legibilidad en cuerpo, formularios y datos.

Google Fonts
Aa
Marca + Titulares
Sora
400·500·600·700·800
GestiFalla

Geométrica y moderna. Es el wordmark de marca y los titulares de la app.

Aa
Cuerpo / UI
Inter
400·500·600·700
Diseñada para pantalla. Equilibrio perfecto en tablas, formularios e importes.
Aa
Datos / Mono
JetBrains Mono
400 · 500
Importes, códigos, IBAN y eyebrows. Tabular figures por defecto.
Escala
H1 · Display
Sora 700 · 56 / 60 px
Gestiona la comissió.
H2 · Sección
Sora 700 · 40 / 44 px
Cuotas, loterías y actos en un solo sitio
H3 · Subtítulo
Sora 600 · 28 / 34 px
Cobros automatizados por SEPA
H4 · Card
Sora 600 · 20 / 28 px
Junta directiva
Body · 16
Inter 400 · 16 / 25 px
La plataforma para que la presidencia, tesorería y secretaría de tu falla trabajen sin papeleo: socios, recibos, asistencias y actos.
Small · 13
Inter 500 · 13 / 18 px
Última actualización · 12 mar 2026 · 11:42
Eyebrow · Mono
JetBrains Mono 500 · 12 px
SEC. TESORERÍA · 2026
/* Familia tipográfica */
font-family: 'Sora', sans-serif;          /* Wordmark + H1–H4 + eyebrow */
font-family: 'Inter', sans-serif;         /* body, UI, formularios */
font-family: 'JetBrains Mono';            /* importes, IBAN, datos */

--scale-h1: 56px;   --scale-h2: 40px;
--scale-h3: 28px;   --scale-h4: 20px;
--scale-body: 16px; --scale-sm: 13px;
04 — Espacio & forma

Ritmo del 4

Escala basada en múltiplos de 4 px. Esquinas suaves (8 px en componentes interactivos, 12–16 px en superficies grandes) y sombras discretas que sugieren profundidad sin protagonismo.

Espaciado
--s-14 px
--s-28 px
--s-312 px
--s-416 px
--s-624 px
--s-832 px
--s-1248 px
--s-1664 px
Radios
4 px · tag
8 px · botón
12 px · card
16 px · panel
Elevación
shadow-1
Reposo
shadow-2
Hover
shadow-3
Modal
05 — Componentes

Bloques de construcción

Botones, formularios, estados y datos. Cada elemento sigue las mismas reglas de radio, sombra y color.

Botones
Formulario
Formato incorrecto · revisa los 4 últimos dígitos
Badges y estados
Activo Cobrado Pendiente Vencido Info Junta Lotería Baja Borrador
Avatares
VB MS JR PT +12
Toggle & controles
Cobro automático
Avisos por SMS
Modo oscuro
Búsqueda
⌘ K
Banner
23 recibos pendientes de remesar
La remesa SEPA del mes de marzo aún no se ha generado.
Tablas y métricas
Socios activos
412
▲ 18 este ejercicio
Cuotas cobradas
87 %
▲ 6 pts vs. 2025
Caja
28 940 €
▲ 1 240 € · mes
Loterías vendidas
61 %
▼ 4 pts vs. previsión
Socio Categoría Cuota 2026 Loterías Estado
VB
Vicent Bonet Marí
[email protected] · #0142
 Junta 240,00 € 18 / 25 Cobrado
MS
Maria Soler i Coll
[email protected] · #0388
 Fallera 180,00 € 12 / 20 Pendiente
JR
Joan Ramírez Tort
[email protected] · #0211
 Colaborador 60,00 € 3 / 10 Vencido
PT
Pere Tarazona Llopis
[email protected] · #0457
 Fallero 180,00 € 25 / 25 Cobrado
06 — Patrones

Cómo se compone GestiFalla

Secciones alternadas claro/oscuro para marketing, layout con sidebar para la aplicación. El acento naranja siempre marca lo accionable.

gestifalla.app / panel previsualización
EJERCICIO 2025–2026
Bona vesprada, Marta.
Socios activos
412
▲ 18 ejercicio
Cuotas al día
87 %
▲ 6 pts
Próximo acto
Crida · sáb 21:00
Pl. de l'Ajuntament · 248 confirmados
Cobros recientes
Socio Concepto Importe Estado
Vicent BonetCuota 2026 · marzo240,00 €Cobrado
Maria SolerLotería · 3 talonarios60,00 €Pendiente
Joan RamírezCuota 2026 · febrero60,00 €Vencido

Voz y tono

Hablamos a comissions falleres con respeto: tuteamos, evitamos jerga financiera y siempre damos el siguiente paso claro. Bilingüe valencià/castellano según preferencia del usuario.

Cercano Directo Confiable Sin tecnicismos

Lo que evitamos

  • Imágenes folclóricas literales (indumentaria, fuego real, monumentos).
  • Gradientes complejos o efectos cromados.
  • Tipografías decorativas o caligráficas.
  • Más de dos colores compitiendo por atención en una misma vista.