Sitemap

🛠️ Tool: Pasting AI Output Into Medium? Here’s What Survives and What Breaks

7 min readAug 21, 2026

--

When you copy-paste an AI (Claude) chat response into Medium, some things break — like nested lists being unsupported.

I made a tool (with Claude’s help) that checks what’s OK and what’s NG.

It’s stored below.

TOOL2/medium-paste-checker at main · GitGhidorah/TOOL2

Get Outermostkt’s stories in your inbox

Join Medium for free to get updates from this writer.

medium-paste-checker-en.html

How to use

  1. Click “Copy” on a card to copy it as rich HTML
  2. Paste it into the Medium editor (Cmd/Ctrl+V)
  3. Check how it renders in Medium, then select that content and copy it again
  4. Click the “Paste result from Medium” box on this tool and paste (Cmd/Ctrl+V)
  5. The structure is analyzed automatically and graded OK / Broken / Partial, with a badge and a reason
  6. If the auto-grade looks wrong you can override it with the dropdown. When you’re done, “Export results” writes everything out as Markdown
  • Grading is a simple heuristic that inspects the HTML structure (tags, nesting, attributes) captured at paste time. A visual double-check is recommended.
    * Important note: Medium sometimes expresses appearance through its own CSS classes rather than inline styles. When that happens, content can look perfectly fine inside Medium’s editor, but look like plain unstyled text once copied back out, because the class names have no matching stylesheet outside Medium. That’s a different question from “how does it look once pasted into Medium” — it’s about “what survives copying it back out of Medium.” When a “Partial” verdict shows a class name, that’s this case — trust what you actually saw in the Medium editor over this tool’s verdict.

Tool appearance

(partial excerpt)

Press enter or click to view image in full size

Medium Paste Compatibility Check Results

Lists

  • [L-01] Bulleted list (1 level): ✅ OK
  • Reason: Found 3 li tags — recognized as a bulleted list
  • [L-02] Bulleted list (2+ nested levels): ❌ Broken
  • Reason: Nesting was lost — it’s now a flat bullet list (detected depth 1)
  • [L-03] Numbered list (flat): ✅ OK
  • Reason: Recognized as a numbered list with 3 items
  • [L-04] Numbered list (nested): ❌ Broken
  • Reason: Nesting was lost — it’s now a flat list
  • [L-05] Task list (with checkboxes): △ Partial
  • Reason: The list structure remains, but the checkboxes were lost
  • [L-06] Definition list (dl/dt/dd): △ Partial
  • Reason: The text content remains, but the definition-list tag structure was lost

Tables

  • [T-01] Simple table: ❌ Broken
  • Reason: No table element detected — the table was lost
  • [T-02] Table with merged cells: ❌ Broken
  • Reason: The whole table structure was lost

Code

  • [C-01] Inline code: △ Partial — ★ OK in Medium itself
  • Reason: The code tag remains, and it carries class=”markup — code markup — p-code”. Since that look depends on Medium’s own stylesheet, this tool alone can’t reproduce or confirm it — trust what you saw in Medium’s editor
  • [C-02] Multi-line code block: △ Partial — ★ OK in Medium itself
  • Reason: The pre structure and class=”graf graf — pre graf — preV2" remain, but since that look depends on Medium’s own stylesheet, this tool alone can’t reproduce or confirm it — trust what you saw in Medium’s editor
  • [C-03] Syntax-highlight style (colored spans): △ Partial — ★ OK in Medium itself
  • Reason: 6 colored span(s) were found with class attributes still attached, but since the color depends on Medium’s own stylesheet, this tool alone can’t reproduce or confirm the actual color — trust what you saw in Medium’s editor

Text formatting

  • [D-01] Bold, italic, strikethrough, underline: △ Partial
  • Reason: Only 2 of 4 were preserved (Bold:yes / Italic:yes / Strikethrough:no / Underline:no)
  • [D-02] Superscript & subscript: ❌ Broken
  • Reason: Both superscript and subscript were lost (Subscript:no / Superscript:no)
  • [D-03] Text color & background color: ❌ Broken
  • Reason: The text color / background color was lost — it’s now plain text
  • [D-04] Headings (H1-H4): △ Partial
  • Reason: Everything is still a heading tag, but some levels were merged together (Heading 1→h3 / Heading 2→h3 / Heading 3→h3 / Heading 4→h4)

