claude artifacts not showing up

Claude's Artifacts feature is a brilliant tool for rendering code, HTML, SVG graphics, and website mockups in a dedicated side panel. However, users frequently find that Claude generates the raw code block in the main chat window rather than sliding out the interactive preview. This issue is usually caused by browser caching bugs, account feature toggles, or script blocks.

If the entire page fails to display or load after trying these steps, check our guide on what to do when the Claude app won't load entirely.

Enable Artifacts in your feature previews

Before troubleshooting your browser, ensure the Artifacts feature is actually switched on in your account settings. Click on your profile initials in the bottom-left corner of the Claude.ai dashboard. Select "Feature Previews" from the pop-up menu and verify that the toggle next to "Artifacts" is enabled. If it is already enabled, toggle it off, wait ten seconds, and switch it back on to reinitialise the feature.

Force Claude to regenerate the block

If Claude displays raw code instead of an interactive container, the model may have bypassed the rendering instruction due to prompt length. Type a direct command in the chat bar such as "Please present the above code as an Artifact" or "Render this HTML in a visual preview window". This forces the system to utilise the dedicated XML tags required to open the side panel.

Clear local storage and site data

Corrupted browser data can prevent the Artifacts container from loading dynamically. Click the padlock icon in your browser's address bar while on Claude.ai. Select "Site settings" or "Cookies and site data", and choose "Clear data". Once cleared, refresh the web page and sign back in to establish a clean session.

Disable ad blockers and privacy extensions

Artifacts rely on running isolated scripts within an iframe to display visual elements safely. Aggressive ad-blocking extensions or script-blocking utilities (like uBlock Origin or NoScript) often flag these iframe containers as potential tracking risks. Whitelist claude.ai in your extension settings or temporarily disable your security add-ons to see if the panel appears.

Switch browser or check service status

Some older browser engines struggle with the real-time sandboxing required for interactive previews. If you are using an outdated version of Safari or Firefox, try opening the chat in Google Chrome or Microsoft Edge. Sometimes, rendering bugs coincide with API slowdowns. Read about how to handle a Claude not responding situation if the site remains sluggish.