Componentes
This document serves as a comprehensive reference for all available components. It covers three main categories:
Layout Components - For organizing and structuring content (Action Rows, Sections, Containers)
Content Components - For displaying static text, images, and files (Text Display, Media Gallery, Thumbnails)
Interactive Components - For user interactions (Buttons, Select Menus, Text Input)
To use these components, you need to send the message flag, which can be sent on a per-message basis. Once a message has been sent with this flag, it can't be removed from the message. This enables the new components system with the following changes:
The and fields will no longer work but you'll be able to use Text Display and Container as replacements
Attachments won't show by default—they must be exposed through components
The and fields are disabled
Messages allow up to 40 total components
Components allow you to style and structure your messages, modals, and interactions. They are interactive elements that can create rich user experiences in your Discord applications.
Components are a field on the message object and in modals. You can use them when creating messages or responding to an interaction, like an application command.
Before the introduction of the flag, message components were sent in conjunction with message content. This means that you could send a message using a subset of the available components without setting the flag, and the components would be included in the message content along with and .
Additionally, components of messages preceding components V2 will contain an of .
1 Requires the message flag.
2 Not usable by bots.
All components have the following fields:
id?
integer
32 bit integer used as an optional identifier for component
The field is optional and is used to identify components in the response from an interaction that aren't interactive components. The must be unique within the message and is generated sequentially if left empty. Generation of s won't use another that exists in the message if you have one defined for another component. Sending components with an of is allowed but will be treated as empty and replaced by the API.
Additionally, interactive components like buttons and selects must have a field. The developer defines this field when sending the component payload, and it is returned in the interaction payload sent when a user interacts with the component. For example, if you set on a button, you'll receive an interaction containing when a user clicks that button.
is only available on interactive components and must be unique per component. Multiple components on the same message must not share the same . This field is a string of a maximum of 100 characters and can be used flexibly to maintain state or pass through other important data.
custom_id
string
Developer-defined identifier (max 100 characters)
An Action Row is a top-level layout component used in messages and modals.
Action Rows can contain:
Up to 5 contextually grouped buttons
A single text input
A single select component (string select, user select, role select, mentionable select, or channel select)
{ "type": 1, "components": [ { "type": 2, "label": "Accept", "style": 1, "custom_id": "click_yes" }, { "type": 2, "label": "Learn More", "style": 5, "url": "http://watchanimeattheoffice.com/" }, { "type": 2, "label": "Decline", "style": 4, "custom_id": "click_no" } ]}
A Button is an interactive component that can only be used in messages. It creates clickable elements that users can interact with, sending an interaction to your app when clicked.
Buttons must be placed inside an Action Row or a Section's field.
type
integer
Always
id?
integer
An optional identifier for the component
label?
string
Text that appears on the button (max 80 characters)
custom_id
string
Developer-defined identifier for the button (max 100 characters)
sku_id?
snowflake
Identifier for a purchasable SKU, only available when using premium-style buttons
url?
string
URL for link-style buttons (max 512 characters)
disabled?
boolean
Whether the button is disabled (default false)
Buttons come in various styles to convey different types of actions. These styles also define what fields are valid for a button.
Non-link and non-premium buttons must have a , and cannot have a or a .
Link buttons must have a , and cannot have a
Link buttons do not send an interaction to your app when clicked
Premium buttons must contain a , and cannot have a , , , or .
Premium buttons do not send an interaction to your app when clicked
1
PRIMARY
The most important or recommended action in a group of options
custom_id
2
SECONDARY
Alternative or supporting actions
custom_id
3
SUCCESS
Positive confirmation or completion actions
custom_id
4
DANGER
An action with irreversible consequences
custom_id
5
LINK
Navigates to a URL
url
6
PREMIUM
Purchase
sku_id
{ "type": 1, "components": [ { "type": 2, "label": "Click me!", "style": 1, "custom_id": "clicked_me" } ]}
34 characters max with icon or emoji.
38 characters max without icon or emoji.
Premium buttons will automatically have the following:
Shop icon
SKU name
SKU price
A String Select is an interactive component that allows users to select one or more provided in a message.
String Selects can be configured for both single-select and multi-select behavior. When a user finishes making their choice(s) your app receives an interaction.
String Selects must be placed inside an Action Row and are only available in messages. An Action Row can contain only one select menu and cannot contain buttons if it has a select menu.
type
integer
Always
id?
integer
An optional identifier for the component
custom_id
string
Developer-defined identifier for the select menu (max 100 characters)
placeholder?
string
Placeholder text if nothing is selected (max 150 characters)
min_values?
integer
Minimum number of items that must be chosen (max 25, default 1)
max_values?
integer
Maximum number of items that can be chosen (max 25, default 1)
disabled?
boolean
Whether the select menu is disabled (default false)
label
string
User-facing name of the option (max 100 characters)
value
string
Developer-defined value of the option (max 100 characters)
description?
string
Additional description of the option (max 100 characters)
default?
boolean
Whether to show this option as selected by default (default false)
{ "type": 3, "custom_id": "string_select", "placeholder": "Favorite bug?", "options": [ { "label": "Ant", "value": "ant", "description": "(best option)", "emoji": { "name": "🐜" } }, { "label": "Butterfly", "value": "butterfly", "emoji": { "name": "🦋" } }, { "label": "Catarpillar", "value": "caterpillar", "emoji": { "name": "🐛" } } ]}
The object is included in interaction payloads for user, role, mentionable, and channel select menu components. contains a nested object with additional details about the selected options.
{ "channels": { "986678954901234567": { "id": "986678954901234567", "name": "general", "permissions": "4398046511103", "type": 0 } }}
Text Input is an interactive component that allows users to enter free-form text responses in modals. It supports both short, single-line inputs and longer, multi-line paragraph inputs.
Text Inputs can only be used within modals and must be placed inside an Action Row.
When defining a text input component, you can set attributes to customize the behavior and appearance of it. However, not all attributes will be returned in the interaction payload.
type
integer
Always
id?
integer
An optional identifier for the component
custom_id
string
Developer-defined identifier for the input (max 100 characters)
label
string
Label for this component (max 45 characters)
min_length?
integer
Minimum input length for a text input (max 4000)
max_length?
integer
Maximum input length for a text input (1-4000)
required?
boolean
Whether this component is required to be filled (default true)
value?
string
Prefilled value for the component (max 4000 characters)
placeholder?
string
Custom placeholder text if the input is empty (max 100 characters)
1
SMALL
Single-line input
2
PARAGRAPH
Multi-line input
{ "type": 1, "components": [ { "type": 4, "custom_id": "name", "label": "Name", "style": 1, "min_length": 1, "max_length": 4000, "placeholder": "John", "required": true } ]}
A User Select is an interactive component that allows users to select one or more users in a message. Options are automatically populated based on the guild's available users.
User Selects can be configured for both single-select and multi-select behavior. When a user finishes making their choice(s) your app receives an interaction.
User Selects must be placed inside an Action Row and are only available in messages. An Action Row can contain only one select menu and cannot contain buttons if it has a select menu.
type
integer
Always
id?
integer
An optional identifier for the component
custom_id
string
Developer-defined identifier for the select menu (max 100 characters)
placeholder?
string
Placeholder text if nothing is selected (max 150 characters)
default_values?
array[default value object]
Default values for auto-populated select menu components (max 25)
min_values?
integer
Minimum number of items that must be chosen (max 25, default 1)
max_values?
integer
Maximum number of items that can be chosen (max 25, default 1)
disabled?
boolean
Whether the select menu is disabled (default false)
Select Default Value Structure
id
snowflake
ID of a user, role, or channel
type
string
Type of value associated with the ID
{ "type": 1, "components": [ { "type": 5, "custom_id": "user_select", "placeholder": "Select a user" } ]}
A Role Select is an interactive component that allows users to select one or more roles in a message. Options are automatically populated based on the guild's available roles.
Role Selects can be configured for both single-select and multi-select behavior. When a user finishes making their choice(s) your app receives an interaction.
Role Selects must be placed inside an Action Row and are only available in messages. An Action Row can contain only one select menu and cannot contain buttons if it has a select menu.
type
integer
Always
id?
integer
An optional identifier for the component
custom_id
string
Developer-defined identifier for the select menu (max 100 characters)
placeholder?
string
Placeholder text if nothing is selected (max 150 characters)
default_values?
array[default value object]
Default values for auto-populated select menu components (max 25)
min_values?
integer
Minimum number of items that must be chosen (max 25, default 1)
max_values?
integer
Maximum number of items that can be chosen (max 25, default 1)
disabled?
boolean
Whether the select menu is disabled (default false)
{ "type": 1, "components": [ { "type": 6, "custom_id": "role_select", "placeholder": "Which roles?", "min_values": 1, "max_values": 3 } ]}
A Mentionable Select is an interactive component that allows users to select one or more mentionables in a message. Options are automatically populated based on available mentionables in the guild.
Mentionable Selects can be configured for both single-select and multi-select behavior. When a user finishes making their choice(s), your app receives an interaction.
Mentionable Selects must be placed inside an Action Row and are only available in messages. An Action Row can contain only one select menu and cannot contain buttons if it has a select menu.
type
integer
Always
id?
integer
An optional identifier for the component
custom_id
string
Developer-defined identifier for the select menu (max 100 characters)
placeholder?
string
Placeholder text if nothing is selected (max 150 characters)
default_values?
array[default value object]
Default values for auto-populated select menu components (max 25)
min_values?
integer
Minimum number of items that must be chosen (max 25, default 1)
max_values?
integer
Maximum number of items that can be chosen (max 25, default 1)
disabled?
boolean
Whether the select menu is disabled (default false)
{ "type": 1, "components": [ { "type": 7, "custom_id": "mentionable_select", "placeholder": "Who?" } ]}
A Channel Select is an interactive component that allows users to select one or more channels in a message. Options are automatically populated based on available channels in the guild and can be filtered by channel types.
Channel Selects can be configured for both single-select and multi-select behavior. When a user finishes making their choice(s) your app receives an interaction.
Channel Selects must be placed inside an Action Row and are only available in messages. An Action Row can contain only one select menu and cannot contain buttons if it has a select menu.
type
integer
Always
id?
integer
An optional identifier for the component
custom_id
string
Developer-defined identifier for the select menu (max 100 characters)
placeholder?
string
Placeholder text if nothing is selected (max 150 characters)
default_values?
array[default value object]
Default values for auto-populated select menu components (max 25)
min_values?
integer
Minimum number of items that must be chosen (max 25, default 1)
max_values?
integer
Maximum number of items that can be chosen (max 25, default 1)
disabled?
boolean
Whether the select menu is disabled (default false)
{ "type": 1, "components": [ { "type": 8, "custom_id": "channel_select", "channel_types": [0], "placeholder": "Which text channel?" } ]}
A Section is a top-level layout component that allows you to join text contextually with an accessory.
Sections are only available in messages.
type
integer
Always
id?
integer
An optional identifier for the component
1 May be expanded to include other component types in the future.
{ "type": 9, "components": [ { "type": 10, "content": "# Real Game v7.3" }, { "type": 10, "content": "Hope you're excited, the update is finally here! Here are some of the changes:\n- Fixed a bug where certain treasure chests wouldn't open properly\n- Improved server stability during peak hours\n- Added a new type of gravity that will randomly apply when the moon is visible in-game\n- Every third thursday the furniture will scream your darkest secrets to nearby npcs" }, { "type": 10, "content": "-# That last one wasn't real, but don't use voice chat near furniture just in case..." } ], "accessory": { "type": 11, "media": { "url": "https://websitewithopensourceimages/gamepreview.png" } }}
A Text Display is a top-level content component that allows you to add text to your message formatted with markdown and mention users and roles. This is similar to the field of a message, but allows you to add multiple text components, controlling the layout of your message.
Text Displays are only available in messages.
type
integer
Always
id?
integer
An optional identifier for the component
content
string
Text that will be displayed similar to a message (1-4000 characters)
A Thumbnail is a content component that is a small image only usable as an accessory in a section. The preview comes from an url or attachment through the unfurled media item structure.
Thumbnails are only available in messages as an accessory in a section.
type
integer
Always
id?
integer
An optional identifier for the component
description?
string
Alt text for the media (max 1024 characters)
spoiler?
boolean
Whether the thumbnail should be spoilered (default false)
A Media Gallery is a top-level content component that allows you to display 1-10 media attachments in an organized gallery format. Each item can have optional descriptions and can be marked as spoilers.
Media Galleries are only available in messages.
type
integer
Always
id?
integer
Optional identifier for component
description?
string
Alt text for the media (max 1024 characters)
spoiler?
boolean
Whether the media should be a spoilered (default false)
{ "type": 12, "items": [ { "media": { "url": "https://livevideofeedconvertedtoimage/webcam1.png" }, "description": "An aerial view looking down on older industrial complex buildings. The main building is white with many windows and pipes running up the walls." }, { "media": { "url": "https://livevideofeedconvertedtoimage/webcam2.png" }, "description": "An aerial view of old broken buildings. Nature has begun to take root in the rooftops. A portion of the middle building's roof has collapsed inward. In the distant haze you can make out a far away city." }, { "media": { "url": "https://livevideofeedconvertedtoimage/webcam3.png" }, "description": "A street view of a downtown city. Prominently in photo are skyscrapers and a domed building" } ]}
A File is a top-level component that allows you to display an uploaded file as an attachment to the message and reference it in the component. Each file component can only display 1 attached file, but you can upload multiple files and add them to different file components within your payload.
Files are only available in messages.
type
integer
Always
id?
integer
An optional identifier for the component
spoiler?
boolean
Whether the media should be a spoiler (default false)
name 1
string
The name of the file
size 1
integer
The size of the file in bytes
1 This field is received only and cannot be set.
{ "type": 13, "file": { "url": "attachment://game.zip" }}
A Separator is a top-level layout component that adds vertical padding and visual division between other components.
Separators are only available in messages.
type
integer
Always
id?
integer
An optional identifier for the component
divider?
boolean
Whether a visual divider should be displayed in the component (default true)
1
SMALL
8px gap between elements, 16px with divider hidden
2
LARGE
16px gap between elements, 32px with divider hidden
{ "type": 14, "divider": true, "spacing": 1}
A Content Inventory Entry is a top-level component that displays an activity feed entry.
Content Inventory Entries cannot be sent directly.
Content Inventory Entry Structure
type
integer
Always
id?
integer
An optional identifier for the component
Content Inventory Entry Object
id
string
The ID of the entry as a snowflake when sent in guild or a string of numbers when DMed
author_id
snowflake
The ID of the user this entry is for
content_type
integer
[The type of content]](#content-inventory-content-type)
participants?
array[snowflake]
The IDs of all users involved with this entry
expires_at?
ISO8601 timestamp
When this entry expires
ended_at?
ISO8601 timestamp
When this entry ended
started_at?
ISO8601 timestamp
When this entry started
original_id?
snowflake
ID of the entry
guild_id?
snowflake
Guild ID this entry happened in
channel_id?
snowflake
Channel ID this entry happened in
session_id?
snowflake
Session ID of this entry
0
AUTHOR_TYPE_UNSPECIFIED
No author type specified
1
USER
A Discord user
Content Inventory Content Type
0
CONTENT_TYPE_UNSPECIFIED
No content type specified
1
PLAYED_GAME
A game that was played
2
WATCHED_MEDIA
Media that was watched (e.g. Crunchyroll)
3
TOP_GAME
Top played game in the guild
4
LISTENED_MEDIA
Media that was listened to (e.g. Spotify)
5
LISTENED_SESSION
Media listening session (e.g. Spotify Listen Along)
6
TOP_ARTIST
Top listened artist in the guild
7
CUSTOM_STATUS
Custom status activity
8
LAUNCHED_ACTIVITY
Embedded activity
9
LEADERBOARD
Leaderboard entry (e.g. League of Legends)
Content Inventory Trait Object
first_time?
boolean
Shows the "New player" text (only FIRST_TIME
)
duration_seconds?
integer
Total time elapsed during the entry (only DURATION_SECONDS
)
is_live?
boolean
Whether the entry is still ongoing (only IS_LIVE
)
resurrected_last_played?
ISO8601 timestamp
When the game for the entry was last played (only RESURRECTED
)
marathon?
boolean
Shows the "#h marathon" text (only MARATHON
)
streak_count_days?
integer
Number of days for the streak text (only STREAK_DAYS
)
count?
integer
Total count (only TOP_ITEM_TOTAL_COUNT
, TOP_PARENT_ITEM_TOTAL_COUNT
, AGGREGATE_COUNT
)
0
TRAIT_TYPE_UNSPECIFIED
No trait type specified
1
FIRST_TIME
First time the content was played
2
DURATION_SECONDS
Total duration in seconds
3
IS_LIVE
Whether the content is currently live
4
AGGREGATE_RANGE
Time range for the aggregated data
5
RESURRECTED
Whether the user is returning to content previously interacted with (e.g. game)
6
MARATHON
Whether the content is part of a marathon
7
NEW_RELEASE
Whether the content is a new release
8
STREAK_DAYS
Number of days in the streak
9
TRENDING_CONTENT
Whether the content is trending
10
TOP_ITEM_TOTAL_COUNT
Total count of the top item in the guild
11
TOP_PARENT_ITEM_TOTAL_COUNT
Total count of the top parent item in the guild
12
AGGREGATE_COUNT
Aggregate count of the content in the guild
Content Inventory Aggregate Range Type
0
AGGREGATE_RANGE_UNSPECIFIED
No aggregate range specified
1
WEEK
Last 7 days of data
Content Inventory Trending Type
0
TRENDING_TYPE_UNSPECIFIED
No trending type specified
1
GLOBAL
Global trending content
Content Inventory Metadata Object
game_name?
string
The name of the game (played_game_extra
only)
application_id?
snowflake
The ID of the associated application
last_update?
ISO8601 timestamp
When the entry was last updated
parent_title?
string
The title of the media's parent (album title when media_type
is TRACK
) (only listened_media_extra
)
title?
string
The title of the media (only listened_media_extra
)
image_url?
string
Image for the media (e.g. album art) (only listened_media_extra
)
artists?
array[artist object]
Artists for the media (empty when top_artist_extra
) (only listened_media_extra
)
external_id?
string
The external platform ID for the media (e.g. Spotify track ID) (only listened_media_extra
)
external_parent_id?
string
The external platform ID for the media's parent (e.g. Spotify album ID) (only listened_media_extra
)
media_assets_large_image?
string
The large image for the media (e.g. movie poster) (only watched_media_extra
)
media_assets_large_text?
string
Text displayed when hovering over the large image (e.g. season and episode of a show) (only watched_media_extra
)
media_assets_small_image?
string
Small image for the media (e.g. platform logo) (only watched_media_extra
)
media_assets_small_text?
string
Text displayed when hovering over the small image (e.g. platform name) (only watched_media_extra
)
media_title?
string
The title of the media (only watched_media_extra
)
media_subtitle?
string
The subtitle of the media (only watched_media_extra
)
url?
string
The URL of the media (only watched_media_extra
)
activity_name?
string
The name of the activity (only launched_activity_extra
)
Content Inventory Metadata Type
played_game_extra
Game
listened_session_extra
Listened session (e.g. Spotify)
listened_media_extra
Listened media (e.g. Spotify track)
top_artist_extra
Top artist (e.g. Spotify)
watched_media_extra
Watched media (e.g. Crunchyroll)
launched_activity_extra
Embedded activity
Content Inventory Provider Type
0
PROVIDER_UNSPECIFIED
No provider specified
1
SPOTIFY
Spotify
0
TOP_ARTIST
Top artist in the guild
1
TRACK
Track in a media provider (e.g. Spotify)
Content Inventory Metadata Entry Object
verification_state?
integer
repeat_count?
integer
How many times this track has been played on repeat
Content Inventory Artist Object
external_id
string
The external platform ID for this artist (e.g. Spotify artist ID)
name
string
The ame of the artist
Content Inventory Platform Type
0
DESKTOP
Desktop
1
XBOX
Xbox integration
2
PLAYSTATION
PlayStation integration
3
IOS
iOS
4
ANDROID
Android
5
NINTENDO
Nintendo integration
6
LINUX
Linux
7
MACOS
macOS
Content Inventory Signature Object
signature
string
SHA256 hash of the entry
kid
string
Key ID for the signature
version
integer
Signature version (currently 1)
{ "type": 16, "id": "0", "content_inventory_entry": { "author_id": "150745989836308480", "author_type": 1, "content_type": 1, "ended_at": "2025-04-23T02:13:18.123000+00:00", "extra": { "application_id": "356879032584896512", "game_name": "Garry's Mod", "platform": 0, "type": "played_game_extra" }, "id": "1364423860543557746", "participants": ["150745989836308480"], "signature": { "kid": "AtDT4Kx25Wmu5cfllPxAiwZKgPbmLsaeHitpx/duvPY=", "signature": "580e54d406bc466a936cbd9a1b8f19954997187d56638c84871cc5f3cd9c245b", "version": 1 }, "started_at": "2025-04-23T02:11:24.123000+00:00", "traits": [ { "duration_seconds": 114, "type": 2 }, { "streak_count_days": 3, "type": 8 } ] }}
A Container is a top-level layout component that holds up to 10 components. Containers are visually distinct from surrounding components and have an optional customizable color bar.
Containers are only available in messages.
type
integer
Always
id?
integer
An optional identifier for the component
components
array[component object]
Components of the type action row, text display, section, media gallery, separator, or file (1-10)
accent_color?
?integer
Color for the accent on the container encoded as an integer representation of a hexadecimal color code
spoiler?
boolean
Whether the container should be spoilered (default false)
{ "type": 17, "accent_color": 703487, "components": [ { "type": 10, "content": "# You have encountered a wild coyote!" }, { "type": 12, "items": [ { "media": { "url": "https://websitewithopensourceimages/coyote.png" } } ] }, { "type": 10, "content": "What would you like to do?" }, { "type": 1, "components": [ { "type": 2, "custom_id": "pet_coyote", "label": "Pet it!", "style": 1 }, { "type": 2, "custom_id": "feed_coyote", "label": "Attempt to feed it", "style": 2 }, { "type": 2, "custom_id": "run_away", "label": "Run away!", "style": 4 } ] } ]}
Unfurled Media Item Object Structure
url
string
The URL of the media, supports arbitrary URLs and attachment://<filename>
references (max 2048 characters)
proxy_url? 1
string
The proxied URL of the media item
height? 1
?integer
The height of the media item
width? 1
?integer
The width of the media item
placeholder_version? 1
integer
The attachment placeholder protocol version (currently 1)
attachment_id? 1
snowflake
The ID of the uploaded attachment, if any
1 This field is received only and cannot be set.
Unfurled Media Item Loading State
0
UNKNOWN
Loading state is unknown
1
LOADING
Media item is currently loading
2
LOADED_SUCCESS
Media item has loaded successfully
3
LOADED_NOT_FOUND
Media item has loaded but was not found