Customizing the background colors of your email design is simple with the Email Love Figma Plugin. You can easily adjust the outer background, content background, and even set specific colors for dark mode. Follow the steps below to learn how to control background colors within your templates.
Step-by-Step Guide to Updating Background Colors
- Open the Appearance Tab: To begin, navigate to the Appearance tab within the Email Love plugin.
- Update the Outer Background Color:
β’ Click on Background Color to access the color picker or enter a specific hex code.
β’ Choose your desired color, and it will be applied to the outermost background of your email template.
- Update the Content Background Color:
β’ You can also adjust the Content Color using the same process.
β’ This setting changes the background color of all components within the content frame, allowing you to ensure consistent styling across your email.
- Adjust Colors for Dark Mode (iOS):
β’ You can customize both the Background Color and Content Color for dark mode, ensuring your email looks great even when viewed on iOS devices with dark mode enabled.
β’ Simply select the colors you want for dark mode, and the plugin will apply them accordingly.
- Component-Specific Background Colors:
β’ If you want to adjust the background of specific elements, such as hero frames, wrappers, or sections, select the component and use the options in Figmaβs right-hand panel to set a new background color.
β’ For example, you might choose to make a hero frame a bold color like red to draw attention, or change a wrapper background to a neutral color like white to create contrast.