benjivers/notes Public Public: anyone can read this; nobody can change it.

Files main
332 lines · 6.0 KB · ~2.0k tok Raw History
1
{
2
  "$description": "The look, as data (W3C design tokens). Every colour the app shows is here and nowhere else: src/tokens.ts compiles this to /tokens.css at boot, and bun run lint:design refuses a raw colour anywhere else. A colour's $value is the light theme; $extensions.mode.dark is the dark one.",
3
  "color": {
4
    "$type": "color",
5
    "bg": {
6
      "$value": "#ffffff",
7
      "$extensions": {
8
        "mode": {
9
          "dark": "#1e1e1e"
10
        }
11
      },
12
      "$description": "The page and the note."
13
    },
14
    "surface": {
15
      "$value": "#f6f6f6",
16
      "$extensions": {
17
        "mode": {
18
          "dark": "#262626"
19
        }
20
      },
21
      "$description": "The sidebars."
22
    },
23
    "fg": {
24
      "$value": "#222222",
25
      "$extensions": {
26
        "mode": {
27
          "dark": "#dadada"
28
        }
29
      }
30
    },
31
    "muted": {
32
      "$value": "#5e5e5e",
33
      "$extensions": {
34
        "mode": {
35
          "dark": "#a3a3a3"
36
        }
37
      }
38
    },
39
    "line": {
40
      "$value": "#e3e3e3",
41
      "$extensions": {
42
        "mode": {
43
          "dark": "#363636"
44
        }
45
      }
46
    },
47
    "hover": {
48
      "$value": "#ececec",
49
      "$extensions": {
50
        "mode": {
51
          "dark": "#2f2f2f"
52
        }
53
      }
54
    },
55
    "active": {
56
      "$value": "#e9e3fc",
57
      "$extensions": {
58
        "mode": {
59
          "dark": "#332e47"
60
        }
61
      },
62
      "$description": "The open note in the list."
63
    },
64
    "accent": {
65
      "$value": "#6741d9",
66
      "$extensions": {
67
        "mode": {
68
          "dark": "#a88bfa"
69
        }
70
      }
71
    },
72
    "accent-fg": {
73
      "$value": "#ffffff",
74
      "$extensions": {
75
        "mode": {
76
          "dark": "#1a1033"
77
        }
78
      }
79
    },
80
    "danger": {
81
      "$value": "#b42318",
82
      "$extensions": {
83
        "mode": {
84
          "dark": "#f87171"
85
        }
86
      }
87
    },
88
    "mark-bg": {
89
      "$value": "#fff3a3",
90
      "$extensions": {
91
        "mode": {
92
          "dark": "#5e5017"
93
        }
94
      },
95
      "$description": "==Highlights==."
96
    },
97
    "code-bg": {
98
      "$value": "#f1f1f1",
99
      "$extensions": {
100
        "mode": {
101
          "dark": "#2b2b2b"
102
        }
103
      }
104
    },
105
    "code-fg": {
106
      "$value": "#a1246f",
107
      "$extensions": {
108
        "mode": {
109
          "dark": "#f2a5cf"
110
        }
111
      }
112
    },
113
    "tag-bg": {
114
      "$value": "#ede8fd",
115
      "$extensions": {
116
        "mode": {
117
          "dark": "#2f2a45"
118
        }
119
      }
120
    },
121
    "tag-fg": {
122
      "$value": "#5130b8",
123
      "$extensions": {
124
        "mode": {
125
          "dark": "#c9b8ff"
126
        }
127
      }
128
    },
129
    "link-missing": {
130
      "$value": "#7a5dc7",
131
      "$extensions": {
132
        "mode": {
133
          "dark": "#8f7bc4"
134
        }
135
      },
136
      "$description": "A [[link]] to a note not written yet."
137
    },
138
    "graph-node": {
139
      "$value": "#8f8f8f",
140
      "$extensions": {
141
        "mode": {
142
          "dark": "#8c8c8c"
143
        }
144
      }
145
    },
146
    "graph-edge": {
147
      "$value": "#d2d2d2",
148
      "$extensions": {
149
        "mode": {
150
          "dark": "#474747"
151
        }
152
      }
153
    },
154
    "callout-info": {
155
      "$value": "#1d5fd1",
156
      "$extensions": {
157
        "mode": {
158
          "dark": "#6aa8ff"
159
        }
160
      }
161
    },
162
    "callout-tip": {
163
      "$value": "#0b7350",
164
      "$extensions": {
165
        "mode": {
166
          "dark": "#3ed1a0"
167
        }
168
      }
169
    },
170
    "callout-warning": {
171
      "$value": "#9a5300",
172
      "$extensions": {
173
        "mode": {
174
          "dark": "#f7b84b"
175
        }
176
      }
177
    },
178
    "callout-danger": {
179
      "$value": "#c2262e",
180
      "$extensions": {
181
        "mode": {
182
          "dark": "#ff7a7a"
183
        }
184
      }
185
    },
186
    "toast-bg": {
187
      "$value": "#222222",
188
      "$extensions": {
189
        "mode": {
190
          "dark": "#dadada"
191
        }
192
      }
193
    },
194
    "toast-fg": {
195
      "$value": "#ffffff",
196
      "$extensions": {
197
        "mode": {
198
          "dark": "#1e1e1e"
199
        }
200
      }
201
    },
202
    "shadow": {
203
      "$value": "#0000002e",
204
      "$extensions": {
205
        "mode": {
206
          "dark": "#00000099"
207
        }
208
      }
209
    },
210
    "scrim": {
211
      "$value": "#00000052",
212
      "$extensions": {
213
        "mode": {
214
          "dark": "#000000a3"
215
        }
216
      }
217
    }
218
  },
219
  "space": {
220
    "$type": "dimension",
221
    "1": {
222
      "$value": "0.25rem"
223
    },
224
    "2": {
225
      "$value": "0.5rem"
226
    },
227
    "3": {
228
      "$value": "0.75rem"
229
    },
230
    "4": {
231
      "$value": "1rem"
232
    },
233
    "5": {
234
      "$value": "1.5rem"
235
    },
236
    "6": {
237
      "$value": "2.5rem"
238
    }
239
  },
240
  "radius": {
241
    "$type": "dimension",
242
    "sm": {
243
      "$value": "6px"
244
    },
245
    "md": {
246
      "$value": "10px"
247
    },
248
    "lg": {
249
      "$value": "14px"
250
    },
251
    "pill": {
252
      "$value": "999px"
253
    }
254
  },
255
  "size": {
256
    "$type": "dimension",
257
    "tap": {
258
      "$value": "44px",
259
      "$description": "The least a control measures on a side."
260
    },
261
    "left": {
262
      "$value": "17rem",
263
      "$description": "The notes sidebar."
264
    },
265
    "right": {
266
      "$value": "18rem",
267
      "$description": "The links sidebar."
268
    },
269
    "read": {
270
      "$value": "46rem",
271
      "$description": "The widest a line of a note runs."
272
    }
273
  },
274
  "font": {
275
    "$type": "fontFamily",
276
    "sans": {
277
      "$value": [
278
        "system-ui",
279
        "-apple-system",
280
        "Segoe UI",
281
        "sans-serif"
282
      ]
283
    },
284
    "mono": {
285
      "$value": [
286
        "ui-monospace",
287
        "SFMono-Regular",
288
        "Menlo",
289
        "monospace"
290
      ]
291
    },
292
    "serif": {
293
      "$value": [
294
        "Iowan Old Style",
295
        "Palatino Linotype",
296
        "Georgia",
297
        "serif"
298
      ]
299
    }
300
  },
301
  "text": {
302
    "$type": "dimension",
303
    "sm": {
304
      "$value": "0.875rem"
305
    },
306
    "base": {
307
      "$value": "1rem",
308
      "$description": "Never below 16px: a phone zooms into a smaller input."
309
    },
310
    "lg": {
311
      "$value": "1.125rem"
312
    },
313
    "xl": {
314
      "$value": "1.5rem"
315
    },
316
    "xs": {
317
      "$value": "0.75rem"
318
    },
319
    "2xl": {
320
      "$value": "2rem"
321
    }
322
  },
323
  "leading": {
324
    "$type": "number",
325
    "body": {
326
      "$value": 1.55
327
    },
328
    "tight": {
329
      "$value": 1.2
330
    }
331
  }
332
}
↑↓ navigate ↵ open esc close
↑↓ navigate ↵ open esc close

Keyboard shortcuts