UX Spec: Channel Banners
Resources
Overview
Allows channel admins (and system admins) to enable a coloured banner at the top of a channel with custom text. The banner can display important notices, classification labels, or any other short informational text, styled with basic markdown.
Not in scope
Creating a global banner that spans multiple channels. (Each banner is channel-specific.)
Handling advanced formatting beyond Markdown basics (e.g., no embedding of media or complex widgets within banner text).
Use cases
Security Classification: The admin sets the channel banner to “CONTROLLED UNCLASSIFIED: IMPACT LEVEL 5” with a distinctive purple colour to alert members of the required security level.
Important Notices: A team lead places “Reminder: Code complete deadline this Friday at 3 PM” so it’s easily visible to all channel members.
Policy or Terms: A compliance officer sets “All discussion in this channel is private and restricted” with a red color to denote caution.
Enabling / Disabling a Channel Banner
Channel Level
A toggle for channel banner should be added under Channel Settings > Settings.
Default State: Disabled
Enabling the channel banner reveals a text input for the banner text, and a colour selector/input.
When the banner is toggled off, the banner disappears from the channel view, but any existing text/color settings should be retained in case the admin re-enables it.
Banner Text Field
A single-line text input that accepts both plain text and Markdown.
Character Limit: A maximum of ~128 characters (excluding Markdown syntax) to prevent overly large banners.
If the text exceeds the limit, display an error message: “Banner text cannot exceed 128 characters.”
Markdown Support:
Basic formatting (bold, italic, underline, strikethrough) is supported.
Links (e.g.,
[some text](url)
) should be clickable in the displayed banner.Headings and any multi-line markdown options like bullet/numbered lists, quotes, code blocks will not be supported in the banner.
Emojis
Empty State: If the admin toggles the banner on but leaves the text blank, there should be an error message displayed just below the input box: “Please enter text to enable channel banner.”
Banner Color Picker
A HEX colour code input field similar to the colour input in Settings > Display > Theme > Custom Theme > Styles. It should accept hex codes as inputs and also have a colour picker that can be opened by clicking on the colour swatch.
Default value: #DDDDDD
Team Level
Similar to Channel Settings, A toggle for channel banner should be added under Team Settings > Configuration.
Default State: Disabled
Enabling the channel banner at the team level, will set it as the default banner for all existing channels in a team as well as any new channels created in that team.
There’ll be an additional checkbox to enable/disable the ability to edit the banner at the channel level for an individual channel. Only if this is enabled will users be able to modify or remove the banner for any channel in that team.
Default state: Allowed to edit banners at the channel level
Edge case: If editing banners at the channel level is enabled > Some channel admins go and update the banner for their channels to something custom or remove it > Team admin disables the ability to edit banners at the channel level > All channels should get updated with the banner set up at the team level and the Channel Admins will lose all custom configuration.
Displaying the banner
Desktop
The banner appears as a horizontal bar pinned at the top of the channel, just below the channel header and bookmarks bar.
If the text plus any Markdown styling exceeds the available width, the text will be truncated in the default view. Hovering on the banner should show a tooltip containing the entire banner text, exactly like how it works for the Global Announcement Banners. Any links within the banner text should be clickable from the tooltip.
Channel members cannot hide or dismiss the banner. Only the channel admin or system admin can disable it by toggling off the feature in Channel Settings.
Note: Banner colour should not change based on the user’s selected theme. The banner background and text colour should remain the same irrespective of the user’s theme.
Mobile
When users access the channel on the mobile app:
The banner should display at the top of the channel with a single row of text.
The color and text should be consistent with the desktop experience.
When the banner text exceeds the available width, the text should be truncated in the default view. Tapping on the banner in this case should trigger a bottom sheet containing the entire banner text, similar to how it works for the Global Announcement Banner.
The banner should remain pinned at the top in the collapsed state as the user scrolls through the channel content, just like the bookmarks bar.
Accessibility Considerations
Banner text colour
The banner text colour (white or black) should change automatically to ensure adequate contrast against the chosen background colour. We should compare if black has a better contrast with the background colour or white and accordingly set the text colour.
Roles & Permissions
Anyone who can edit the channel configuration (name, header, purpose) should also be able to edit the channel banner. We can rely on existing permission schemes to allow this.
By default, channel admins and system admins should be able to configure channel banners.
License
This is an Enterprise-only feature
Analytics & Telemetry
Capture events when a banner is enabled, updated, or disabled.
Open questions
Do we need a leading icon in the banner? Not in MVP.
Should that icon be customizable? Not in MVP.
How should that icon be selected? Not in MVP.
Should we show formatting controls in the banner text input box? Yes
If not, users may not know that basic markdown is supported. Should we add help text instead?
If we do want to show formatting controls, should we create a lighter version of the message input box for such use cases? Yes
Should we support emojis in the banner? Will they be supported by default with the text box? Yes, they should be
Do we need the channel banner configuration on mobile? No
Future Considerations (Not in Current Scope)
Dismissible Channel Banners: Give users the ability to dismiss channel banners for themselves after viewing them. They will stay dismissed until any updates are made to the banner. Ability to dismiss can be configured from the channel and team settings.
Scheduled Banners: Ability to enable/disable a banner on a set schedule or get cleared after a certain time similar to custom statuses.
Customizable text colour: Allow users to modify the text colour instead of auto-selecting black or white based on contrast.
Support more advanced Markdown
Dismissable banner config