Stylogeny combining Arts × Techno-Futurist Graphics

Try

Style combination · Contrasts

Arts × Techno-Futurist Graphics

Handmade, nature-derived craft is its anti-matter; a single hand-drawn element in a techno layout reads as a glitch of humanity.

From the research on Techno-Futurist Graphics

Mix them and make something Arts Techno-Futurist Graphics

OrbitArts × Techno-Futurist Graphics1860 · 1986
A sample layout drawn from the recipe: shapes from Techno-Futurist Graphics, their arrangement from Arts, the finish from Arts. 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.

Arts & Crafts Movement Techno-Futurist Graphics

Type from Arts
Colour from Techno-Futurist Graphics
Form from Techno-Futurist Graphics
Composition from Arts
Surface from Arts

Techno-Futurist Graphics avoids carved line: this is where the two pull against each other, which is the point of the contrast.

02

The type

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

Display · Arts

Orbit

EB Garamond; Arts used Golden Type and Troy and Chaucer

Text · Techno-Futurist Graphics

Electronic-music and video-game graphics of the late 1980s and 1990s that turned corporate modernism into a sci-fi consumer fantasy. Grids, Helvetica, pictograms, barcodes, warning labels and invented corporate logos were recombined with katakana, manga cuteness and early 3D, producing slick, flat, information-saturated surfaces that both celebrated and satirised technology and branding.

Inter; Techno-Futurist Graphics used Helvetica and Eurostile / Microgramma

03

The colours

The ground and leading colours come from Techno-Futurist Graphics, with a counter-accent from Arts. The ink reads on the ground at 4.5:1 or more.

Arts & Crafts Movement Techno-Futurist Graphics

  • #f5f5f5 ground · 36%
  • #111111 ink · 14%
  • #00aeef accent · 18%
  • #a33224 accent · 14%
  • #ec008c accent · 10%
  • #c39a4a accent · 8%

As CSS

:root {
  --ground: #f5f5f5;
  --ink: #111111;
  --accent-1: #00aeef;
  --accent-2: #a33224;
  --accent-3: #ec008c;
  --accent-4: #c39a4a;
  --font-display: "EB Garamond", serif;
  --font-text: "Inter", sans-serif;
}

04

The two styles

An ornate botanical design surrounds a large blank cream oval, with curling green leaves and red, blue, and ochre flowers. Two blue-and-yellow birds face inward near the top, and a narrow leafy border has square floral decorations at all four corners. 1860–1920 · Western Europe, North America Arts & Crafts Movement A British-led reform movement that answered industrial shoddiness with honest handcraft, medieval models and the ideal of joy in labour. In graphic design it is embodied by William Morris's Kelmscott Press: dark Jenson-derived and gothic types, handmade paper, and wood-engraved borders and initials dense with stylised foliage, treating the book as one integrated, hand-made object. A dense futuristic transport poster headed “ORBIT LINK” features a large cyan planet with pink and white orbital rings on a black circular field. Bright geometric icons, a spacecraft silhouette, a world map with routes, technical labels and barcodes fill the surrounding white layout. 1986–2002 · Western Europe, East Asia Techno-Futurist Graphics Electronic-music and video-game graphics of the late 1980s and 1990s that turned corporate modernism into a sci-fi consumer fantasy. Grids, Helvetica, pictograms, barcodes, warning labels and invented corporate logos were recombined with katakana, manga cuteness and early 3D, producing slick, flat, information-saturated surfaces that both celebrated and satirised technology and branding.

05

More combinations

With Arts

All 16 combinations with Arts

With Techno-Futurist Graphics

Every style combination