Viewable File Formats in ChatGPT
Most people have no idea what can be displayed in ChatGPT and what can't. Since this isn't mention anywhere, I'll put it in here: -> Chat = inline message pane, Canvas = side panel: 📃Plain text & Markdown Chat: renders normally Canvas: renders normally (type: document) 🎨Images (PNG/JPG/GIF) Chat: displayed inline Canvas: inline in document or via img tag in code/html or code/react. 📐SVG (as file/image) Chat: shown as image Canvas: image or inline via in code/html or code/react. 📐Raw SVG markup Chat: shown as code only; Canvas: rendered when embedded in code/html or code/react. 📰HTML — Chat: shown as code only Canvas: rendered with live preview in code/html. 💻CSS + JavaScript Chat: not executed Canvas: executed in code/html preview. React components Chat: code only Canvas: interactive preview in code/react (default export required). Libraries (Tailwind, shadcn/ui, lucide-react, recharts, Framer Motion) Chat: n/a; Canvas: supported in code/react. 🧜Mermaid diagrams Chat: may not render Canvas: reliable via code/html or code/react by loading Mermaid. ➕Math / LaTeX — Chat basic inline math sometimes Canvas: use KaTeX/MathJax in code/html or code/react. 🎥🔉Audio/Video Chat: usually links only (Youtube LInks can also be embedded as live play, though) Canvas: HTML5 / in code/html or code/react. 🌐WebGL / Canvas 2D Chat: no interactive support Canvas: supported via code/html or code/react (e.g., three.js). 📕PDFs Chat: link only Canvas: no native viewer—link or render pages as images/HTML. 📃Long docs / code files Chat: awkward to scroll Canvas: ideal for long, printable docs and iterative code editing. Bonus tips: So, if you want to display more "complicated" or things that are normally unsupported, tell it to create html code and embed it there, etc. P.S.: If you want to export any doc easily as PDF, Markdown or DOCX, just tell ChatGPT to open a canvas and put it there. Or, alternatively, tell it to open a canvas and write "Hello" or whatever. Then you can copy the text yourself and paste there. 😀