Custom colors and HTML

You can configure your own message style if predefined styles are not enough.

To do this, you can use detailed settings of the message color and add HTML with structure and style description in the message body.

What is HTML?

If you are new to HTML (like us), then here is a great introductory guide recommended by our more experienced users. Learn HTML Free in [2021] – Basic HTML Codes for Beginners

Thank you for your recommendation! 😉

How to set colors in the message?

Choose Message type ‘Custom’.
Additional fields Background color, Text color, Icon, Icon color will appear.
Choose predefined colors from Atlassian.
If you can’t find the right color, press Select a custom color for manual color selection.

Message color can be set by code in dynamic templates.

How do I change the color of the text and background in a message?

You can display any HTML as a message. To do this, select the Message type ‘Custom’ in the field settings.

<text style="background: black; color: white"> The white message on the black background</text>

Or hex colors

<text style="background: #000000; color: #FFFFFF"> The white message on the black background</text>

Colors: htmlcolorcodes.com

Attlassian Design System: atlassian.design/foundations/color

How to add a scroll to a long message?

Blue info banner with scrollable content showing repeated 'Long Message' text with scroll bar

<div style="height: 200px; overflow-y: scroll;">
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
    Long Message<br/>
</div>

Message field