list.synthwave-tracklist · Tracklist

A list pattern from Synthwave Retro-Future, drawn alone below with this design's tokens and sample copy. Used in this design on: home page, section 4. Give the section root data-pattern="list.synthwave-tracklist". A guide only: DESIGN.md and tokens.json are the source of truth.

Rule
A square duotone cover with the label and title on 1–4; the tracklist on 6–12: mono number, uppercase title and mono duration per ruled row.
Slots
sectionLabel, title, image, items[5..10]
Grid areas
cover 1-4 · tracks 6-12 (12-column grid, 1-based inclusive spans)
Tokens
bg #0E0B1F · text #EDE6FF · heading #FFFFFF · accent #FE2D6D · accent2 #00A59F · Orbitron / Space Grotesk · radius 2px · space unit 8px (full list in design/tokens.json)

Pattern notes

  • Columns 1–4: mono label, chrome h2, and a square duotone cover in a neon frame. Columns 6–12: 5–10 ruled rows, each with a mono number (link colour), the uppercase track title (h4, 700) and a mono duration (muted) right-aligned. Works as a menu or agenda too.

Index

Services

01

Discovery sprint

2 weeks

02

Positioning workshop

1 day

03

Identity design

8 weeks

04

Website

10 weeks

05

Launch support

4 weeks

06

Retainer

Ongoing