Skip to main content

How to Change the Background Color of a Section

Updated over a week ago

TL;DR

  • Background colors are controlled at the section and container level.

  • Each section or container can have its own independent background color.

  • This gives you full control over visual structure and branding.


When to Use It

Use this feature when:

  • You want to visually break up different parts of a message

  • You're matching message design to hotel branding

  • You need different background treatments across blocks


How It Works

In the Triptease Messages platform, both containers and sections can have background colors:

  • Containers are the outermost element and typically control the overall message background.

  • Sections sit inside containers and let you apply different colors to different areas of your message.

Each section can:

  • Have its own background color or image

  • Override the container’s background settings

  • Be stacked with other sections to build a visual layout

Important: If a section covers the full area of the container, its background will visually override the container’s background.


Step-by-Step Instructions

1. Open the Message Editor

Click the pencil icon on your selected message.


2. Select the Section or Container You Want to Edit

Click directly on the section or container, or use the layers panel if needed.


3. Open the Styles Tab

With the section or container selected, go to the right-hand sidebar and choose Styles.


4. Scroll to Background Settings

  • Choose a solid color or upload an image

  • Use the brand color picker for consistency


5. Save Your Message

Changes only apply after clicking Save.


Pro Tips

  • Use alternating background colors to separate sections visually

  • Avoid using white sections on a white page background—they may appear invisible

  • If you're not seeing a color change, double-check whether you're editing the container or a section

  • Keep color contrast strong for readability


FAQs / Troubleshooting

Question: Why can’t I see my background color change?

Answer: A block or overlapping section might be hiding it. Also check whether the container or section is being edited.

Q: Can I apply gradients or patterns?

A: Not at this time. Only solid colors or image uploads are supported.

Did this answer your question?