La versión corta
- El diseño suizo, también llamado Estilo Tipográfico Internacional, surgió en Suiza en los años cincuenta y valoraba la claridad, la objetividad y el orden por encima de la decoración.
- Sus herramientas principales son una retícula modular, tipografías sans serif como Akzidenz-Grotesk, Helvetica y Univers, texto alineado a la izquierda en bandera y composiciones asimétricas.
- La jerarquía en el diseño suizo viene del tamaño, el peso y la posición en la retícula, no de ornamentos, cajas ni muchos colores.
- Las composiciones suizas combinan bien con fondos degradados ricos, porque la retícula estricta mantiene tranquilas las palabras mientras el campo de color lleva el ambiente.
- Puedes aplicar los principios suizos a posts y diapositivas eligiendo una retícula de columnas para cada formato y colocando cada elemento sobre ella.
En esta página
Diseño suizo es el nombre que usa casi todo el mundo para el Estilo Tipográfico Internacional, una forma de hacer diseño gráfico que surgió en Suiza en los años cincuenta. Organiza cada página sobre una retícula, compone el texto con sans serif limpias, lo alinea a la izquierda y elimina la decoración para que el contenido hable con claridad. El resultado parece objetivo, ordenado y seguro sin alardes, y por eso tanto branding, señalética y diseño de interfaces actuales siguen sus reglas.
Esta guía cubre de dónde viene el estilo, los principios que puedes copiar, cómo construir una retícula suiza para formatos reales y cómo poner una composición suiza estricta sobre un fondo rico sin perder ninguno de los dos.
De dónde viene el Estilo Tipográfico Internacional
El estilo nació de la tipografía moderna de los años veinte y treinta y tomó forma en las escuelas y los estudios de diseño suizos, sobre todo en Zúrich y Basilea. Sus practicantes querían que el diseño comunicara la información con claridad y neutralidad, para cualquier público, y de ahí viene la palabra internacional.
Merece la pena conocer algunos nombres y tipografías. Josef Müller-Brockmann, que trabajaba en Zúrich, hizo carteles de conciertos y de concienciación pública construidos sobre retículas visibles, y más tarde escribió el libro Grid Systems in Graphic Design (en español, Sistemas de retículas), que sigue siendo una referencia. Emil Ruder, que enseñaba tipografía en Basilea, escribió Typographie, un manual sobre el contraste, el ritmo y el espacio. La tipografía venía de las grotescas: Akzidenz-Grotesk, una sans serif alemana de finales del siglo XIX, y luego Helvetica y Univers, ambas publicadas en 1957.
| Tipografía | Origen | Por qué la usaban los diseñadores suizos |
|---|---|---|
| Akzidenz-Grotesk | Fundición Berthold, Berlín, finales del siglo XIX | Una grotesca sencilla y robusta, sin adornos |
| Helvetica | Fundición Haas, Suiza, 1957 | Neutra, de textura uniforme; se vendió primero como Neue Haas Grotesk |
| Univers | Diseñada por Adrian Frutiger, 1957 | Una familia grande y sistemática de pesos y anchos |
Los principios básicos del diseño suizo
El diseño suizo es menos un aspecto que un conjunto de decisiones. Si tomas estas decisiones, tu trabajo se leerá como suizo incluso con una tipografía moderna y un degradado detrás.
- Una retícula debajo de todo. Las columnas, los márgenes y los medianiles se deciden primero, y cada elemento se apoya en ellos.
- Tipografía sans serif. Grotescas de textura uniforme, normalmente de una sola familia. Mira serif o sans serif.
- Alineado a la izquierda, en bandera. El texto se alinea a un borde; el texto centrado y el justificado son raros.
- Asimetría. Las composiciones se equilibran con el peso y el espacio, no reflejándose alrededor del centro.
- Jerarquía por tamaño, peso y posición. Nada de cajas, ornamentos ni subrayados para señalar la importancia. Mira jerarquía visual.
- Pocos colores. A menudo negro, blanco y un color fuerte, muchas veces rojo.
- Imágenes objetivas. Fotografías y formas geométricas en lugar de ilustración decorativa.
- El espacio como estructura. Las zonas vacías son partes planificadas de la retícula, no sobras.
Cómo construir una retícula suiza para formatos reales
Una retícula son tres números: el margen alrededor del borde, el medianil entre columnas y el número de columnas. Elige un número de columnas que se divida bien: seis columnas se parten en mitades y tercios; doce, en mitades, tercios, cuartos y sextos. Luego comprueba las cuentas para que cada columna mida un número entero de píxeles.
| Formato | Tamaño | Retícula | Ancho de columna |
|---|---|---|---|
| Post de Instagram | 1080×1350 | 6 columnas, margen 72, medianil 24 | 136 px |
| Post de X | 1600×900 | 8 columnas, margen 80, medianil 24 | 159 px |
| Diapositivas 16:9 | 1920×1080 | 12 columnas, margen 96, medianil 24 | 122 px |
| Cartel A3 a 300 ppp | 3508×4961 | 6 columnas, margen 238, medianil 64 | 452 px |
Añade también una línea base. Elige una unidad pequeña, como 8 px en un post de 1080 px, y haz que los interlineados y los espacios verticales sean múltiplos de ella. Así el texto de distintas columnas queda alineado, y eso explica buena parte de por qué las páginas suizas transmiten tanta calma. Interlineado y longitud de línea explica cómo elegir la unidad.
.poster {
box-sizing: border-box;
width: 1080px;
height: 1350px;
padding: 72px;
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: auto 1fr auto;
column-gap: 24px;
font-family: "Helvetica Neue", Arial, sans-serif;
}
.poster .kicker { grid-column: 1 / 3; font-size: 24px; line-height: 32px; }
.poster h1 { grid-column: 1 / 6; grid-row: 2; align-self: center; font-size: 112px; line-height: 104px; letter-spacing: -0.02em; font-weight: 700; margin: 0; }
.poster .detail { grid-column: 4 / 7; grid-row: 3; font-size: 36px; line-height: 48px; }El código usa el diseño de cuadrícula de CSS. El titular ocupa cinco columnas y deja vacía la sexta a propósito; el detalle va en la mitad derecha, abajo, así que la página se equilibra con asimetría y no centrando.
Reglas de tipografía suiza que puedes copiar
Evita
- Centrar todas las líneas
- Tres o cuatro tipografías en un mismo diseño
- Cajas y contornos para separar el contenido
- Espaciar más las letras de los titulares grandes
- Muchos tamaños casi iguales
Haz
- Alinea el texto a la izquierda con el borde de una columna
- Una sola familia grotesca en dos o tres pesos
- El espacio y la alineación para separar el contenido
- Ajusta un poco el espaciado de los titulares grandes
- Pocos tamaños con saltos claros entre ellos
El detalle más suizo es la escala de tamaños. Usa tres o cuatro tamaños con saltos evidentes, como 24, 36 y 112 px en un post de 1080 px, en lugar de una rampa suave. Los titulares grandes suelen verse mejor con un espaciado ligeramente negativo; espaciado entre letras muestra las cantidades.
Cómo combina el diseño suizo con los fondos ricos
Los carteles suizos clásicos solían ser de color plano, pero la retícula no lo exige. Una composición estricta es justo lo que permite que un fondo rico funcione: el texto está tranquilo, alineado y limitado, así que un degradado profundo puede llevar el ambiente sin que la página se convierta en ruido. Es la misma composición tranquila sobre un material rico que se describe en minimalismo o maximalismo.
Tres reglas mantienen limpia la combinación. Pon el bloque de texto sobre la parte más tranquila del degradado. Usa un solo color de texto para todo, normalmente blanco o negro. Y deja que la fuente de luz del fondo quede en una zona vacía de la retícula, para que se lea como parte de la composición. Para mucho texto sobre color, mira texto sobre fondos recargados.
Un cartel A3 sobre una retícula de seis columnas: las palabras ocupan la izquierda, el color la derecha.
El mismo sistema en un post de Instagram: una familia, tres tamaños, un color de texto.
En Gradiently, un Mark renderiza el fondo en vivo detrás de la composición y desplaza su zona más tranquila detrás de las palabras, así que un bloque de texto suizo mantiene su contraste cuando lo mueves entre columnas o copias el diseño a otros tamaños.
Preguntas frecuentes
¿Qué es el diseño suizo?
El diseño suizo, o Estilo Tipográfico Internacional, es un enfoque del diseño gráfico que surgió en Suiza en los años cincuenta. Usa retículas, tipografía sans serif, texto alineado a la izquierda y composiciones asimétricas para comunicar con claridad sin decoración.
¿Qué tipografía se usa en el diseño suizo?
Los diseñadores suizos usaban sobre todo sans serif grotescas: Akzidenz-Grotesk, y después Helvetica y Univers, ambas publicadas en 1957. Hoy cualquier grotesca neutra de textura uniforme da un resultado parecido.
¿Cuántas columnas debe tener una retícula suiza?
Seis columnas van bien para la mayoría de los posts y carteles porque se dividen en mitades y tercios. Doce columnas van bien para formatos anchos como diapositivas y webs. Comprueba que márgenes, medianiles y columnas suman el ancho exacto.
¿El diseño suizo puede usar degradados?
Sí. La retícula, la tipografía y la contención son lo que hace suiza una composición. Un degradado rico detrás de un bloque de texto estricto funciona bien, siempre que el texto vaya sobre una zona tranquila y en un solo color.
¿Quiénes fueron los diseñadores suizos más importantes?
Josef Müller-Brockmann, conocido por sus carteles basados en retículas y por su libro Grid Systems in Graphic Design, y Emil Ruder, que enseñó tipografía en Basilea y escribió Typographie, son dos de los más conocidos.
Escrito por Gradiently
El equipo detrás de Gradiently, una herramienta de diseño creada en torno a los Marks: degradados vivos que hacen que todo lo que diseñas parezca tuyo.
Ver nuestro perfil