Quotes

  • [B-01] Simple blockquote: ✅ OK
  • Reason: The blockquote tag was preserved
  • [B-02] Nested blockquote: △ Partial
  • Reason: The quote remains, but the nesting was lost — it’s now a single level

Other

  • [O-01] Link: ✅ OK
  • Reason: The link (a tag with href) was preserved
  • [O-02] Image (inline SVG): ❌ Broken
  • Reason: The image is gone — only text remains
  • [O-03] Horizontal rule: ✅ OK
  • Reason: The hr divider was preserved
  • [O-04] Collapsible (details/summary): △ Partial
  • Reason: The text content remains, but the collapsible behavior was lost — it’s now plain text
  • [O-05] Two-column layout (CSS columns): ❌ Broken
  • Reason: The text content remains, but the multi-column CSS layout was lost — it’s now a single column
  • [O-06] Emoji & Unicode mix: ✅ OK
  • Reason: The emoji and mixed-Unicode text came through unchanged
  • [O-07] Footnote-style (sup + list): △ Partial
  • Reason: Either the superscript marker or the footnote list was lost (Superscript (sup):no — likely became a plain character string / Footnote list (ol/li):yes, preserved)

Appendix: raw HTML captured from the paste-back

[L-01] Bulleted list (1 level)

<html>
<body>
<!--StartFragment--><ul class="postList"><li name="a40c" class="graf graf--li">Apple</li><li name="3bee" class="graf graf--li">Orange</li><li name="9f94" class="graf graf--li">Grape</l…

[L-02] Bulleted list (2+ nested levels)

<html>
<body>
<!--StartFragment--><p name="a2b3" class="graf graf--p graf--empty"><br></p><ul class="postList"><li name="5506" class="graf graf--li">Fruit</li><li name="28f4" class="graf graf--li">A…

[L-03] Numbered list (flat)

<html>
<body>
<!--StartFragment--><p name="1893" class="graf graf--p graf--empty"><br></p><ol class="postList"><li name="0319" class="graf graf--li">Step 1</li><li name="97eb" class="graf graf--li">…

[L-04] Numbered list (nested)

<html>
<body>
<!--StartFragment--><p name="f160" class="graf graf--p graf--empty"><br></p><ol class="postList"><li name="a23a" class="graf graf--li">Prep</li><li name="b642" class="graf graf--li">Ga…

[L-05] Task list (with checkboxes)

<html>
<body>
<!--StartFragment--><p name="f160" class="graf graf--p graf--empty"><br></p><ul class="postList"><li name="1f2a" class="graf graf--li">Completed task</li><li name="4957" class="graf gr…

[L-06] Definition list (dl/dt/dd)

<html>
<body>
<!--StartFragment--><p name="5f8d" class="graf graf--p graf--empty"><br></p><p name="0932" class="graf graf--p">etymologyThe origin and history of a word. cognateA word descended from …

[T-01] Simple table

<html>
<body>
<!--StartFragment--><p name="5f8d" class="graf graf--p graf--empty"><br></p><p name="c255" class="graf graf--p">WordOriginMeaning etymologyGreek etymonorigin cognateLatin cognatusrelat…

[T-02] Table with merged cells

<html>
<body>
<!--StartFragment--><p name="e2ca" class="graf graf--p graf--empty"><br></p><p name="58d9" class="graf graf--p">Heading (merged cell) AB</p><p name="e755" class="graf graf--p graf--emp…

[C-01] Inline code

<html>
<body>
<!--StartFragment--><p name="43ef" class="graf graf--p graf--empty"><br></p><p name="4f0f" class="graf graf--p">The variable is written like <code class="markup--code markup--p-code">c…

[C-02] Multi-line code block

