Sistema visual · cancionero

Cómo se ve el cancionero

Gráfica popular para la calle: color plano, contorno grueso y tipografía de cartel. Esta página muestra la paleta, los estilos, las tipografías y los patrones con los mismos tokens que usa el sitio.

Qué tomamos

El cancionero se usa en la calle: se lee de lejos, en movimiento, a veces sobre un muro o una pancarta. Por eso la estética sale de dos tradiciones populares que conocemos en general:

  • El afiche político de impresión simple, con pocas tintas y mucho contraste.
  • El muralismo de brigadas: pintura colectiva en muros, a gran escala, con figuras simplificadas y consignas cortas.

Lo que sigue es una lectura de rasgos formales. No atribuimos ninguno de ellos a una obra ni a una persona concreta.

Paleta

Siete colores, cada uno con una función. El rojo y el negro son el puente con el sitio; los demás son propios del cancionero.

  • --c-papel

    #F1E8D4

    Fondo de página. Papel de afiche, no blanco puro.

  • --c-papel-carton

    #E2D3B0

    Fondo de bloque o tarjeta.

  • --c-crema

    #FBF7EE

    Fondo de cartel recién impreso y de la puerta de la portada.

  • --c-tinta

    #0A0A0A

    Texto y contorno. Es el negro del sitio.

  • --c-rojo

    #CE1126

    Acento y acción. Es el rojo del sitio. Como texto, sólo sobre papel o crema.

  • --c-ocre

    #E3A72F

    Acento secundario: sellos y bandas. Va con tinta encima, nunca como texto sobre papel.

  • --c-oxido

    #6E2C17

    Tercer color del muro. Texto secundario sobre papel.

Contraste

Cada par de texto y fondo se calcula con la fórmula WCAG 2.x al construir la página. El umbral AA es 4.5 para texto normal y 3 para texto grande. Los pares marcados «no se usa» se muestran a propósito: fallan, y por eso no van como texto.

Muestra Texto / fondo Uso Ratio AA normal AA grande
Aa tinta / papel Texto de página 16.25 pasa pasa
Aa tinta / crema Texto de cartel 18.52 pasa pasa
Aa tinta / papel-carton Texto de bloque 13.37 pasa pasa
Aa oxido / papel Texto secundario 8.47 pasa pasa
Aa oxido / papel-carton Texto secundario en bloque 6.97 pasa pasa
Aa rojo / papel Enlace y titular rojo 4.62 pasa pasa
Aa rojo / crema Titular rojo de cartel 5.26 pasa pasa
Aa papel / rojo Botón de acción 4.62 pasa pasa
Aa papel / tinta Texto invertido 16.25 pasa pasa
Aa tinta / ocre Sello 9.27 pasa pasa
Aa rojo / tinta Rojo como texto sobre negro (no se usa como texto) 3.52 falla pasa
Aa ocre / papel Ocre como texto sobre papel (no se usa como texto) 1.75 falla falla

Los ratios se miden sobre el color sólido. El grano y la trama son capas decorativas y no van bajo texto corrido.

Tipografía

Sólo fuentes que el sitio ya carga, o del sistema. No hay ninguna dependencia nueva.

--c-fuente-cartel
Cancionero de la calle
"Cairo", "Arial Black", sans-serif
Titulares. Mayúsculas y peso 900. Cairo, que el sitio ya carga.
--c-fuente-texto
Texto de lectura, navegación y formularios. Inter, que el sitio ya carga.
"Inter", system-ui, sans-serif
Cuerpo de texto.
--c-fuente-canto
Para cantar en la marcha: el verso se lee de un vistazo.
"Inter", system-ui, sans-serif
Letra de los cánticos. Inter en peso 600, interlineado 1.6, pensada para leerse de pie.
--c-fuente-registro
SERIGRAFÍA DE MUESTRA · 1 DE 1
ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace
Sellos y numeración de catálogo. Monoespaciada del sistema, sin descarga.

