Design notes · 6 min read

A quieter way to make a product feel clear

A good interface makes room for people to think. It uses clear hierarchy, comfortable line lengths, and just enough contrast to direct attention without demanding it.

Start with the reading rhythm

Body copy should feel steady. Use italics for a gentle change in tone, inline code for implementation details, and links only when they help someone move forward.

Typography is the interface between the words and the reader.

Three useful defaults

• Use headings to create a visible outline.
• Keep paragraphs focused on one idea.
• Let supporting text stay quieter than primary content.

1. Choose a body face built for extended reading.
2. Pair it with a distinct, expressive heading face.
3. Reserve mono type for code, values, and technical detail.

Let the details support the message

These settings are applied to every example here, so changes in the configuration panel immediately show how the system behaves in a realistic document.

export const article = {
  rhythm: "comfortable",
  hierarchy: "clear",
};