Sistema de marca TCF · v2026

La guía de estilo de TCF.

Colores, tipografía y patrones de componentes que conforman el lenguaje visual de la Fundación contra el Cáncer de Testículo. Haz clic en cualquier valor hexadecimal o RGB para copiarlo.

Sistema de colores

01 · Fundamentos

Tres funciones: «primary» para la identidad de marca, «ink» para tipografías y superficies, y «signals» para tintes y bordes. Haz clic en cualquier código hexadecimal o RGB para copiarlo.

Primario y de marca

Primaria

TCF Cian

HEX#00B4DB
RGBrgb(0, 180, 219)

La marca. Llamadas a la acción, detalles decorativos, enlaces, texto en negrita y elementos visuales destacados.

Acentuado · Profundo

Cian intenso

HEX#0091B0
RGBrgb(0, 145, 176)

Etiqueta las pastillas y los estados al pasar el cursor con el cian principal. Mayor contraste sobre fondos tintados.

Toque · Matiz

Tinte cian

HEX#E6F8FD
RGBrgb(230, 248, 253)

Fondos para etiquetas y llamadas de atención. Una presencia sutil de la marca que no resta protagonismo al contenido.

Tinta y tipografía

Tinta · Primaria

Azul marino intenso

HEX#0F172A
RGBrgb(15, 23, 42)

Encabezados, tarjetas destacadas, bloques de llamada a la acción, pie de página. Sustituye el negro puro en todas partes.

Tinta · Cuerpo

Slate 700

HEX#334155
RGBrgb(51, 65, 85)

Texto predeterminado para superficies claras. Ofrece un contraste menor que el azul marino, lo que resulta más agradable para la lectura de textos largos.

Tinta · Secundaria

Slate 600

HEX#475569
RGBrgb(71, 85, 105)

Párrafos secundarios, descripciones de listas, texto complementario debajo de un título.

Tinta · Apagados

Slate 500

HEX#64748B
RGBrgb(100, 116, 139)

Leyendas, etiquetas de especificaciones, notas al pie, líneas EIN. Discretas pero legibles.

Tinta · Sobre fondo oscuro

Slate 400

HEX#94A3B8
RGBrgb(148, 163, 184)

Texto principal sobre fondo azul marino oscuro: tarjetas destacadas, llamadas a la acción y pie de página.

Superficie · Página

Blanco

HEX#FFFFFF
RGBrgb(255, 255, 255)

Fondo predeterminado de la página. Tarjetas y áreas de contenido.

Señales y superficies

Superficial · Sutil

Slate 100

HEX#F1F5F9
RGBrgb(241, 245, 249)

Fondos de sección alternativos, estados de conmutación inactivos, separadores suaves.

Borde · Predeterminado

Slate 200

HEX#E2E8F0
RGBrgb(226, 232, 240)

Separadores de fichas, líneas finas debajo de los encabezados, bordes en las filas de las listas.

Reservado

Negro puro

HEX#000000
RGBrgb(0, 0, 0)

Reservado para los medios de comunicación (logotipos, máscaras fotográficas). No lo utilices para el texto; utiliza el color «Deep Navy».

Tipografía

02 · Fundamentos

Una tipografía con serifas para los títulos y una sans-serif para todo lo demás. DM Serif Display aporta calidez y solidez editorial; Inter se adapta a la lectura de textos largos y a la interfaz de usuario sin distraer la atención.

DM Serif Pantalla

Serif · 400 · Títulos y citas

Aa Bb Cc
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789

Inter

Sans · 400 / 600 / 700 · Texto, interfaz de usuario, botones

Aa Bb Cc
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
0123456789

Escala de tipos

03 · Fundamentos

Dos estilos tipográficos. El estilo «Article» está pensado para contenidos extensos, entradas de blog y páginas de programas. El estilo «Display» es ideal para secciones destacadas, páginas de destino y situaciones de marketing en las que la tipografía debe destacar más.

Cejas
FuenteInter
Tamaño12 px
Peso600
Seguimiento.12em
MayúsculasMayúscula
Noticias y novedades
H1 · Artículo
FuenteDM Serif Display
Tamaño44 px
Peso400
Principales1.12

Evaluada de forma independiente. Sujeta a control público.

H2 · Artículo
FuenteDM Serif Display
Tamaño30 px
Peso400
Principales1,18

Por qué son importantes las valoraciones de terceros

H3 · Artículo
FuenteDM Serif Display
Tamaño22 px
Peso400

La excelencia operativa respalda el cumplimiento de la misión

Introducción
FuenteInter
Tamaño19 px
Peso400
Principales1,6

La confianza se forja a través de una rendición de cuentas cuantificable y una transparencia constante, y nuestras calificaciones de terceros reflejan precisamente eso.

Cuerpo
FuenteInter
Tamaño17 px
Peso400
Principales1,7

Fundada en 2009, la Fundación de Cáncer Testicular es una organización sin fines de lucro 501(c)(3) y el único grupo de cáncer testicular con personal a tiempo completo en el país. Somos un equipo de sobrevivientes, cuidadores y defensores apasionados por aumentar la educación y la concienciación.

Botón
FuenteInter
Tamaño16 px
Peso600
Radio8 píxeles

Patrones de componentes

04 · Patrones

Elementos de diseño reutilizables. Estos aparecen en entradas de blog, páginas de programas y contenidos dirigidos a los donantes. Utiliza los mismos cinco patrones en todas partes para que la marca mantenga su coherencia sin resultar rígida.

Pastilla de etiqueta

Etiqueta de categoría situada encima de un H1. Fondo con un ligero matiz, texto en cian oscuro.

Transparencia

Nota al margen

Breve resumen o idea principal. Tono cian con un borde principal de 3 píxeles.

En resumen: Candid Platinum, 4 estrellas en Charity Navigator con una puntuación del 93 %, mejor valorada en GreatNonprofits, 4,2/5 en Trustpilot.

Carta de héroe

Área oscura con título, titular, párrafo de desarrollo y cita destacada opcional.

Para donantes y colaboradores

Cuatro evaluadores independientes. Una respuesta unánime.

La mayoría de las organizaciones sin ánimo de lucro de nuestro sector están presentes en una o dos de estas plataformas. TCF está presente en las cuatro.

«La verificación independiente es el mínimo, no el máximo».

Lista numerada

Se utiliza para listas escalonadas, valoraciones y compases. Números con serifas en cian primario y separadores de línea fina.

  • 01
    Concienciación

    Llegar a los jóvenes allí donde se encuentran mediante una educación libre de estigmas.

  • 02
    Apoyo

    Pon en contacto a los pacientes recién diagnosticados con supervivientes que han pasado por lo mismo.

  • 03
    Supervivencia

    Cuidados a largo plazo, apoyo comunitario y recursos tras finalizar el tratamiento.

Bloque de llamada a la acción

Bloque de donaciones o registro al final del artículo. Azul marino oscuro con detalles en cian.

Apoya a TCF con una donación deducible de impuestos.

Cada dólar se gestiona siguiendo los mismos criterios que se reflejan en nuestras calificaciones independientes.

Haz una donación a TCF