BBCode-Inspired Text Formatting Markup

• Jun 10, 2026
• 7 minutes to read

Multiple DevExpress controls support the Bulletin Board Code (BBCode) markup. You can use this markup to define hints, hyperlinks, and text formatting such as font family, size, style, and color.

In this topic…

• Markup Syntax
• Supported Markup Tags
  • Basic Formatting: B | I | U | S
  • Font Attributes: FONT | SIZE
  • Color Formatting: COLOR | BACKCOLOR
  • Subscript and Superscript: SUB | SUP
    • Combination with FONT and SIZE Tags
    • Nested SUB and SUP Tags
  • Hyperlinks: URL
    • Hyperlink Hints
    • Hyperlink Behavior Customization
  • Hints: HINT
    • Hint Behavior Customization
  • Parse Control: NOPARSE
  • Markup Parse Errors
• Supported DevExpress Controls
• Design-Time Formatted Text Editor
  • Display the Formatted Text Editor
  • Text Edit Operations

Markup Syntax

Enclose text fragments within opening and closing markup tags as follows: [TAG]text[/TAG].

The following example applies the bold formatting attribute to a text range:

BBCode

[B]Dev[/B]Express

You can apply multiple formatting attributes to the same text range:

BBCode

[URL=https://www.devexpress.com][B]Dev[/B][COLOR=orange]Express[/COLOR][/URL]

Tip

Tag names are case-insensitive. You can use uppercase and lowercase letters in any combination.

Supported Markup Tags

Basic Formatting: B | I | U | S

Basic formatting tags allow you to apply bold, italic, underlined, and strikethrough attributes to a text range:

BBCode

[B]Dev[/B][U][I]Express[/I][/U]

Font Attributes: FONT | SIZE

Font attribute tags allow you to change typeface ([FONT][/FONT]) and size ([SIZE][/SIZE]) of the font used to display the target text range:

BBCode

[SIZE=12]Dev[/SIZE][FONT=Times New Roman]Express[/FONT]

To change font and background colors, use [COLOR][/COLOR] and [BACKCOLOR][/BACKCOLOR] tags.

Color Formatting: COLOR | BACKCOLOR

[COLOR][/COLOR] and [BACKCOLOR][/BACKCOLOR] tags allow you to change background and font colors of the target text range.

You can specify color as:

• A color name, such as Orange. Supported color names match corresponding color constants declared in the TdxAlphaColors record.
• A hexadecimal color value, such as #E67E22.

BBCode

[COLOR=#E67E22]Dev[/COLOR][BACKCOLOR=orange]Express[/BACKCOLOR]

Subscript and Superscript: SUB | SUP

Subscript ([SUB][/SUB]) and superscript ([SUP][/SUP]) markup tags display the target text range in a smaller font below or above the text baseline, respectively:

BBCode

Subscript: H[SUB]2[/SUB]O; Superscript: 5[SUP]2[/SUP] = 25

Combination with FONT and SIZE Tags

You can define font typeface ([FONT][/FONT]) and size ([SIZE][/SIZE]) outside and inside [SUB][/SUB] and [SUP][/SUP] markup tags:

BBCode

[SIZE=14]
[FONT=Arial Black]Typeface and size defined outside [SUP]superscript text[/SUP][/FONT]

Typeface and size defined inside [SUP][FONT=Arial Black][SIZE=18]superscript text[/SIZE][/FONT][/SUP]
[/SIZE]

Nested SUB and SUP Tags

[SUB][/SUB] and [SUP][/SUP] markup tags do not support nesting. The resulting formatted text string can have only one subscript and one superscript level.

BBCode

[SIZE=14]
Nested subscript: [SUB]level one, [SUB]level two, [/SUB][SUP]nested SUP[/SUP][/SUB]

Nested superscript: [SUP]level one, [SUP]level two, [/SUP][SUB]nested SUB[/SUB][/SUP]
[/SIZE]

Hyperlinks: URL

[URL][/URL] tags adds a hyperlink to text. Hyperlink behavior depends on the URL scheme:

• Links that start with https:// or http:// are opened in the default browser.
• Links that start with mailto:// are opened in the default mail client and create an empty e-mail for the specified address.
• Links that start with the file:// scheme are opened in the File Explorer (for example, file:///C:\ProgramFiles\).

BBCode

[URL=https://www.devexpress.com]DevExpress[/URL]

[URL=mailto://[e-mail]][e-mail][/URL]

[URL=file:///C:\Program Files\]C:\Program Files\[/URL]

Hyperlink Hints

A hyperlink displays the target link URI as a hint (demonstrated in the image above). You can also combine [URL][/URL] and [HINT][/HINT] tags to replace automatically generated hint content.

BBCode

[URL=https://devexpress.com][HINT=DevExpress Website]DevExpress[/HINT][/URL]

Hyperlink Behavior Customization

All supported controls implement a series of dedicated hyperlink navigation, activation, and hint-related events. You can handle these events to change the predefined hyperlink and hint activation behavior.

Refer to the following procedural type descriptions for detailed information on individual scenarios and corresponding code examples:

TdxHyperlinkClickEvent

The procedural type for hyperlink click events in DevExpress controls and their UI elements.

TdxHyperlinkMouseHoverEvent

The procedural type for hyperlink mouse hover events in DevExpress controls and their UI elements.

TdxShowHyperlinkHintEvent

The procedural type for hyperlink hint display events in DevExpress controls and their UI elements.

TdxMessageDialogHyperlinkClickDelegate

The procedural type for a hyperlink activation handler in a message dialog.

TdxMessageDialogShowHyperlinkHintDelegate

The procedural type for a hyperlink hint display handler in a message dialog.

Hints: HINT

The code example in this section uses [HINT][/HINT] tags to associate a hint with a text range. When the mouse pointer is positioned within the marked text range, the defined hint is displayed.

BBCode

[HINT=DevExpress Website]www.devexpress.com[/HINT]

[HINT][/HINT] tags can be nested in other tags and contain other tags. When combined with [URL][/URL] tags, hint text is displayed instead of the target URI.

BBCode

[HINT=DevExpress Website][B]www.devexpress.com[/B][/HINT]

[URL=https://www.devexpress.com][HINT=DevExpress Website]www.devexpress.com[/HINT][/URL]

Hint Behavior Customization

All supported controls implement a series of dedicated hint-related events. You can handle these events to change predefined hint activation behavior.

For example, you can handle an OnShowTextHint event to modify a hint depending on specific conditions in your application, such as to display the current date/time in a hint:

Delphi

procedure TMyForm.dxFormattedLabel1PropertiesFormattedTextShowTextHint(
  Sender: TObject; AArgs: TdxShowTextHintEventArgs);
begin
  AArgs.Hint := FormatDateTime('mm/dd/yyyy hh:nn:ss am/pm', Now);
end;

C++

void __fastcall TMyForm::dxFormattedLabel1PropertiesFormattedTextShowTextHint(
  TObject* Sender, TdxShowTextHintEventArgs* AArgs)
{
  AArgs->Hint = FormatDateTime("mm/dd/yyyy hh:nn:ss am/pm", Now());
}

Refer to the following procedural type descriptions for detailed information on individual scenarios and corresponding code examples:

TdxHintedTextClickEvent

TdxHintedTextMouseHoverEvent

TdxShowTextHintEvent

TdxMessageDialogHintedTextClickDelegate

TdxMessageDialogShowTextHintDelegate

Parse Control: NOPARSE

[NOPARSE][/NOPARSE] tags allow you to ignore nested markup and display content as is:

BBCode

[NOPARSE][B]Dev[/B]Express[/NOPARSE]

Markup Parse Errors

Parse routines interpret markup tag content as plain text if any of the following conditions are met:

• An expression within square brackets does not correspond to any supported markup tag.
• A start tag has no corresponding end tag and vice versa.
• A whitespace character appears between the tag name and = for tags with parameters (like [COLOR][/COLOR]).

Supported DevExpress Controls

All DevExpress controls listed in this section support BBCode-inspired markup tags in labels, captions, and descriptions.

Data Grid

The TcxGrid control supports formatting in grid item/column captions in all Table and Layout Views.

TcxButton

An advanced button component with support for multiple usage scenarios.

TdxFormattedLabel | TdxDBFormattedLabel

Static label controls with support for BBCode-inspired markup tags.

Layout Control

Layout item captions allow you to use all supported BBCode-inspired markup tags.

Message Box Dialogs

DevExpress message box dialogs with support for skins, palettes, and text formatting using BBCode-inspired markup tags.

Tree List

TcxTreeList, TcxDBTreeList, and TcxVirtualTreeList) support BBCode-inspired markup tags in column and band captions.

Tip

Refer to the following help topic for detailed information (including all formatted text-related settings and events):

BBCode-Inspired Markup: Supported DevExpress Controls

Design-Time Formatted Text Editor

The Formatted Text editor allows you to edit labels and captions at design time in Markup and RTF (WYSIWYG) modes.

You can define font typeface ([FONT][/FONT]) and color ([COLOR][/COLOR] and [BACKCOLOR][/BACKCOLOR]), links ([URL][/URL]), and hints ([HINT][/HINT]) using dedicated dialogs:

Display the Formatted Text Editor

To display the Formatted Text editor, click the ellipsis button next to the corresponding property in the Object Inspector. For example, if you need to edit a layout item caption, select the layout item, expand its CaptionOptions node in the Object Inspector, and click the ellipsis button to the right of the Text property.

Text Edit Operations

The Formatted Text editor displays the following commands that affect the current text selection:

Bold | Italic | Underline | Strikeout | Superscript | Subscript

Apply corresponding formatting attributes to the text selection.

Font

Displays the standard Font dialog that allows you to change font settings.

Font Color | Text Highlight Color

Display the Color Editor dialog where you can select a custom or predefined color and apply it to the font or background.

Hyperlink

Displays the Insert Hyperlink dialog that allows you to define the target hyperlink URI and optional hint text for the current text selection used as a link anchor.

Hint

Displays the Insert Hint dialog that allows you to define the hint message for the current text selection used as a hint anchor.

No Parse

Encloses the text selection between [NOPARSE] and [/NOPARSE] markup tags.