Brand-consistent artifacts with design.md

A design.md file is a plain-text brand specification written in Markdown. When you attach it to an assistant, it gives the assistant a persistent set of visual guidelines — colors, typography, spacing, component patterns — that it applies every time it generates an HTML artifact or visual output.

Without a design.md, the assistant defaults to a generic visual style. With one attached, generated artifacts like HTML pages, dashboards, reports, and interactive demos will reflect your organization’s actual brand.

What a design.md file enables

• Consistent visual identity — generated artifacts use your brand colors, fonts, and spacing without you needing to describe them in every prompt.
• Reusable brand rules — write the guidelines once; every conversation with the assistant benefits automatically.
• Reduced back-and-forth — you spend less time correcting styles and more time refining content.

How to create a design.md file

A design.md file is a Markdown document that describes your brand guidelines in natural language and structured lists. It does not need to follow any rigid schema — the assistant reads it as instructions.

Good things to include:

• Color palette — primary, secondary, accent, background, and text colors (with hex values)
• Typography — font families, sizes, and weights for headings, body, and code
• Spacing and layout — column widths, padding, border-radius values
• Component patterns — how buttons, cards, tables, and badges should look
• Tone guidance — how copy should feel (formal, friendly, concise, etc.)
• Restrictions — things the assistant should avoid (stock art, garish colors, etc.)

How to attach design.md to an assistant

1. Open the assistant you want to configure and click Edit.
2. Navigate to the Attachments section.
3. Click Add attachment and upload your design.md file.
4. Save the assistant.

The file is now active. Every conversation through that assistant will include the brand guidelines as context for generating visual output.

To learn more about the difference between attachments and knowledge, and when to use each, see:

📖

Attachments Knowledge

Read more

What types of artifacts are affected

The design.md approach works for any HTML-based or visual output the assistant generates, including:

• HTML pages and interactive demos
• Styled reports and dashboards
• Email templates
• Data visualizations rendered in HTML/CSS
• Component previews

Plain text outputs such as summaries, bullet lists, or code in non-visual languages are not visually affected by design.md.