Enable HTML Rendering

8 min read

Overview

This feature is currently in BETA. It may change significantly before general availability. Documentation may lag behind feature updates. Use in production environments at your own discretion. Please refer to our Upgrade and Release Process for more information.

HTML Rendering allows you to transform structured data, AI-generated content, and dynamic templates into fully rendered HTML output directly within the platform. Rather than working with raw markup or exporting content to external tools, you can preview, iterate on, and deliver polished HTML assets without ever leaving your workflow.

The rendering engine supports standard HTML, inline CSS, and JS functions, giving you the flexibility to produce anything from simple formatted text blocks to complex, interactive layouts. Output is rendered in a secure, sandboxed environment to ensure stability and safety across all use cases.

Who is it for

info

If you’re unable to access certain features or sections of this article, it’s possible that your firm doesn’t have access or hasn’t upgraded to the latest version. Please reach out to your internal support team for further assistance.

HTML Rendering is designed for a wide range of users across your organization. Whether you are a technical developer building integrations or a non-technical team member assembling client-facing deliverables, the feature adapts to your skill level and objectives.

Who should have access

HTML Rendering is best suited for teams that regularly produce formatted content such as reports, client-facing deliverables, email templates, or data visualizations. Administrators should consider enabling it for any user who needs to create polished, presentation-ready outputs without relying on external design or development tools. Access is particularly valuable for marketing, analytics, and operations teams, though developers building integrations or prototyping UI components will also benefit.

Benefits

HTML Rendering brings several key advantages to your workflow by keeping content creation, preview, and delivery within a single environment.

Benefit

Description

Rapid Previewing

See your rendered HTML output in real time as you build or modify it. The live preview updates instantly with every change, eliminating the need to switch between the platform and an external browser or rendering tool.

AI-Powered Insights

Leverage AI models to analyze your content, suggest structural improvements, and identify formatting issues automatically. The AI can recommend layout optimizations, flag accessibility concerns, and provide guidance on best practices to improve the quality of your output.

No-Code Interaction

Create and customize sophisticated HTML content entirely through natural language prompts and visual controls, with no coding knowledge required. Non-technical users can produce professional-quality layouts, tables, and formatted content simply by describing what they need.

Reduced Tool Sprawl

Consolidate content creation, preview, and delivery into one platform instead of juggling separate code editors, browsers, and email testing tools. Everything you need to produce and share HTML content lives in a single workspace.

Use Cases

HTML Rendering supports a broad range of practical applications. Below are some of the most common scenarios where teams find the feature valuable.

Formatted Reports and Summaries

Generate structured HTML reports from raw data or AI analysis outputs. Teams commonly use this to produce executive summaries, weekly performance recaps, or research briefings that can be shared via email or embedded in internal portals.

Client-Facing Deliverables

Assemble polished HTML pages or sections for proposals, pitch materials, or onboarding guides. The rendering engine ensures your output looks professional and aligns with your brand guidelines. HTML outputs can be saved as .png files for client-ready documents

Data Visualization Embeds

Render HTML containers for charts, tables, and interactive data displays. Combine AI-retrieved dataset with structured HTML to produce dashboard-style views that can be exported or embedded elsewhere.

Prototyping and UI Preview

Developers can use the rendering feature to quickly prototype UI components, validate template logic, or preview the output of HTML-generating APIs before deploying to production.


Step-by-Step Guide

  1. Enable the following feature flags: FEATURE_FLAG_ENABLE_HTML_RENDERING_UN_15131=true and FEATURE_FLAG_ENABLE_ADVANCED_FORMATTING_UN_9758=true. This latter flag is enabled by default in most environments.

  2. Turn on the Code Execution tool. When Code Execution is prompted or elects to return an HTML file, it will be automatically rendered within the chat

    When Code Execution generates an HTML file, the platform automatically uploads the file to the chat knowledge base and inserts a rendering block using a content reference URI:

```HtmlRendering
100%
500px

unique://content/{content_id}
```

The unique://content/ URI points to the stored file and is resolved by the frontend at render time. You do not need to construct these URIs manually — they are generated automatically when the FEATURE_FLAG_ENABLE_HTML_RENDERING_UN_15131 flag is enabled. This is the default behavior when using Code Execution and is the recommended approach over embedding raw HTML in prompts.

If you are building a custom integration or debugging rendering issues, the content_id corresponds to the file's ID in the chat knowledge base.

info

If Code Execution is not available, you may add the following prompt to the Space Instructions to enable HTML Rendering.

HTML Rendering Prompt
html
if you are asked to render an html page do it like so:

```HtmlRendering
<width>
<height>

<HTML CODE>

```


Here an example:
```HtmlRendering
500px
500px

<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.plot.ly/plotly-3.3.0.min.js" charset="utf-8"></script>
</head>
<body>

  <div id="chart"></div>
  <script>
    // Data: a simple bar chart
    const trace = {
      x: [1, 2, 3],
      y: [1, 2, 3],
      type: 'bar',
      name: 'Values',
      marker: { color: '#1f77b4' }
    };

    // Layout: titles and axes
    const layout = {
      title: 'Simple Plotly Bar Chart',
      xaxis: { title: 'Category', zeroline: false, showgrid: true },
      yaxis: { title: 'Value', zeroline: true, showgrid: true },
      margin: { l: 60, r: 20, t: 60, b: 50 }
    };

    // Render the chart
    Plotly.newPlot('chart', [trace], layout, {responsive: true});
  </script>
</body>
</html>


```

