← ClaudeAtlas

editorial-web-typographylisted

Use when designing article, long-form, marketing, or art-directed pages — pull quotes, drop caps, captions, bylines, subheads, figures, footnotes, hero compositions. Also use when an article template feels flat and undifferentiated, or when a page needs expressive typographic voice without sacrificing readability.
jpoindexter/typography-skills · ★ 1 · Code & Development · score 74
Install: claude install-skill jpoindexter/typography-skills
# Editorial web typography Where typography stops receding. Editorial pages carry voice, and voice is carried by the parts around the body text as much as by the body text itself. ## 1. When to invoke - Article, essay, documentation, or long-form templates. - Marketing and landing pages with substantial copy. - Pull quotes, drop caps, captions, bylines, footnotes, figure treatment. - Art-directed or per-story layouts. - An article template that "feels flat". **Do not** invoke for dense product UI (`ui-component-typography`) or for the body setting itself (`body-text-and-reading`). ## 2. Required context - The **real content inventory** — does every story have a pull quote, a hero image, a subtitle? Templates fail on the story that lacks them. - **Story length range**, shortest to longest. - Whether layouts are **templated** or **art-directed per story**. - Whether content is authored in **Markdown/CMS** (constrains what's expressible). - Brand voice, and how far type may carry it. ## 3. Invariant principles - **The body text is the product.** Every editorial device exists to serve reading, not to decorate around it. If a device interrupts reading without repaying it, remove it. - **Secondary elements need a distinct, consistent voice.** Captions, bylines, and footnotes should be recognisable as a class at a glance, and consistent across every story. - **A device must degrade.** A drop cap must work when the paragraph is two lines; a pull quote must work wh