Stylogeny combining Early Web Vernacular × Media-Player

Try

Style combination · Pairs well

Early Web Vernacular × Media-Player

The same amateur, communal web of the late 1990s; pair a skin with a fan homepage for a full period set.

From the research on Media-Player & Desktop Skins (Winamp-Era Skinning)

Mix them and make something Early Web Vernacular Media-Player

TogetherEarly Web Vernacular × Media-Player
A sample layout drawn from the recipe: shapes from Early Web Vernacular, their arrangement from Media-Player, the finish from Media-Player. 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.

Early Web Vernacular Media-Player & Desktop Skins (Winamp-Era Skinning)

Type from Early Web Vernacular
Colour from Early Web Vernacular
Form from Early Web Vernacular
Composition from Media-Player
Surface from Media-Player

02

The type

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

Display · Early Web Vernacular

Together

Newsreader, standing in for Times New Roman (browser default)

Text · Media-Player

An amateur interface craft of the dial-up years in which fans repainted small software windows, above all the Winamp media player, as imaginary hardware: hi-fi faceplates, sci-fi consoles and game props in pixel-painted chrome and brushed metal, with glowing LCD readouts on dark wells, packed transport buttons and spectrum analysers. Freeform formats cut the window into blobs and pods; a large fan strand ranged from simple recolours to anime, game and band art, often in glaring colours and at the cost of legibility.

VT323; Media-Player used Seven-segment LCD and LED digit sets for time readouts and Hand-pixelled bitmap character sheets drawn per skin for scrolling titles

03

The colours

The ground and leading colours come from Early Web Vernacular, with a counter-accent from Media-Player. The ink reads on the ground at 4.5:1 or more.

Early Web Vernacular Media-Player & Desktop Skins (Winamp-Era Skinning)

  • #000080 ground · 36%
  • #00ff00 ink · 14%
  • #0000ff accent · 18%
  • #ffae00 accent · 14%
  • #ff00ff accent · 10%
  • #2f6fd6 accent · 8%

As CSS

:root {
  --ground: #000080;
  --ink: #00ff00;
  --accent-1: #0000ff;
  --accent-2: #ffae00;
  --accent-3: #ff00ff;
  --accent-4: #2f6fd6;
  --font-display: "Newsreader", serif;
  --font-text: "VT323", monospace;
}

04

The two styles

A densely decorated blue ocean-themed webpage features the title “OCEAN DREAMS” above a pearl-and-shell-framed picture of dolphins. Repeated dolphins, glittering stars, hearts, planets, kittens, fairies, fish and small novelty icons fill the surrounding space. 1994–2004 · Global / networked Early Web Vernacular The amateur web of the mid-1990s to early 2000s, when millions of people hand-coded personal homepages on free hosts such as GeoCities with table layouts, browser-default fonts, tiled backgrounds, animated GIFs, MIDI soundtracks, hit counters and ‘under construction’ signs. Its look came from HTML's limits, slow modems and enthusiastic bricolage rather than professional design; Olia Lialina later named it ‘a vernacular web’. An elaborate chrome science-fiction control panel surrounds a blue underwater scene with glowing jellyfish, fish, and an illuminated submerged city. Green displays read “NIGHT DIVE” and “03:27,” alongside playback buttons, equalizer bars, planetary graphics, and orange-lit tubes. 1997–2008 · Global / networked, North America, Western Europe Media-Player & Desktop Skins (Winamp-Era Skinning) An amateur interface craft of the dial-up years in which fans repainted small software windows, above all the Winamp media player, as imaginary hardware: hi-fi faceplates, sci-fi consoles and game props in pixel-painted chrome and brushed metal, with glowing LCD readouts on dark wells, packed transport buttons and spectrum analysers. Freeform formats cut the window into blobs and pods; a large fan strand ranged from simple recolours to anime, game and band art, often in glaring colours and at the cost of legibility.

05

More combinations

With Early Web Vernacular

All 10 combinations with Early Web Vernacular

With Media-Player

Every style combination