Stylogeny combining Op Art Graphics × Psychedelic Poster

Try

Style combination · Pairs well

Op Art Graphics × Psychedelic Poster

Psychedelic posters borrowed op's vibrating colour edges; combine precise line fields with melting lettering for kinetic music graphics.

From the research on Op Art Graphics

Mix them and make something Op Art Graphics Psychedelic Poster

CircuitOp Art Graphics × Psychedelic Poster
A sample layout drawn from the recipe: shapes from Psychedelic Poster, their arrangement from Op Art Graphics, the finish from Op Art Graphics. Not a real work, and not an image of either style.

01

What each style brings

Each part of the design comes from the style with the stronger say in it, and each style gives at least two.

Op Art Graphics Psychedelic Poster

Type from Psychedelic Poster
Colour from Op Art Graphics
Form from Psychedelic Poster
Composition from Op Art Graphics
Surface from Op Art Graphics

02

The type

Open fonts standing in for each style’s own type, which is often hand-drawn or commercial.

Display · Psychedelic Poster

Circuit

Federant, standing in for Arnold Böcklin

Text · Op Art Graphics

A 1960s style that turned perceptual research into graphic effect: precisely drawn lines, checks, concentric rings and modular grids, usually black and white or complementaries of equal value, that seem to vibrate, swell or move. Rooted in Bauhaus form teaching through Vasarely and Albers and popularised by MoMA's 1965 'The Responsive Eye', it spread quickly into posters, record sleeves, fashion textiles and identities such as Mexico 68.

Jost; Op Art Graphics used Mexico 68 multiline lettering and Futura

03

The colours

The ground and leading colours come from Op Art Graphics, with a counter-accent from Psychedelic Poster. The ink reads on the ground at 4.5:1 or more.

Op Art Graphics Psychedelic Poster

  • #ffffff ground · 36%
  • #0a0a0a ink · 14%
  • #e3001b accent · 18%
  • #ff6a13 accent · 14%
  • #0050b5 accent · 10%
  • #e4007c accent · 8%

As CSS

:root {
  --ground: #ffffff;
  --ink: #0a0a0a;
  --accent-1: #e3001b;
  --accent-2: #ff6a13;
  --accent-3: #0050b5;
  --accent-4: #e4007c;
  --font-display: "Federant", sans-serif;
  --font-text: "Jost", sans-serif;
}

05

More combinations

With Op Art Graphics

All 16 combinations with Op Art Graphics

With Psychedelic Poster

All 19 combinations with Psychedelic Poster

Every style combination