the source of truth for bicycle's visual language. the deck above tells the story; everything below is for building with it.
<link rel="stylesheet" href="https://brand.bicycle.computer/site.css">
site.css pulls in rene.css and bicycle.css. link bicycle.css alone if you only want the tokens and the typefaces.
garamond — titles, display, anything that speaks
under — body, labels, anything that informs
two faces. --title and --font. weight and size do the rest.
plus --ink #111111, --paper #ffffff, --muted #808080, --line #bbbbbb.
| bicycle.css | the tokens — typefaces, colour, type scale |
| site.css | the one link. rene.css + bicycle.css |
| brand.json | the words — name, story, positioning |
| design/type | the typefaces |
| design/mark | the logo, wordmark, favicons |
| design/kind | a drawing per kind of file bike opens |
| design/art | illustration and ornament |
| design/photo | rooms and product |
| design/print | posts, posters, stories, tickets, templates |
| 01 – 71 | the deck |