References

\n The bolded entries with an asterisk (*) are the classics — in my\n opinion the canonical works on the topic. The rest are on the theme but to varying\n degrees.\n

\n\n

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n

\n );\n}",[170],"29ee2b22-f65b-4198-af6d-1ad7282761db","README.md","9ac75200-6cc3-11f1-b3b9-1607ee4eb77e",227,["D",1784836405148],4,"# legibility.fyi\n\nAn info-site that makes the idea of **legibility** legible.\n\n> **Legibility: how easily something can be understood.**\n\nMost writing about legibility is about its downside — James C. Scott's _Seeing\nLike a State_, the state flattening the complexity it can't read. This site is\nabout the other side: legibility as one of the most powerful tools we have, for\nthinking and for getting what you want. \"Legibility, by people who don't hate\nit.\"\n\nThe site has to practice what it preaches. If you can't understand legibility at\na glance here, the site has failed at its one job. So it stays short, and lets\nexamples do the teaching.\n\n## Pages\n\n- **/** — the definition, and a few sharp examples. The whole thing in one\n glance.\n- **/gallery** — a long browse of legible-vs-illegible _pairs_ (maps,\n interfaces, forms, charts, everyday objects). You already know which side is\n which.\n- **/references** — a chronological reading pile: where the word comes from, how\n people make things understandable, and the case against.\n\nThe long, personal version of the argument lives as an essay on\n[stevekrouse.com](https://stevekrouse.com), not here — this site is the map, not\nthe territory.\n\n## Models\n\nExemplars we're learning from — ideas and info-sites that spread an abstract\nconcept well, or that share the spirit of what legibility points at:\n\n- [Growth mindset](https://ctl.stanford.edu/students/growth-mindset) — a single\n psychological idea made teachable and widely adopted.\n- [Grit](https://en.wikipedia.org/wiki/Grit_(personality_trait)) — another\n one-concept idea that broke into the mainstream.\n- [Malleable Systems](https://malleable.systems/) — a community + crisp\n manifesto around software you can understand and change.\n- [End-user programming](https://www.inkandswitch.com/end-user-programming/) —\n Ink & Switch on giving people legible, modifiable computing.\n- [End-user development](https://en.wikipedia.org/wiki/End-user_development) —\n the broader field; legibility as a precondition for participation.\n\n## Tech\n\nVal Town val\n[`stevekrouse/legibility`](https://www.val.town/x/stevekrouse/legibility/code/).\nHono + JSX SSR (`npm:hono/jsx`, React-free), Twind for styling. One file per\npage (`Home.tsx`, `Gallery.tsx`, `References.tsx`), a shared `Layout.tsx`,\nrouted in `main.tsx`.\n\nConventions: content is written as JSX markup, not data arrays. No HTML/CSS/JS\ninside template strings. Keep files small. View source at\n[legibility.fyi/source](https://legibility.fyi/source).\n\n## X bot\n\n`main.tsx` exposes `GET` and `POST /bot/twitter_webhook` for X webhook CRC\nvalidation and signed event delivery. The integration uses these scoped secrets:\n\n- `TWITTER_CONSUMER_KEY`\n- `TWITTER_CONSUMER_SECRET`\n- `TWITTER_BEARER_TOKEN`\n- `TWITTER_ACCESS_TOKEN`\n- `TWITTER_ACCESS_TOKEN_SECRET`\n- `TWITTER_OAUTH2_CLIENT_ID`\n- `TWITTER_OAUTH2_CLIENT_SECRET`\n- `TWITTER_OAUTH2_ACCESS_TOKEN`\n- `TWITTER_OAUTH2_REFRESH_TOKEN`\n\nRun `bot/verifyTwitterSetup.ts` to inspect X's registered webhook and activity\nsubscriptions without printing any credentials. The OAuth 2.0 user grant includes\n`users.read`, `tweet.read`, `dm.read`, `dm.write`, and `offline.access`. Active\nsubscriptions deliver `post.mention.create`, `dm.received`, and `dm.sent` events\nfor `@legibility_bot` to the webhook.\n\n## Next steps\n\n- Finish https://stevekrouse.com/legibility\n- Edit or remove the /gallery, maybe bring an example or two onto the homepage",[178],"a618aa5f-330e-4881-a229-202af38d5d68","Layout.tsx","7c7eabe8-6a81-11f1-b53c-1607ee4eb77e",213,["D",1784652748588],25,"/** @jsxImportSource npm:hono/jsx */\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\n\nexport function Layout(\n props: { title: string; description: string; sourceFile: string; children: any },\n) {\n const sourceUrl = `${parseVal().links.self.val}/code/${props.sourceFile}`;\n return (\n \n \n \n \n {props.title}\n \n \n \n \n \n

