Backgrounds are used to shade or highlight a content area.
Want proof? View the test results to see how a background element renders across each of the most common email clients.
Backgrounds help call attention to important content in your email. They are also used as the foundational element when creating an alert component. Backgrounds can be placed either inside or outside of the .panel-body.
Copy the code below and paste it either inside or outside of the .panel-body to create a background in your email.
Primary Color Background
Use the code below to create a primary color background.The background color can be changed using bg-* modifier classes.
Follow these best practices when using backgrounds.
- Use backgrounds to call attention to important information.
- When using a background color, ensure the foreground and background colors pass the minimum level of WCAG accessibility.
Frequently Asked Questions
Answers to common questions about backgrounds in Email Kit.
Inside of the background, add .spacer-* rows around your content to create vertical spacing.