02 · PALETA

Colores.

Oscuro por defecto. Azul como firma. Sin degradados agresivos. Cero rojos, cero verdes, cero "gym-bro".

Base

Obsidian
Obsidian
#09090B
Surface 1
Surface 1
#0F0F12
Surface 2
Surface 2
#141418
Surface 3
Surface 3
#1A1A1F

Acento

Signal Blue
Signal Blue
#3B82F6
Blue Light
Blue Light
#60A5FA
Blue Dark
Blue Dark
#2563EB

Texto

Ivory
Ivory
#FAFAFA
Smoke
Smoke
#A1A1AA
Smoke 2
Smoke 2
#71717A
Smoke 3
Smoke 3
#52525B

Uso

Obsidian = fondo principal · Surface 1-3 = cards, secciones alternas, avatares · Signal Blue = acento de autoridad, CTAs, itálicas · Ivory = texto principal · Smoke 1-3 = texto secundario, meta, placeholders

03 · SISTEMA TIPOGRÁFICO

Tipografía.

Dos familias. Poppins para todo lo que se lee. JetBrains Mono para lo que se registra. Itálicas azules como firma.

Aa Aa Aa Aa
Poppins ExtraLight · 72 · -3px LS
De inseguro a fuerte.
Poppins Light · 40 · -1.5px LS
No empecé fuerte. Me hice fuerte.
Poppins Medium · 20 · -0.3px LS
Tu coach en el bolsillo.
Poppins Light 300 · 16 · body
Vengo de estar flaco. No siempre estuve fuerte. Hoy ayudo a hombres que quieren más de sí mismos a construir el físico y la confianza que merecen — con acompañamiento real, sin excusas.
JetBrains Mono Medium · 11 · 3.5px LS
TRANSFORMACIÓN FÍSICA 1:1
JetBrains Mono Regular · 10 · 2px LS
RESPONDO EN < 15 MIN · SIN COMPROMISO

Firma visual

Itálicas Poppins 300 en azul sobre cualquier texto — palabra clave del mensaje. No abusar: 1-2 itálicas por párrafo máximo.

em { font-style: italic; color: #3B82F6; font-weight: 300; }

Pesos disponibles

  • Poppins: 200, 300, 400, 500, 600, 700
  • Poppins italic: 200, 300, 400, 500, 600
  • JetBrains Mono: 400, 500
04 · GRID & SPACING

Espaciado.

Escala basada en 4 y 8. Secciones respiran. Cards tienen aire. El vacío también diseña.

8
16
24
32
48
64
96
140
Sección

Padding vertical: 140px desktop · 84px móvil

Container

max-width: 1240px · padding horizontal: 24px

Cards

Padding interno: 32-40px · Gap entre cards: 20-24px

Grid two-col

Gap: 72-80px · Proporción hero: 1.15fr / 0.85fr

05 · DEPTH

Sombras & Radios.

La sombra azul es la firma. Aparece solo en elementos con autoridad: CTA, hero, pricing featured.

SHADOW-HERO
.

Hero · App mockup

SHADOW-CTA
.

Botones primary

SHADOW-FEATURED
.

Pricing destacado

Radios

8px · small

14px · cards

24px · hero

pill · CTAs

06 · COMPONENTES

Componentes.

Botones, badges, cards. Lo mínimo necesario para construir cualquier superficie sin desordenar el sistema.

Botones

Badges

PLAZAS LIMITADAS · 1:1 REAL MÁS POPULAR 6 MESES

Progress bar

Progreso · Mes 2 62%
07 · APLICACIÓN

Mockups.

Cómo se ve la marca en una landing, una story y un post.

LANDING
PLAZAS LIMITADAS
De inseguro a
fuerte y confiado.

Coach de transformación física 1:1. Plan hecho para tu vida real — sin excusas.

STORY IG
DÍA 14 · FASE DE HIPERTROFIA
Esto no va
de motivación.
Va de decidir.
08 · ASSETS

Iconos & Favicon.

Isotipo "FF" para pestañas, perfiles y avatares. Exportar como PNG + SVG.

FF

Favicon · 64×64

FF

App icon · 512×512

FF

Avatar IG

1

Monogram · variante

Reglas

  • • Fondo oscuro por defecto · nunca blanco salvo en print
  • • Línea azul siempre visible (mínimo 1px)
  • • No sombras, no bordes decorativos, no degradados en el isotipo
  • • Radius mínimo 14px en iconos de app
09 · EL MÉTODO

Método.

Cuatro etapas — el acompañamiento real es el diferencial. No vendo un plan: vendo estar ahí mientras lo haces.

01

Análisis inicial

Formulario + fotos + llamada. Entiendo tu punto de partida, tus dolores reales, tu ritmo de vida. Sin plan genérico.

02

Plan personalizado

Entreno + alimentación + hábitos diseñados para tu vida real. Adaptado a tu disponibilidad, no al revés.

03

Acompañamiento real

WhatsApp todos los días. Audios, vídeos, respuestas. No estás solo. Cuando hay bajón, estoy ahí.

04

Mentalidad & constancia

El físico es consecuencia. El cambio empieza en cómo piensas. Trabajo los dos frentes.

10 · TONO

Voz & Valores.

Directos. Estoicos. Sin postureo. Así hablamos. Así no.

ASÍ HABLAMOS

  • Directos. Sin relleno.
  • Energía estoica — no hype, no motivación vacía.
  • "Te enseño el proceso" — no "prometo resultados".
  • Masculino sin machismo. Exigente sin humillar.
  • Hablamos de transformación, no de "fitness".
  • Itálicas azules para la palabra que importa.

ASÍ NO

  • Consejos genéricos de gym bro.
  • Postureo de lifestyle (Lamborghinis, relojes).
  • Consumo de sustancias — ni en broma.
  • Hype hueco ("transformación brutal", "locura").
  • Prometer resultados en X semanas.
  • Emojis decorativos en copy serio.

Palabras clave de marca

Trabajador · Real · Honesto · Resiliente · Extremo · Estoico · Directo · Masculino · Cercano

Frases firma

  • "Vengo de estar flaco."
  • "No empecé fuerte. Me hice fuerte."
  • "Comenta FUERTE."
FF COACHING · BRAND KIT · V1.0 · ABRIL 2026 · DELIVERED BY ONLY1 ECOSYSTEM