\n Home\n References\n Asks\n

{props.children}

\n \n

\n \n \n );\n}\n",[186],"55729bd8-5d48-4825-a9db-0c4f0d726247","Home.tsx","8015b260-6a81-11f1-b769-1607ee4eb77e",201,["D",1784575309887],54,"/** @jsxImportSource npm:hono/jsx */\n\nexport function Home() {\n return (\n

\n Legibility: how easily something can be understood\n

\n A place{\" \"}\n is legible if you can understand how to navigate it.\n
\n A person{\" \"}\n is legible if you understand what they do, and how to interact with\n them.\n
\n A company{\" \"}\n is legible if you understand what it does and how it's funded.\n
\n A product{\" \"}\n is legible if you understand what problems it solves for whom. (That\n kind of legibility is usually called \"positioning\".)\n
\n A concept{\" \"}\n is legible if you can understand it and use it.\n
\n A user interface{\" \"}\n is legible if you can tell what it does and how to operate it.\n

\n\n

Hall of fame

\n \n \n \n \n \n \n \n \n \n \n \n \n

\n );\n}\n",[202],"f72d239d-1f9b-4c30-aa5d-fa0db9b71320","Gallery.tsx","0e2bd6ae-6cc3-11f1-9a10-1607ee4eb77e",165,["D",1781975699562],10,"/** @jsxImportSource npm:hono/jsx */\n\nexport function Gallery() {\n return (\n

Gallery

\n Hall of fame{\" \"}\n great legibility\n
\n Comparisons{\" \"}\n illegible vs legible\n

\n );\n}\n",[209],"cfb3c790-f1d8-4ef2-b7ba-e957929fab6e","Comparisons.tsx","8186ac34-6ccb-11f1-8edd-1607ee4eb77e",163,["D",1781975673220],"/** @jsxImportSource npm:hono/jsx */\n\nfunction Pair(\n props: {\n title: string;\n illegible: string;\n legible: string;\n credit?: string;\n creditHref?: string;\n },\n) {\n return (\n

{props.title}

\n \n

\n Illegible\n

\n \n

\n Legible\n

\n \n

\n {props.credit\n ? (\n

\n {props.creditHref\n ? (\n \n {props.credit}\n \n )\n : props.credit}\n

\n )\n : null}\n

\n );\n}\n\nexport function Comparisons() {\n return (\n

\n ← Gallery\n

Comparisons

\n \n \n \n

\n );\n}\n",[217],"04a6e389-c54b-4a77-96e8-5cd8202cdb46","Ask.md","6560a05c-8524-11f1-b335-1607ee4eb77e",215,["D",1784743870982],2,"# Great examples of people asking for what they want\n\nThis is a collection of excellent job postings or resumes, people pouring their\nheart-and-soul into a post that explains who they are, who they're looking for,\nand how you might fit into their story.\n\nKnow a great example? Email\n[steveykrouse@gmail.com](mailto:steveykrouse@gmail.com) to submit other examples\nof legible asks.\n\n## Work for me\n\n### Janie Leger looking for an Au Pair\n\n![Janie Leger Au Pair](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/9922b1f7-e895-4671-4caf-a2a922f7e100/public)\n\n[Tweet](https://x.com/JanineLeger/status/2035457636527734857?s=20) –\n[Description](https://docs.google.com/document/d/1UdIEdh9ULIrx4x0KaZvIfFfM1OlySmltYI7ahEjyoUQ/edit?tab=t.0)\n–\n[Application](https://docs.google.com/forms/d/e/1FAIpQLSebJhm0K_kTkvDoKorFkyCwAmYZU4qQyYPlC9tdW800scQ0DA/viewform)\n\n---\n\n[https://photos.app.goo.gl/59XDXmZW8gXMa4E2A](https://photos.app.goo.gl/59XDXmZW8gXMa4E2A)\n\n[https://x.com/i/status/2072782668215771465](https://x.com/i/status/2072782668215771465)\n\n---\n\n![Astrid Wilde](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/67e7a4e2-298e-4293-cd84-b348ee09af00/public)\n\n[https://x.com/astridwilde1/status/2074195234100249061?s=20](https://x.com/astridwilde1/status/2074195234100249061?s=20)\n\n### Jeff Weinstein\n\nJeff Weinstein is a \"legible person at an organization,\" which is a useful thing\nin its own right:\n\n![Jeff Weinstein](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/6f09aa08-f9f7-4396-7d9c-aafa1ced0900/public)\n\n[https://x.com/stevekrouse/status/2014452454767648798?s=20](https://x.com/stevekrouse/status/2014452454767648798?s=20)\n\n---\n\n![Jeff Weinstein 2](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/26cbdefe-8e70-40ab-72b6-3794ef241d00/public)\n\n[https://x.com/jeff_weinstein/status/2069267265678463012?s=20](https://x.com/jeff_weinstein/status/2069267265678463012?s=20)\n\n### OpenAI\n\n![OpenAI](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/1b2c7f19-5a21-4c82-bd38-b164057b0500/public)\n\n[https://x.com/juberti/status/2078195237550485529?s=20](https://x.com/juberti/status/2078195237550485529?s=20)\n\n## Hire Me\n\n- Pat Lavarre's Hire me doc:\n [https://x.com/pelavarre/status/2043508607497777614?s=20](https://x.com/pelavarre/status/2043508607497777614?s=20)\n- Sahar's hire me: [https://sahar.io/hire-me/](https://sahar.io/hire-me/)\n- [https://x.com/majamediaco/status/2057800624943886808?s=20](https://x.com/majamediaco/status/2057800624943886808?s=20)\n- [https://open.substack.com/pub/velvetnoise/p/how-to-enter-side-doors](https://open.substack.com/pub/velvetnoise/p/how-to-enter-side-doors)\n\n- @shawnbuilds on Twitter:\n\n![Screenshot 2026-07-21 at 12.48.20@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/fc816d08-0361-4ecc-c4cf-6d4e98994600/public)\n\nhttps://x.com/shawnbuilds/status/2079582671433584984?s=20\n\n## Date Me\n\nThe whole date me directory, obviously, and some in particular and fantastic\nexamples:\n\n[https://x.com/stevekrouse/status/2036836965312528830?s=20](https://x.com/stevekrouse/status/2036836965312528830?s=20)\n\n### Date my friend\n\n![Date my friend](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/90d6041e-2b42-4cfa-69f8-773f05011000/public)\n\n[https://x.com/aadilpickle/status/2070259860827242886?s=20](https://x.com/aadilpickle/status/2070259860827242886?s=20)\n\n---\n\n![Date my friend 2](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/67373d61-b9b6-45f8-88e3-ff758eb01300/public)\n\n[https://x.com/majamediaco/status/2073867409593905550?s=20](https://x.com/majamediaco/status/2073867409593905550?s=20)\n\n## House me\n\n![House me](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/d1464085-f463-441e-86fb-e6f8195e6800/public)\n\n[https://x.com/majamediaco/status/2070552791538659785?s=20](https://x.com/majamediaco/status/2070552791538659785?s=20)\n\n## Disclose to me\n\n![Disclose to me](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/4c11b9ac-489c-4d92-a449-110761392d00/public)\n\n[https://x.com/anissagardizy8/status/2074188571263791519?s=20](https://x.com/anissagardizy8/status/2074188571263791519?s=20)\n\n---\n\n# Apply for my funding\n\n- YC's Request for Startups\n\n---\n\nKnow a great example? Email\n[steveykrouse@gmail.com](mailto:steveykrouse@gmail.com) to submit other examples\nof legible asks.",[224],"97efa775-49dc-4b71-9ced-7c007d8991e0","AGENTS.md","ca2ad594-8465-11f1-ad83-1607ee4eb77e",235,["D",1784842559844],"# legibility.fyi — Architecture\n\n## Overview\nA multi-page site about the concept of \"legibility,\" rendered server-side with Hono JSX. The X bot webhook route uses scoped environment variables for authentication; there is no database or blob storage.\n\n## Tech\n- **Routing:** Hono (`main.tsx` is the HTTP entrypoint, uses `hotReload`)\n- **Templating:** `hono/jsx` (not React — `/** @jsxImportSource npm:hono/jsx */` at top of .tsx files)\n- **Styling:** Twind via CDN (`https://cdn.twind.style`) in Layout.tsx. Markdown pages use a `

Diff · v236