Skip to main content

Rich text block

Welcome to the new home of Slack developer docs!

We're still building and not all features are available quite yet. Enjoy this peek into the future!

Not ready for the future? Return to the past at api.slack.com.

Fields

FieldTypeDescriptionRequired?
typeStringThe type of block. For a rich text block, type is always rich_text.Required
elementsObject[]An array of rich text objects - rich_text_section, rich_text_list, rich_text_preformatted, and rich_text_quote. See your specific desired element below for more details.Required
block_idStringA unique identifier for a block. If not specified, one will be generated. Maximum length for this field is 255 characters. block_id should be unique for each message or view and each iteration of a message or view. If a message or view is updated, use a new block_id.Optional

Usage info

It is also the output of the Slack client's WYSIWYG message composer, so all messages sent by end-users will have this format. Use this block to include user-defined formatted text in your Block Kit payload. While it is possible to format text with mrkdwn, rich_text is strongly preferred and allows greater flexibility.

You might encounter a rich_text block in a message payload, as a built-in type in workflow apps, or as output of the rich_text_input block element.

Rich text blocks can be deeply nested. For instance: a rich_text_list can contain a rich_text_section which can contain bold style text. More details on how that works is shown in the examples.

Sub-elements are what comprise the elements array in a rich text block. There are four available rich text object sub-elements.: rich_text_section, rich_text_list, rich_text_preformatted, and rich_text_quote. Because many of the elements include a section block, the details of that element are listed first, followed by the others.

Section element: rich_text_section

FieldTypeDescriptionRequired?
typeStringThe type of sub-element; in this case, rich_text_section.Required
elementsObject []An array of rich text elements.Required
rich_text_section example

An example of a rich_text_section block

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Hello there, I am a basic rich text block!"
}
]
}
]
},
{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Hello there, "
},
{
"type": "text",
"text": "I am a bold rich text block!",
"style": {
"bold": true
}
}
]
}
]
},
{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Hello there, "
},
{
"type": "text",
"text": "I am an italic rich text block!",
"style": {
"italic": true
}
}
]
}
]
},
{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Hello there, "
},
{
"type": "text",
"text": "I am a strikethrough rich text block!",
"style": {
"strike": true
}
}
]
}
]
}

List element: rich_text_list

FieldTypeDescriptionRequired?
typeStringThe type of sub-element; in this case, rich_text_list.Required
styleStringEither bullet or ordered, the latter meaning a numbered list.Required
elementsObject []An array of rich_text_section objects containing two properties: type, which is "rich_text_section", and elements, which is an array of rich text element objects.Required
indentNumberNumber of pixels to indent the list.Optional
offsetNumberNumber of pixels to offset the list.Optional
borderNumberNumber of pixels of border thickness.Optional
rich_text_list example

An example of a rich_text_list block

{
"type": "rich_text",
"block_id": "block1",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "My favorite Slack features (in no particular order):"
}
]
},
{
"type": "rich_text_list",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Huddles"
}
]
},
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Canvas"
}
]
},
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Developing with Block Kit"
}
]
}
],
"style": "bullet",
"indent": 0,
"border": 1
},
],
}

Let's say we want to create a nested list, for example something that looks like this:

Breakfast foods I enjoy:

  • Hashbrowns
  • Eggs
    • Scrambled
    • Over easy
  • Pancakes, extra syrup

To create that in rich text, create three instances of rich_text_list, the middle one using the indent property to indent the types of eggs into that sub-list.

{
"type": "rich_text",
"block_id": "block1",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Breakfast foods I enjoy:"
}
]
},
{
"type": "rich_text_list",
"style": "bullet",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Hashbrowns"
}
]
},
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Eggs"
}
]
}
]
},
{
"type": "rich_text_list",
"style": "bullet",
"indent": 1,
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Scrambled"
}
]
},
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Over easy"
}
]
}
]
},
{
"type": "rich_text_list",
"style": "bullet",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Pancakes, extra syrup"
}
]
}
]
}
]
}

Preformatted code block element: rich_text_preformatted

FieldTypeDescriptionRequired?
typeStringThe type of the sub-element; in this case, rich_text_preformatted.Required
elementsObject []An array of rich text elements.Required
borderNumberNumber of pixels of border thickness.Optional
rich_text_preformatted example

An example of a rich_text_preformatted block

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_preformatted",
"elements": [
{
"type": "text",
"text": "{\n \"object\": {\n \"description\": \"this is an example of a json object\"\n }\n}"
},
],
"border": 0
}
]
}

Quote element: rich_text_quote

FieldTypeDescriptionRequired?
typeStringThe type of the sub-element; in this case, rich_text_quote.Required
elementsObject []An array of rich text elements.Required
borderNumberNumber of pixels of border thickness.Optional
rich_text_quote example

An example of a rich_text_quote block

{
"type": "rich_text",
"block_id": "Vrzsu",
"elements": [
{
"type": "rich_text_quote",
"elements": [
{
"type": "text",
"text": "What we need is good examples in our documentation."
}
]
},
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Yes - I completely agree, Luke!"
}
]
}
]
}

Rich text element types

