Documentation Index
Fetch the complete documentation index at: https://docs.flowx.ai/llms.txt
Use this file to discover all available pages before exploring further.
Available starting with FlowX.AI 5.8.0The Markdown component renders formatted Markdown content — headings, lists, links, tables, code blocks, and inline styles — anywhere in a UI screen.
This is the standalone Markdown UI component. For Markdown rendering inside chat messages, see the Chat component.
Overview
Use a Markdown component when you need to display rich text that may include structure (headings, lists, tables) or content authored in Markdown by an AI model, a CMS entry, or a process data field. Common use cases:- Surfacing an AI-generated explanation alongside a form
- Embedding Terms & Conditions or Help text written in Markdown
- Rendering a step-by-step instruction list pulled from CMS
- Showing a tabular summary returned by a workflow
Properties
| Property | Type | Description |
|---|---|---|
| Content | String / expression | Markdown source. Bind to a process data key or set a static literal. |
| Visibility | Expression | JavaScript expression that hides the component when truthy. |
| Theme overrides | Object | Override fonts, colours, link colour, heading styles, and table styling for this instance. |
Supported Markdown
Standard CommonMark syntax: headings (# to ######), bold/italic, links, ordered and unordered lists, fenced code blocks, inline code, blockquotes, and tables (GFM-style). Raw HTML is not rendered.
Theme configuration
The Markdown component exposes two theme entries: Markdown (for the body) and Markdown table (for tables embedded inside Markdown content).Markdown — body defaults
| Token | Default | Description |
|---|---|---|
font | typography@Paragraph/P1#regular | Base body typography. |
color | color@shades#900 | Body text colour. |
linkColor | color@primary#500 | Inline link colour. |
heading1Font | typography@Heading/H5#medium | H1 typography. |
heading2Font | typography@Heading/H6#medium | H2 typography. |
heading3Font | typography@Paragraph/P3#medium | H3 typography. |
heading4Font | typography@Paragraph/P2#medium | H4 typography. |
heading5Font | typography@Paragraph/P2#medium | H5 typography. |
heading6Font | typography@Paragraph/P2#medium | H6 typography. |
Markdown table — defaults
| Token | Default | Description |
|---|---|---|
borderColor | color@neutrals#200 | Outer table border colour. |
dividerColor | color@neutrals#200 | Row and column divider colour. |
backgroundColor | color@shades#0 | Cell background. |
font | typography@Paragraph/P1#regular | Cell typography. |
color | color@shades#900 | Cell text colour. |
headerFont | typography@Paragraph/P1#medium | Header row typography. |
headerColor | color@shades#900 | Header row text colour. |
headerBackgroundColor | color@neutrals#100 | Header row background. |
Related resources
UI Designer overview
Compose screens in the UI Designer.
Typography
Configure typography styles for text components.