Swiss International Style Color Psychology & Meaning
Swiss style is rationalism in three colors — white space, black type, and one strong red. This system influenced every corporate identity program from 1950 to today.
#FFFFFF
#CC0000
#000000
#BBBBBB
Background
Primary Accent
Secondary
Body Text
Swiss International Style
minimalboldtypographic all brandingdesigncorporate
Fail
WCAG Grade
1.9:1
Contrast Ratio
2,400
Saves
6,400
AI Copies
Use #FFFFFF as the background. Use #CC0000 as the primary accent. Use #000000 as secondary. Use #BBBBBB as body text/supporting color. Palette mood: Swiss International Style — minimal, bold, typographic.
Hex Codes, RGB & CMYK Color Values
Technical breakdown for the Swiss International Style color scheme. Use these values for web design (HEX/RGB), print projects (CMYK), or specialized design software (HSL).
| Swatch | Design Role | HEX | RGB | CMYK | HSL |
|---|---|---|---|---|---|
| Background Luminance: 100.0% | 255, 255, 255 | 0%, 0%, 0%, 0% | 0°, 0%, 100% | ||
| Primary Accent Luminance: 12.8% | 204, 0, 0 | 0%, 100%, 100%, 20% | 0°, 100%, 40% | ||
| Secondary Luminance: 0.0% | 0, 0, 0 | 0%, 0%, 0%, 100% | 0°, 0%, 0% | ||
| Body Text Luminance: 49.7% | 187, 187, 187 | 0%, 0%, 0%, 27% | 0°, 0%, 73% |
Color Harmony: Analogous Scheme
The Swiss International Style palette is built using a analogous relationship between its hues. This ensures that even with high-contrast accents, the overall scheme feels balanced and intentional.
Hue Wheel
A analogous palette is often preferred by professional designers because it creates a calm, serene atmosphere by using neighboring colors.
History & Design Context
Swiss International Typographic Style emerged from Basel and Zurich in the 1950s. Josef Müller-Brockmann and Armin Hofmann developed the grid-based, typography-first approach that defined corporate design.
Best Design Use Cases
White for all backgrounds. Black for all typography and structural elements. Red for singular emphasis moments only — headlines, logos, one CTA per page. Never more.
Industries This Palette Suits
Design institutions, corporate brands, Swiss brands, design education, branding agencies.
How to Implement the Swiss International Style Color Scheme
To use this Swiss International Style color palette in your web project, you can copy the following CSS variables or Tailwind CSS configuration. These roles ensure your UI maintains accessibility and visual hierarchy.
Option 1: CSS Variables
:root {
/* {name} Palette - ihatecolors.com */{'
'} --color-bg: {colors[0]};{'
'} --color-primary: {colors[1]};{'
'} --color-secondary: {colors[2]};{'
'} --color-text: {colors[3]};{'
'} {'}'}Web Design Tip
Use #FFFFFF for the main background and #CC0000 for primary buttons. This creates a high-contrast focal point.
Accessibility Note
The contrast ratio between #BBBBBB and #FFFFFF is 1.92:1 (Fail). Ensure your body text remains legible.