This should make my life easier! 🤞🏽

I have never, and I mean never, had interaction with state infrastructure that has been both positive and smooth. But this time, it took me a total of 30 seconds to get all the things I needed. 30 seconds!

I am surprised and thankful that this experience exists. Is this the Bengaluru tech culture percolating into the state police?

But recently, I have been realising this feels like a slot machine where every day I enter a prompt and wait for the machine to give me a reward.

This feels very familiar to the social media world that I am trying to get rid of and still feel addicted to sometimes. I need to build a better habit and space out my vibe coding. This is just sucking the energy out of me.

I feel motivated to enable the same experience and feelings for other people in my life who I and am inspired by.

This exploitative technology is making my open web dreams come true, bringing old projects to life. I am using all of this under the pretence of creation, but I can’t wash away my faults here.

Some related listening that really resonated with me - The future of code is exciting and terrifying.

Inline text

Running prose can include bold text for emphasis, italic text for titles and stress, and strikethrough for corrections or retractions. These can combine: bold italic works, as does struck italic.

Inline code renders in a monospace font with a faint background. It is for short technical terms, variable names, filenames — things that need to be distinguished from prose.

Links come in two kinds. External links point away from this site. Internal links navigate within it. Both use the standard browser link colour.

The typographer is on. This means “straight quotes” become “curly quotes” automatically. Apostrophes too: it’s, they’re, the '90s. A double hyphen – becomes an em dash. Three dots… become an ellipsis.

Headings

Headings here are the same size and weight as body text. Structure is in the spacing and in the words themselves, not in visual hierarchy. This is a deliberate choice.

Third-level heading

A third-level heading, introduced by ###. Used for subsections within a section.

Fourth-level heading

A fourth-level heading, ####. Use sparingly — if you need four levels of hierarchy in a single document, the document may need restructuring.

Lists

An unordered list:

• The first item, which establishes the pattern
• A second item, continuing it
• A third item, closing the set
  • A nested item, indented one level
  • Another nested item at the same level
    • Nested two levels deep, which is usually too deep

An ordered list:

1. The first step, which must come first
2. The second step, which follows from it
3. The third step, which completes the sequence
   1. A sub-step within the third step
   2. Another sub-step

A list where items are full sentences should end each sentence with a full stop. A list where items are fragments should not. Mixing the two in a single list is the most common list error.

Blockquote

A blockquote is for quotation — text that originates elsewhere. It is indented without decoration. The source, if needed, follows as a regular paragraph.

The test of a first-rate intelligence is the ability to hold two opposed ideas in mind at the same time and still retain the ability to function.

F. Scott Fitzgerald, The Crack-Up, 1936.

Code block

A fenced code block, with syntax annotation:

{
  "title": "A complete formatting reference",
  "date": "2026-03-26",
  "tags": ["meta", "design"]
}

A shell example:

npm run dev
# → Watching for changes…
# → Server at <http://localhost:8080>

Code blocks scroll horizontally if the content is wider than the page. They do not wrap.

Table

Tables use the standard pipe syntax. Column alignment is set with colons in the separator row.

Tables should be used for genuinely tabular data. If you find yourself merging cells or nesting tables, a list or prose is probably the right tool.

Page break

The grey strip above is a page break. It is for long documents that are conceptually divided into pages. It renders as a full-bleed band of the desk colour, with a page counter.

Use <hr class="page-break"> to insert one. A plain --- in the body renders as the typographic * * * section break, which is lighter.

Image

An image, constrained to the document width:

Images are block-level. They sit on their own line with vertical spacing above and below. They do not float. Captions are not built in — a following paragraph in italic can serve as one.

An SVG placeholder standing in for a real photograph. Replace with an actual image file in src/images/.

Callout

Margin note

The paragraph that hosts a margin note should be self-contained — readable without the note. The note adds, it does not complete. This is the difference between a margin note and a footnote: margin notes are optional; footnotes are referenced.^[1]

Custom IDs via attrs

The markdown-it-attrs plugin lets you attach HTML attributes to any block element by appending them in curly braces. The most useful case is overriding the auto-generated heading slug for stable deep links:

## My Heading { #custom-id }
## My Heading { .custom-class }
## My Heading { data-foo="bar" }

Note: because this site processes Nunjucks before markdown, ID attrs must be written with a space before the hash — { #id } rather than the collapsed form. Class and data attributes ({.class}, {data-x="y"}) have no such restriction.

Footnotes

Footnotes are numbered automatically and linked bidirectionally.^[2] The reference appears inline as a superscript; the note appears at the bottom of the document with a return link.

They are for genuine supplementary material — citations, extended asides, qualifications that would slow the prose if embedded in it. If you find yourself writing footnotes longer than the paragraphs they annotate, reconsider whether the footnote belongs in the body or in a separate section.