assets.gf.cx · format-chips
shelf primitive

format-chips

A row of small mono pills that hang off a reference link — every onward route to the thing, as compact tappable chips, instead of one bare link. First shipped as the book row on growth.gf.cx teardowns; the same primitive carries any format vocabulary.

<link rel="stylesheet" href="https://assets.gf.cx/format-chips/format-chips.css">

Book row — the original

the book
How to Make a Billion in 9 Steps · Richard Harpin buy libby pdf epub 
<!-- primary tier (.fmt) = first-party routes · alt tier (.fmt.alt) = the rest -->
<span class="fmts">
  <a class="fmt"     href="…">buy</a>
  <a class="fmt"     href="…">libby</a>
  <a class="fmt alt" href="…">pdf</a>
  <a class="fmt alt" href="…">epub</a>
</span>

Media row — same primitive, new vocabulary

the source
Uncensored CMO — Pedro Pina listen clip

Theming

Chips recolour from two tokens: --accent (primary tier) and --clay (alt tier). color-mix derives each chip's tint from the same token, so one variable sets a whole tier. Both fall back to portfolio hexes on bare HTML.