2e:null 2f:["$","title",null,{"children":"Untitled | Grant Custer | Observable"}] 34:[] 32:{"id":"6366daaa6f33b000","slug":"untitled","title":"","thumbnail":"300907e3a540eb0667183823b6cc74f4a14b5134f2b447c14bb13b318efa7961","access_level":"public","create_time":"$D2018-11-16T23:15:16.784Z","update_time":"$D2019-05-02T18:34:03.066Z","view_time":null,"first_public_time":"$D2018-11-17T16:09:11.093Z","has_unpublished_edits":null,"fork":false,"stars":0,"starred":false,"owner":{"type":"team","id":"bf2c1edd2a33aa1b","login":"grantcuster","name":"Grant Custer","avatar_url":"https://avatars-next.observableusercontent.com/10eebb9a620b6b833738fb495f94fb682bcdc3270b247a9a8aef575ed0702c48","tier":"starter_2024"},"version":102,"publish_version":102,"role":null,"authored":false,"authors":[{"type":"individual","id":"a1f8c368ee3d80be","login":"grantcuster","name":"Grant Custer","avatar_url":"https://avatars-next.observableusercontent.com/10eebb9a620b6b833738fb495f94fb682bcdc3270b247a9a8aef575ed0702c48","tier":null}],"members":[{"type":"individual","id":"a1f8c368ee3d80be","login":"grantcuster","name":"Grant Custer","avatar_url":"https://avatars-next.observableusercontent.com/10eebb9a620b6b833738fb495f94fb682bcdc3270b247a9a8aef575ed0702c48","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":1,"collection":{"id":"a9b20524fc744bff","slug":"layout","title":"Layout","owner":{"id":"bf2c1edd2a33aa1b","login":"grantcuster","name":"Grant Custer"}},"type":"notebook","body":{"title":"","cells":[{"id":0,"value":"md`

Inter UI variable font

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":12,"value":"html`

Experimenting with Inter UI variable font.

Inter UI is a typeface specially designed for user interfaces with focus on high legibility of small-to-medium sized text on computer screens.

The family features a tall x-height to aid in readability of mixed-case and lower-case text. Several OpenType features are provided as well, like contextual alternates that adjusts punctuation depending on the shape of surrounding glyphs, slashed zero for when you need to disambiguate \"0\" from \"o\", tabular numbers, etc.

`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":39,"value":"viewof wght = DOM.range(1, 1000)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":52,"value":"viewof slnt = DOM.range(0, 10)","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":79,"value":"paragraph = {\n let paragraph = 'The family features a tall x-height to aid in readability of mixed-case and lower-case text. Several OpenType features are provided as well, like contextual alternates that adjusts punctuation depending on the shape of surrounding glyphs, slashed zero for when you need to disambiguate \"0\" from \"o\", tabular numbers, etc.'.split(\n \"\"\n );\n return paragraph;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":83,"value":"{\n let content = `

`;\n for (let i = 0; i < paragraph.length; i++) {\n let step = Math.round((i / paragraph.length) * 1000);\n let text = paragraph[i];\n content += `${text}`;\n }\n content += `

`;\n for (let i = 1; i < 1001; i++) {\n content += `g`;\n }\n content += `

`;\n return html`${content}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"css = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W34","stdlib":"1","titling":"auto"}} 33:"$32:body"