always make the width 100% and the height 700px

always use a white background so it blends with the rest of the environment

use color scheme like these

Colors
Primary Cta
#95d7d1
Primary Variant
#53AEAB
Secondary
#3D3D3D
Secondary Variant
#262626
Background
#F7F7F5
Background Variant
#ECECE8
Surface
#FFFFFF
Control
#DAD9CE
Info
#32B2D2
Success Light
#A0C855
Success Dark
#3D9E3F
Error Light
#EE4550
Error Dark
#B81D27
Attention
#FDD812
Attention Variant
#225168
On Primary
#1F1F1F
On Secondary
#FFFFFF
On Background Main
#1F1F1F
On Background Dimmed
#525252
On Surface
#1F1F1F
On Control Main
#1F1F1F
On Control Dimmed
#989898
On Info
#1F1F1F
On Success Light
#1F1F1F
On Success Dark
#FFFFFF
On Error Light
#FFFFFF
On Error Dark
#FFFFFF
On Attention
#1F1F1F
On Attention Variant
#FFFFFF

Tips & Tricks

  • Use specific prompts. When generating HTML with AI, be as descriptive as possible. Instead of "make a table," try "create a 4-column table with alternating row shading, headers in bold, and right-aligned numeric values."

  • Preview at multiple widths. Use the download HTML button to check how your content looks on desktop, tablet, and mobile screen sizes.

  • Test with real data. When building templates for reports or data displays, use representative sample data during the preview stage. This helps you catch formatting issues with edge cases like long text strings or large numbers.

FAQs from Users

Can I use HTML Rendering if I don't know how to code? Yes. The feature is designed for no-code interaction, so you can generate and customize HTML content entirely through natural language prompts. Simply describe what you need and the AI will produce the markup for you.

What happens to my content after I close the space? Your rendered HTML and revision history are saved within the space as long as the space remains active. You can return to any previous session to review, edit, or re-export your work.

Can I use my organization's branding and style guidelines? Yes. Administrators can upload custom templates or style sheets, they will be available within the rendering environment. You can also apply inline CSS to match your brand's fonts, colors, and layout standards.

Can multiple people collaborate on the same HTML output? Not within the Unique chat. However, you can download and share the HTML file with collaborators for review and feedback.


Security

HTML Rendering is designed with multiple layers of protection to ensure that AI-generated content cannot compromise your environment or expose sensitive data.

Domain Isolation

Rendered HTML runs on a separate subdomain from your chat application (e.g., reflector.example.app vs. chat.example.app). This is enforced by the browser's same-origin policy, which prevents rendered content from accessing session cookies or other data belonging to your main application. If your deployment places both on the same domain, rendered HTML could read user cookies — so verifying this separation during setup is critical.

info

For domain configuration details and ingress routing setup, refer to the Code Reflector Infrastructure documentation

How Content Is Protected

Control

What It Means for You

Authenticated storage

Only authenticated users can submit HTML for rendering. Every store request requires a valid session token.

Single-use access links

Each piece of rendered content receives a unique, unguessable link that works exactly once. After the content is loaded, the link is permanently invalidated — it cannot be shared, bookmarked, or replayed.

Automatic expiration

If content is not retrieved within 1.5 seconds (configurable), it is automatically discarded. This limits the window for any unauthorized access attempt.

Bounded resource usage

The system enforces a cap on concurrent stored items (default: 150) to prevent resource exhaustion.

No data at rest

All content is held in memory only. Nothing is written to disk, and a service restart clears everything. There is no persistent store of rendered HTML to protect or audit.

What This Means in Practice

Users cannot extract session credentials or impersonate other users through rendered HTML. Content links are ephemeral and self-destructing, so there is no risk of stale or leaked URLs providing access to previously rendered material. Because nothing is persisted, there is no long-term data retention concern associated with this feature.

Administrator Checklist

Before enabling HTML Rendering for your users, confirm the following with your infrastructure team:

  • Reflector is deployed on a different subdomain than the chat frontend

  • The retrieval endpoint is accessible without authentication (it relies on the nonce, not a JWT)

  • Both endpoints are reachable from the public internet (the user's browser must reach them directly)

  • The DNS record for the reflector subdomain resolves correctly to your ingress gateway

For the full deployment walkthrough, route configuration, and troubleshooting steps, see Code Reflector Infrastructure


Limitations

While HTML Rendering is a powerful and flexible feature, there are some boundaries to be aware of when planning your use cases.

Limitation

Details

External Resource Loading

References to external resources such as third-party fonts, images hosted on external servers, or linked style sheets may be blocked or restricted depending on your organization’s security policies. Use embedded or inline assets when possible.

File Size Limits

Rendered HTML output is subject to maximum file size constraints 7 MB by default (configurable upon request). Large HTML payloads are uploaded via a chunked protocol to comply with WAF request-body limits.

No Server-Side Processing

The rendering engine handles static HTML output only. Server-side languages, template engines that require a backend runtime, or database-driven content generation are not supported within the renderer itself.

Last updated