Share a Before and After on GitHub, Reddit, Discord and Forums

Developers, modders and AI hobbyists share before and afters all the time: a shader change, a texture pack, an upscaling model, a UI redesign. Most of the places they share them (GitHub, Reddit, Discord, mod sites and forums) block iframes and scripts, so an interactive slider can’t be embedded directly.

The trick is to post a clickable preview image that opens the interactive comparison. Every comparison you publish comes with ready-made snippets for this, in Markdown, HTML and BBCode.

First, publish the comparison

1. Drop your images into the comparison tool (up to ten, for example “vanilla”, “mod” and “mod + ReShade”).
2. Give it a clear title, like Skyrim – Vanilla vs. Noble Skyrim 2K. The title appears in link previews.
3. Optionally pick a readable link such as /c/noble-skyrim-2k (free with an account).
4. Publish and open the share panel.

The images are stored without recompression, so people who zoom in see your actual texture detail.

GitHub README, issues and pull requests

GitHub renders Markdown but strips <iframe> and scripts, so use the Markdown snippet:

[![Vanilla vs. HD textures](https://example.com/c/abc123/1.png)](https://example.com/c/abc123)

It shows your “after” image and links it to the interactive comparison. A few tips:

• In a pull request, put the comparison under a “Screenshots” heading and say what to look for: “Compare the shadow edges in the difference view.”
• For visual regression, leave the comparison on the Difference view before sharing. Reviewers then land on the heat map of every changed pixel. See how to read a difference image.
• In a README, a single comparison near the top, before the installation section, shows what the project does faster than any description.

If you would rather keep images in your repository, GitHub also supports the HTML <picture> and <img> tags, but they can’t be dragged. Link them to the comparison all the same.

Reddit

Reddit shows a thumbnail and the title for link posts, taken from the page’s preview image and title.

• Link post: paste the comparison link as the post URL. The preview shows the “after” image.
• Image post with a link: upload the side-by-side or “after” image as the post, then add the comparison link in the first comment: “Interactive slider with zoom: …”.
• In comments: paste the plain link; Reddit’s Markdown also accepts [text](link).

Subreddits for gaming, modding, photo editing and AI imaging (such as upscaling or Stable Diffusion communities) often ask for direct comparisons. Check the rules of each one before posting links. Where links aren’t welcome, a sweep video works; see posting before and afters as video.

Discord

Paste the comparison link on its own. Discord unfurls it into a card with the title and a large preview image. Viewers click through to drag the slider.

To make the message cleaner:

• Put a short line of context before the link: “Old vs. new lighting, check the windows.”
• To hide the preview card, wrap the link in angle brackets: <https://…>.
• Discord re-encodes images uploaded directly to a channel. If detail matters, link to the comparison instead of uploading the files.

Nexus Mods, mod pages and BBCode forums

Mod pages and classic forums use BBCode. Use the BBCode snippet:

[url=https://example.com/c/abc123][img]https://example.com/c/abc123/1.png[/img][/url]

This shows the preview image and links to the interactive version. On a mod page:

• Put one comparison per major change: textures, lighting, UI.
• Label every image with the exact mod and settings used.
• Add the comparison link to the mod’s image gallery description, where many players look first.

Blogs, docs and wikis

Anywhere that accepts HTML, you can embed the live slider with the Embed (iframe) code. Documentation tools such as Docusaurus or MkDocs, and most wikis, allow this. See how to add a slider to any website. Where iframes are blocked, the HTML snippet gives you the clickable image instead.

Snippet cheat sheet

Where	Snippet
GitHub, GitLab, Markdown docs	Markdown
Reddit post	Plain link
Discord, Slack, Telegram	Plain link (unfurls into a preview)
Nexus Mods, phpBB, vBulletin, XenForo	BBCode
WordPress, Webflow, Shopify, Wix	Embed (iframe)
Email newsletters	HTML (iframes don’t run in email)

See where it was shared

A comparison that gets posted around tends to travel further than you expect. With a free account, the dashboard lists which websites send visitors and which sites embed it, so you can find the forum thread or the wiki page that picked it up.

Publish your comparison and copy the snippet you need.