What Is a Background Image in Knak?
A background image sits behind other content such as text or buttons. You can still edit and move the content that appears on top of the image. This approach is useful for hero sections, call-to-action areas, or branded headers.
Add a Background Image to a Section
Use this method when you want to place additional content on top of an image.
Steps
Select the row where you want the background image.
Open Section Attributes in the right-side panel.
Locate the Background Image setting.
Choose one of the following:
Select an image from your Knak image library.
Paste an external image URL.
Add a Background Image to an Entire Email or Landing Page
Use this option when you want a background image to apply to the full email or landing page.
Steps
Open the email or landing page editor.
Click the Settings tab.
Upload an image or paste an image URL.
The background image now applies to the entire page.
Background Image Display Options
Knak provides several options to control how your background image appears.
Auto
Displays the image at its original size.
Scales to full width if the image exceeds the container size.
Cover
Scales the image to fully cover the container.
May crop parts of the image.
Contain
Scales the image so the full image remains visible.
May reduce image height to fit the container.
Stretch
Stretches the image across the entire container.
May distort the image.
Use only for intentional visual effects.
Repeat Background
Repeats the image to fill the container.
Works well for patterns or textures.
Full Width
Extends the image across the full width of the email.
Ignores the standard content width.
Adjust Background Image Alignment
You can control where the image sits within the container.
Alignment Options
Vertical: top, middle, bottom
Horizontal: left, center, right
You can find these settings in Section Attributes for each row.
Background Image Best Practices
Follow these guidelines to ensure the best results across devices and email clients.
Use Good Color Contrast
Ensure text and buttons remain easy to read. Avoid placing light text on light image areas.
Include a Fallback Color
Some email clients block images by default. Set a content color in the section settings so a solid color appears if the image does not load.
Keep It Simple
Avoid busy or complex images. Simple patterns or subtle images work best, especially on tablets and mobile devices.
Use Background Images Only When Needed
Use background images only when content appears on top of the image.
If content sits beside or below an image, use a standard image content block instead.
Need more help? Contact support via live chat using the chat bubble in the bottom right corner or email support@knak.com.