← All Notes
Markdown Kitchen Sink

Markdown Kitchen Sink

Think of this page as a style-guide. Here I list down all the elements from my blog and experiment with their styling. It's a jumping off point to get your type, colors and component styles locked in for the site. The content of this page doesn't particularly make sense so I wouldn't bother reading.

I used to power this site from Notion with a renderer that I wrote, but given how complex the data structures became over time — it quickly started to feel hard to maintain. Every time Notion would update their architecture, my renderer would break until I made appropriate connections.

Back to Markdown

I moved all my notes back to good ol' markdown, but I do miss the flexibility. I'd become used to the plethora of block types available in Notion: todos, callouts, fancy embeds, kanban. It'll take a while to unlearn all my muscle memory for those and pare them all down.

Vanilla markdown elements

  1. paragraphs
  2. a few headings
  3. lists like this one
  4. quotes
  5. media
    • images
    • videos
  6. Oh, and code blocks but that's about it.

This is what a quote looks like. 🧱

Within running text, here's what an image looks like on it's own:

The last little frond on an unhappy indoor palm

Each image should also be accompanied a caption explaining what the image is about.

Next Steps

There may be ways for me to spin some styling over the basics and still arrive at something unique for this site.

Todo