app/src/content/article.mdx

---
title: "Bringing paper to life:\n A modern template for\n scientific writing
"
subtitle: "A modern, MDX-first research article template with math, citations and interactive figures."
description: "A modern, MDX-first research article template with math, citations and interactive figures."
authors:
  - "Thibaud Frere"
affiliation: "Hugging Face"
published: "Sep. 01, 2025"
tags:
  - research
  - template
ogImage: "/thumb.jpg"
---

import HtmlEmbed from "../components/HtmlEmbed.astro";
import Wide from "../components/Wide.astro";
import FullWidth from "../components/FullWidth.astro";
import { Image } from 'astro:assets';
import placeholder from "./assets/images/placeholder.png";
import audioDemo from "./assets/audio/audio-example.wav";
import Sidenote from "../components/Sidenote.astro";
import visualPoster from "./assets/images/visual-vocabulary-poster.png";

import BestPractices from "./chapters/best-pratices.mdx";
import WritingYourContent from "./chapters/writing-your-content.mdx";
import AvailableBlocks from "./chapters/available-blocks.mdx";  
import GettingStarted from "./chapters/getting-started.mdx";

<Sidenote>
  Welcome to this **single‑page** research article template. It helps you publish **clear**, **modern**, and **interactive** technical writing with **minimal setup**. Grounded in web‑native scholarship, it favors interactive explanations, clear notation, and inspectable examples over static snapshots.

  It offers a **ready‑to‑publish**, **all‑in‑one** workflow so you can focus on ideas rather than infrastructure.
  <Fragment slot="aside">
    Reading time: 20–25 minutes.
  </Fragment>
</Sidenote>

#### Features

<Sidenote>
<div className="tag-list">
  <span className="tag">Markdown based</span>
  <span className="tag">KaTeX math</span>
  <span className="tag">Syntax highlighting</span>
  <span className="tag">Citations & footnotes</span>
  <span className="tag">Automatic build</span>
  <span className="tag">Table of contents</span>
  <span className="tag">Dark theme</span>
  <span className="tag">HTML Embeds</span>
  <span className="tag">Plotly ready</span>
  <span className="tag">D3.js ready</span>
  <span className="tag">SEO Friendly</span>
  <span className="tag">Mermaid diagrams</span>
  <span className="tag">Lightweight bundle</span>
  <span className="tag">Mobile friendly</span>
  <span className="tag">Optimized images</span>
  <span className="tag">Automatic PDF export</span>
  <span className="tag">Dataviz color palettes</span>
  <span className="tag">Embed gradio apps</span>
</div>
<Fragment slot="aside">
    If you have questions, remarks or suggestions, open a discussion on the <a href="https://huggingface.co/spaces/tfrere/research-blog-template/discussions?status=open&type=discussion">Community tab</a>!
  </Fragment>
</Sidenote>

## Introduction
The web enables what static PDFs can’t: **interactive diagrams**, **progressive notation**, and **exploratory views** that reveal how ideas behave. This template makes **interactive artifacts**—figures, math, code and **inspectable experiments**—first‑class alongside prose, so readers **build intuition** rather than skim results.

If you write technical blogs or research notes, you’ll get a **ready‑to‑publish workflow** with clear notation, optimized media, and **automatic builds**. **Start below and iterate quickly.**

This project is heavily inspired by [**Distill**](https://distill.pub) (2016–2021), which championed clear, web‑native scholarship.

### Notable examples of excellent scientific articles


<Sidenote>
A short, curated list of well‑designed and often interactive work:

- [Growing Neural Cellular Automata](https://distill.pub/2020/growing-ca/)
- [Activation Atlas](https://distill.pub/2019/activation-atlas/)
- [Handwriting with a Neural Network](https://distill.pub/2016/handwriting/)
- [The Building Blocks of Interpretability](https://distill.pub/2018/building-blocks/)

<Fragment slot="aside">
    I'm always excited to discover more great examples—please share your favorites in the <a href="https://huggingface.co/spaces/tfrere/research-blog-template/discussions?status=open&type=discussion">Community tab</a>!
  </Fragment>
</Sidenote>



<GettingStarted />

<WritingYourContent />

<AvailableBlocks />

<BestPractices />