Compose two styles

Rather than blending two styles into a middle, this assigns them roles: one carries the structure, the other appears as an accent. Where the two fight, it says so before you start.

How to divide the work

Composition
Follow Web 1.0: Left-aligned, borders, table-like division
Type
Set in Web 1.0's manner (System sans and monospace), and let Web 2.0 Gloss's lettering (A rounded sans-serif) appear only where you want the eye to catch.
Material
Ground in Web 1.0's material (White background, blue links, dithered images); bring in exactly one thing from Web 2.0 Gloss (Blue gradients, white highlights).
Colour
Build on #c9c9c9, #0000ee, #111111 and admit one accent from #e7f5ff, #2b93de, #174d82.

Where they fight

  • Both belong to Digital Retro, so the difference is small. Push the roles further apart than feels comfortable.

Caution

  • Web 1.0 Don't regress actual accessibility. Separate the look from interaction quality.
  • Web 2.0 Gloss In real UI, restrain shadows and reflections so state differences stay legible.

Image prompt

An original image that takes its structure from Web 1.0 (Style, 1990s) and its accent from Web 2.0 Gloss (Style, 2000s). Structural cues: Blue links; Low-res GIFs; System fonts; Plain buttons. Accent cues, used sparingly: Glossy buttons; Strong gradients; Reflections; Rounded corners. Composition: Left-aligned, borders, table-like division. Type and lettering: System sans and monospace. Let one material quality come from the second style: Blue gradients, white highlights. Mood: Nostalgia, Play, Rebellion, Intimacy. Color: build on #c9c9c9, #0000ee, #111111 with a single accent drawn from #e7f5ff, #2b93de, #174d82. Constraints: do not imitate, reference or name any specific artist, studio, brand, character or copyrighted work. Produce an original composition in the general period languages described above.

prompt.txt

open in ChatGPT

open in Claude

open in Google AI

Related entries

  • Web 1.0 1990s / Style / Digital Retro

    Reuses the naivety of the constrained early web as directness and charm.

  • Web 2.0 Gloss 2000s / Style / Digital Retro

    Explains digital interaction as something touchable through gloss, roundness and reflection. It names what the web made when it tried to reproduce the texture of Aqua with images and CSS.

Share this pairing:
https://indexstyle.org/compose?ids=web-one+web-two-gloss

Back to index position