Escala de espaciado: s1 0.25rems2 0.5rems3 0.75rems4 1rems5 1.5rems6 2.25rems7 3rem

Estilos artísticos

Seis rasgos del sistema. Son nombres de trabajo nuestros: no designan escuelas, autores ni obras. Cada uno tiene su muestra.

Color plano de serigrafía

Un color, una tinta. Ningún degradado ni sombra suave. Donde se superponen dos tintas, el color se oscurece.

Contorno grueso

Lo importante lleva borde negro de 4 px y una sombra dura, sin difuminar.

Contorno y sombra

Registro desalineado

Capas que no coinciden del todo, como una serigrafía hecha a mano. La superposición usa multiply, que simula dos tintas.

Figura esquemática

Figuras reducidas a un círculo y trazos gruesos. Dibujada para esta página; no reproduce ninguna obra.

Bloque de muro

Formas grandes y planas, legibles a distancia, con una banda geométrica como remate.

Medio tono

Una trama de puntos que sugiere tono sin degradado. Sólo en áreas sin texto.

Ejemplos vivos

Armados con los mismos tokens que el resto del cancionero. El texto es de prueba, no es una consigna ni un cántico real.

Cartel de muestra

Titular de muestra

Texto de prueba para ver la composición.

Serigrafía de muestra · 1 de 1

Cántico de muestra · texto de prueba

Título de muestra

Verso de muestra, primera línea

Verso de muestra, segunda línea

Estribillo de muestra, en negrita

Verso de muestra, cierre

Patrones y texturas

Hechos con CSS. No hay imágenes de archivo. Ninguno va bajo texto corrido.

  • .cc-trama: trama de medio tono. Usa --c-trama-paso y --c-trama-alfa.

  • .cc-banda-muro: banda rojo, negro y ocre. Usa --c-banda-alto.

  • .cc-banda-rayada: rayado diagonal de cartel.

  • .cc-grano: grano de impresión, capa de ruido bajo el contenido. Usa --c-grano-opacidad.

Sombra dura de serigrafía: --c-sombra = 4px 4px 0 var(--c-tinta).

Referencias: gráfica popular chilena

Conocimiento general, sin nombres ni fechas. Es un punto de partida para investigar, no una bibliografía.

  • Hay en Chile una tradición de muralismo de brigadas: pintura colectiva en muros de barrios y espacios públicos, con figuras simplificadas y consignas cortas. por verificar: casos, lugares y periodos concretos.
  • Hay en Chile una tradición de afiche político de impresión simple, serigráfico o de reproducción de bajo costo, usado en marchas, campañas y muros. por verificar: colecciones, archivos y autorías.
  • Ambas tradiciones comparten rasgos formales frecuentes: color plano, pocas tintas, contorno grueso, figuras simplificadas y tipografía de cartel con contraste fuerte entre negro, rojo y papel. Es una lectura formal nuestra, no una cita. por verificar: si esos rasgos están documentados.
  • Lo que el cancionero toma de esa tradición es la economía de medios: poco color, mucho contraste y lectura a distancia, para que se entienda en la marcha.

Por verificar con fuentes

  1. Qué brigadas muralistas chilenas son relevantes, en qué periodos trabajaron y qué obras están documentadas. Ninguna se cita aquí.
  2. Qué colecciones de afiches políticos chilenos existen en archivos o museos, y si su uso está permitido.
  3. Si el rojo, el negro, el ocre y el óxido aparecen en esos registros, o si la paleta es una elección nuestra inspirada en ellos.
  4. Si la tipografía de cartel y la figura esquemática tienen antecedentes concretos que convenga citar.
  5. Permisos: hoy no se usa ninguna imagen de archivo. Si alguna vez se usa una, su licencia se revisa antes.

Revisión pendiente: esta página no la ha revisado nadie con conocimiento de la tradición. Hasta entonces, no se publica ninguna atribución.

← Volver al cancionero · Inicio