Feature Request: Native rendering and default preview for .excalidraw files

[ParasKoundal]

🏷️ Discussion Type

Product Feedback

💬 Feature/Topic Area

Code Search and Navigation

Body

Summary

I am requesting native preview support for .excalidraw files within the GitHub web UI, similar to how GitHub currently renders .md, .csv, .geojson, and .pdf files.

The Problem

Visual documentation is becoming increasingly standard in software development, and Excalidraw has emerged as a premier tool for architecture diagrams, UI wireframes, and user flows. Currently, when navigating to an .excalidraw file in a GitHub repository, the UI displays the raw, unreadable JSON data.

To view the diagram, developers are forced to:

1. Rely on third-party browser extensions (which aren't available on mobile and require company security approvals).
2. Export and commit a duplicate .png or .svg file alongside the source file, which clutters the repository and frequently leads to the source and image becoming out of sync.
3. Copy the raw JSON and paste it into the external Excalidraw web app.

As evidence of the high demand for visual context in codebases, NotesGutter, a VS Code extension built by me that lets developers attach out-of-band Excalidraw diagrams and Markdown notes directly to specific lines of code has considerable downloads in a very short period. However, while this solves the visualization problem locally in the IDE, the experience breaks down when reviewers try to view those linked .excalidraw files natively on GitHub.

Proposed Solution

Integrate a read-only rendering of .excalidraw files directly into the repository file viewer. When a user clicks on an .excalidraw file, it should visually render the diagram by default, with a toggle available to view the "Raw" JSON code (exactly how Markdown files operate).

Impact & Benefits

• Frictionless Onboarding: New contributors instantly see architectural visuals without needing to install external tools.
• Single Source of Truth: Eliminates the need to maintain duplicate .png/.svg exports just for viewing purposes.
• Better PR Reviews: Reviewers can visually see diagram changes in pull requests rather than trying to decipher JSON diffs.

Given that Excalidraw is open-source and already powers many developer tools, bringing this native integration to GitHub would be a massive quality-of-life improvement for the millions of developers who rely on it for visual documentation.

[github-actions[bot]]

💬 Your Product Feedback Has Been Submitted 🎉

Thank you for taking the time to share your insights with us! Your feedback is invaluable as we build a better GitHub experience for all our users.

Here's what you can expect moving forward ⏩

• Your input will be carefully reviewed and cataloged by members of our product teams. 
  • Due to the high volume of submissions, we may not always be able to provide individual responses.
  • Rest assured, your feedback will help chart our course for product improvements.
• Other users may engage with your post, sharing their own perspectives or experiences. 
• GitHub staff may reach out for further clarification or insight. 
  • We may 'Answer' your discussion if there is a current solution, workaround, or roadmap/changelog post related to the feedback.

Where to look to see what's shipping 👀

• Read the Changelog for real-time updates on the latest GitHub features, enhancements, and calls for feedback.
• Explore our Product Roadmap, which details upcoming major releases and initiatives.

What you can do in the meantime 💻

• Upvote and comment on other user feedback Discussions that resonate with you.
• Add more information at any point! Useful details include: use cases, relevant labels, desired outcomes, and any accompanying screenshots.

As a member of the GitHub community, your participation is essential. While we can't promise that every suggestion will be implemented, we want to emphasize that your feedback is instrumental in guiding our decisions and priorities.

Thank you once again for your contribution to making GitHub even better! We're grateful for your ongoing support and collaboration in shaping the future of our platform. ⭐

[declancollins]

+1, native rendering would be great, especially for PR diffs.

In the meantime, one workaround avoids the out-of-sync problem: save diagrams as .excalidraw.svg (or .excalidraw.png) with "Embed scene" turned on when exporting. GitHub renders the file as a normal image,and you can still reopen and edit it in Excalidraw, so one file serves as both the source and the preview. The Excalidraw VS Code extension can edit .excalidraw.svg files directly.

It doesn't give a visual diff in PRs, though, so a native viewer would still be a big improvement.