Agent Session

Embed a curated coding agent session (from Claude Code, Codex, Gemini CLI, Aider, etc.):

{% agent_session ID %}

Embed a named slice (created in the curation tool) to narrate different parts throughout your post:

{% agent_session ID planning %}

Or embed a specific range of messages by index:

{% agent_session ID 0..10 %}

Upload and curate a session to get the ID.

Card

You can create a standalone highlight card to emphasize important content. The content inside the card can use Markdown.

{% card %}
This is some **important** content inside a card!
{% endcard %}

Call To Action (CTA)

Provide a link that a user will be redirected to when clicked. The description will contain the label/description for the call to action button.

{% cta link %}
 description 
{% endcta %}

Details / Spoiler / Collapsible

You can embed an interactive HTML element to hide content behind a summary. This is great for hiding text (i.e. answers to questions) behind a click.

  {% details summary %} content {% enddetails %}
  {% spoiler summary %} content {% endspoiler %}
  {% collapsible summary %} content {% endcollapsible %}

KaTex

Place your mathematical expression within a KaTeX liquid block, as follows:

{% katex %}
 c = \pm\sqrt{a^2 + b^2}
{% endkatex %}

To render KaTeX inline add the "inline" option:

{% katex inline %} c = \pm\sqrt{a^2 + b^2} {% endkatex %}

Feed

Embed an article feed by organization, tag, or multiple tags:

{% feed org=org-slug %}
{% feed tag=ruby %}
{% feed tags=ruby,javascript limit=10 sort=reactions %}

Options: limit (1-30), sort (recent/reactions/comments/score), min_reactions, min_comments, since (e.g. 30d or 2025-01-01).

Layout (Row & Col)

Create responsive grid layouts:

{% row %}
  {% col background=default %}Column 1{% endcol %}
  {% col span=2 background=subtle %}Wide column{% endcol %}
{% endrow %}

span sets column width (1-4, default 1). background accepts default or subtle.

Features

Display a grid of feature cards:

{% features %}
  {% feature title="Fast" icon="lightning" %}Optimized for speed.{% endfeature %}
  {% feature title="Secure" icon="🔒" %}Built with security in mind.{% endfeature %}
  {% feature title="Simple" %}No icon needed.{% endfeature %}
{% endfeatures %}

title is required. icon is optional and accepts either an emoji or one of the supported icon names below.

Supported icons: analytics, badge, book, boost, calendar, checkmark, code, cog, comment, connect, discover, email, fire, heart, image, lightning, location, lock, organization, pencil, people, raised-hands, search, sparkle-heart, sparkles, team, verified, video-camera, wallet.

Quote

Display a testimonial or quote:

{% quote author="Jane Doe" role="CTO" rating=5 %}Great product!{% endquote %}

Options: author (required), role, image, rating (1-5), source, link.

Group several testimonials into responsive columns:

{% quotes %}
  {% quote author="Jane Doe" rating=5 %}Great product!{% endquote %}
  {% quote author="John Smith" %}Easy to recommend.{% endquote %}
{% endquotes %}

Offer

Create a call-to-action box with a button:

{% offer link="https://example.com" button="Sign Up" %}Join us today!{% endoffer %}

link is optional (button is hidden without it). button defaults to "Learn More".

Slides

Create an image/video carousel or gallery:

{% slides mode="carousel" %}
  {% slide image="https://example.com/photo.jpg" alt="Description" %}
  {% slide video="https://youtube.com/watch?v=abc123" %}
{% endslides %}

Each slide needs at least one of: image, video, or link. Optional: title, alt.

mode="carousel" presents cards in a swipeable, scroll-snapping strip with optional desktop controls.