For the rich text elements that have a field of elements, the following types are possible.

broadcast

The following are the properties of the broadcast object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case, "broadcast".Required
rangeStringThe range of the broadcast; value can be here, channel, or everyone. Using here notifies only the active members of a channel; channel notifies all members of a channel; everyone notifies every person in the #general channel.Required
broadcast example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "broadcast",
"range": "everyone"
}
]
}
]
}

color

The following are the properties of the color object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case, "color".Required
valueStringThe hex value for the color.Required
color example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "color",
"value": "#F405B3"
}
]
}
]
}

channel

The following are the properties of the channel object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case, "channel".Required
channel_idStringThe ID of the channel to be mentioned.Required
styleObjectAn object of six optional boolean properties that dictate style: bold, italic, strike, highlight, client_highlight, and unlink.Optional
channel example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "channel",
"channel_id": "C123ABC456"
}
]
}
]
}

date

The following are the properties of the date object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case "date".Required
timestampNumberA Unix timestamp for the date to be displayed in seconds.Required
formatStringA template string containing curly-brace-enclosed tokens to substitute your provided timestamp. See details below.Required
urlStringURL to link the entire format string to.Optional
fallbackStringText to display in place of the date should parsing, formatting or displaying fail.Optional

Date format strings

The following are the template strings allowed by the format property of the date element type.

  • {day_divider_pretty}: Shows today, yesterday or tomorrow if applicable. Otherwise, if the date is in current year, uses the {date_long} format without the year. Otherwise, falls back to using the {date_long} format.
  • {date_num}: Shows date as YYYY-MM-DD.
  • {date_slash}: Shows date as DD/MM/YYYY (subject to locale preferences).
  • {date_long}: Shows date as a long-form sentence including day-of-week, e.g. Monday, December 23rd, 2013.
  • {date_long_full}: Shows date as a long-form sentence without day-of-week, e.g. August 9, 2020.
  • {date_long_pretty}: Shows yesterday, today or tomorrow, otherwise uses the {date_long} format.
  • {date}: Same as {date_long_full} but without the year.
  • {date_pretty}: Shows today, yesterday or tomorrow if applicable, otherwise uses the {date} format.
  • {date_short}: Shows date using short month names without day-of-week, e.g. Aug 9, 2020.
  • {date_short_pretty}: Shows today, yesterday or tomorrow if applicable, otherwise uses the {date_short} format.
  • {time}: Depending on user preferences, shows just the time-of-day portion of the timestamp using either 12 or 24 hour clock formats, e.g. 2:34 PM or 14:34.
  • {time_secs}: Depending on user preferences, shows just the time-of-day portion of the timestamp using either 12 or 24 hour clock formats, including seconds, e.g. 2:34:56 PM or 14:34:56.
  • {ago}: A human-readable period of time, e.g. 3 minutes ago, 4 hours ago, 2 days ago.
date example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "date",
"timestamp": 1720710212,
"format": "{date_num} at {time}",
"fallback": "timey"
}
]
}
]
}

emoji

The following are the properties of the emoji object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case, "emoji".Required
nameStringThe name of the emoji; i.e. "wave" or "wave::skin-tone-2".Required
unicodeStringRepresents the unicode code point of the emoji, where applicable.Optional
emoji example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "emoji",
"name": "basketball"
},
{
"type": "text",
"text": " "
},
{
"type": "emoji",
"name": "snowboarder"
},
{
"type": "text",
"text": " "
},
{
"type": "emoji",
"name": "checkered_flag"
}
]
}
]
}

The following are the properties of the link object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case "link".Required
urlStringThe link's url.Required
textStringThe text shown to the user (instead of the url). If no text is provided, the url is used.Optional
unsafeBooleanIndicates whether the link is safe.Optional
styleObjectAn object containing four boolean properties: bold, italic, strike, and code.Optional
link example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "link",
"url": "https://api.slack.com"
}
]
}
]
}

text

The following are the properties of the text object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case, "text".Required
textStringThe text shown to the user.Required
styleObjectAn object containing four boolean fields, none of which are required: bold, italic, strike, and code.Optional
text example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "text",
"text": "Hello there, "
},
{
"type": "text",
"text": "I am a bold rich text block!",
"style": {
"bold": true
}
}
]
}
]
}

user

The following are the properties of the user object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case, "user".Required
user_idStringThe ID of the user to be mentioned.Required
styleObjectAn object of six optional boolean properties that dictate style: bold, italic, strike, highlight, client_highlight, and unlink.Optional
user example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "user",
"user_id": "U123ABC456"
}
]
}
]
}

usergroup

The following ar the properties of the usergroup object type in the elements array.

FieldTypeDescriptionRequired?
typeStringThe type of object; in this case "usergroup".Required
usergroup_idStringThe ID of the user group to be mentioned.Required
styleObjectAn object of six optional boolean properties that dictate style: bold, italic, strike, highlight, client_highlight, and unlink.Optional
usergroup example

{
"type": "rich_text",
"elements": [
{
"type": "rich_text_section",
"elements": [
{
"type": "usergroup",
"usergroup_id": "G123ABC456"
}
]
}
]
}