<html>
<body>
<!--StartFragment--><p name="5280" class="graf graf--p graf--empty"><br></p><pre data-code-block-mode="1" spellcheck="false" data-code-block-lang="javascript" name="953b" class="graf g…

[C-03] Syntax-highlight style (colored spans)

<html>
<body>
<!--StartFragment--><p name="469c" class="graf graf--p graf--empty"><br></p><pre data-code-block-mode="1" spellcheck="false" data-code-block-lang="javascript" name="e2ca" class="graf g…

[D-01] Bold, italic, strikethrough, underline

<html>
<body>
<!--StartFragment--><p name="2389" class="graf graf--p"><strong class="markup--strong markup--p-strong">Bold</strong>, <em class="markup--em markup--p-em">italic</em>, strikethrough, u…

[D-02] Superscript & subscript

<html>
<body>
<!--StartFragment--><p name="4a04" class="graf graf--p">H2O, E = mc2</p><p name="2e5f" class="graf graf--p graf--empty"><br></p><!--EndFragment-->
</body>
</html>

[D-03] Text color & background color

<html>
<body>
<!--StartFragment--><p name="1cfe" class="graf graf--p"><strong class="markup--strong markup--p-strong">Red bold text</strong> and highlighted background text</p><p name="91d1" class="…

[D-04] Headings (H1-H4)

<html>
<body>
<!--StartFragment--><h3 name="c590" class="graf graf--h3">Heading 1</h3><h3 name="ccd0" class="graf graf--h3">Heading 2</h3><h3 name="781e" class="graf graf--h3">Heading 3</h3><h4 name…

[B-01] Simple blockquote

<html>
<body>
<!--StartFragment--><p name="7481" class="graf graf--p graf--empty"><br></p><blockquote name="8058" class="graf graf--blockquote"><em class="markup--em markup--blockquote-em">This is a…

[B-02] Nested blockquote

<html>
<body>
<!--StartFragment--><p name="b420" class="graf graf--p graf--empty"><br></p><blockquote name="edc0" class="graf graf--blockquote"><em class="markup--em markup--blockquote-em">Outer quo…

[O-01] Link

<html>
<body>
<!--StartFragment--><p name="cbe0" class="graf graf--p graf--empty"><br></p><p name="324a" class="graf graf--p"><a href="https://example.com/" data-href="https://example.com/" class="m…

[O-02] Image (inline SVG)

<html>
<body>
<!--StartFragment--><p name="2e42" class="graf graf--p graf--empty"><br></p><p name="abbd" class="graf graf--p graf--empty"><br></p><!--EndFragment-->
</body>
</html>

[O-03] Horizontal rule

<html>
<body>
<!--StartFragment--><section name="b225" class="section section--body"><div class="section-divider"><hr class="section-divider"></div><div class="section-content"><div class="section-i…

[O-04] Collapsible (details/summary)

<html>
<body>
<!--StartFragment--><p name="fa29" class="graf graf--p">Click to expand</p><p name="736a" class="graf graf--p">This is the collapsed content.</p><p name="6aa0" class="graf graf--p graf…

[O-05] Two-column layout (CSS columns)

<html>
<body>
<!--StartFragment--><p name="6aa0" class="graf graf--p graf--empty"><br></p><p name="863e" class="graf graf--p">This text is meant to sit in the left column. It’s laid out into two col…

[O-06] Emoji & Unicode mix

<html>
<body>
<!--StartFragment--><p name="f26b" class="graf graf--p graf--empty"><br></p><p name="0f9f" class="graf graf--p">Emoji test 🎉📚✅ mixed with café, naïve, and 日本語 characters.</p><p name=…

[O-07] Footnote-style (sup + list)

<html>
<body>
<!--StartFragment--><p name="1b61" class="graf graf--p graf--empty"><br></p><p name="10c7" class="graf graf--p">This is the body text[1].</p><ol class="postList"><li name="0f74" class=…

Addendum

In the end, I think it’s fine to just refer to the results from the tool above.

If you want to look into anything further, you can hand this tool to an AI (Claude), and it should improve it for you accordingly.

--

--