# Background image

**URL:** <https://community.hubspot.com/t/background-image/70551>\
**Category:** CMS Development\
**Tags:** marketing-email\
**Created:** [December 5, 2022, 1:30pm UTC](https://community.hubspot.com/t/background-image/70551 "2022-12-05T13:30:34Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![LDjelloul](https://avatars.discourse-cdn.com/v4/letter/l/e47774/32.png) [@LDjelloul](https://community.hubspot.com/u/LDjelloul)\
**Post date:** [December 5, 2022, 1:30pm UTC](https://community.hubspot.com/t/background-image/70551/1 "2022-12-05T13:30:34Z")

</div>

Hi all!

I want to use an image as a background with the tool background image (in the email conceptor).

I suppose that because of the responsive mode, the image doesn’t keep its proportions if the body is longer or if the page is reduced.

I want to keep the image proportion

Please try to reduce the size of your view page between the two miroir links bollow to see the behaviors

[Example with Hubspot ➡](https://25747658.hs-sites-eu1.com/-temporary-slug-e0cb168b-8f23-430b-b6da-1529084c7add?hs_preview=IoqHYSMC-57310460382&ecid=&utm_campaign=Nouvelles%20Expositions%20Juillet%202022&utm_medium=email&_hsmi=2&_hsenc=p2ANqtz-_rTqIIIlflzDoG-T7w7Qa-QKC-NpOJjs306rGItBM4CPklINSCSOMv7D23pcYffLcXES8A6iWEkF3LnW8t2TC4cEmgpQ&utm_content=2&utm_source=hs_email&)

[Example of the result I want ➡](https://mailchi.mp/e14742066a6e/lautomne-revient-au-parc-des-ateliers-8812173?e=744faeeebc)

We’ve tried some things with my developer :

"First, I tried to code a small CSS module in the “files and template” tab and then I simply added it to the email template.

The code in the module was just CSS:

**\<style\>**

**body or class{**

**background-size:cover ;**

**}**

**\</style\>**

This did not work properly.

After that I tried the same thing but with the image in the code with background-url. This didn’t work properly too.

I saw that Hubspot is telling me not to use CSS in the custom module. So, I tried uploading a CSS file to the “Files” tab and then tried adding it to the email files. That didn’t work either

 ![LDjelloul_0-1670246958600.jpg](https://d2qpr2jzcazej7.cloudfront.net/original/2X/f/fb6ad1c115007e117f8c6cda6e52811d2569f243.jpeg)

Hope we’ll find a solution.

Waiting for your answer

Best

Lucas Djelloul

---

<div class="post-metadata">

**Author:** ![Jaycee\_Lewis](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jaycee_lewis/32/61352_2.png) [@Jaycee\_Lewis](https://community.hubspot.com/u/Jaycee_Lewis)\
**Post date:** [December 6, 2022, 4:12pm UTC](https://community.hubspot.com/t/background-image/70551/2 "2022-12-06T16:12:55Z")

</div>

Hey, @LDjelloul 👋 Thank you for the question. Let’s see if we can get the converstaion started. Hey, @Jnix284 @Sjardo @Anton, do you have any hard-earned email template customization advice?

Thank you for taking a look! — Jaycee

---

<div class="post-metadata">

**Author:** ![LDjelloul](https://avatars.discourse-cdn.com/v4/letter/l/e47774/32.png) [@LDjelloul](https://community.hubspot.com/u/LDjelloul)\
**Post date:** [December 13, 2022, 1:14pm UTC](https://community.hubspot.com/t/background-image/70551/3 "2022-12-13T13:14:48Z")

</div>

Hey [@Jaycee\_Lewis](https://community.hubspot.com/t5/user/viewprofilepage/user-id/127074)

Do you think I will have a return soon?

Thank you for your help

Best

Lucas

---

<div class="post-metadata">

**Author:** ![jnix284](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jnix284/32/29_2.png) [@jnix284](https://community.hubspot.com/u/jnix284)\
**Post date:** [December 16, 2022, 12:52am UTC](https://community.hubspot.com/t/background-image/70551/4 "2022-12-16T00:52:43Z")

</div>

Hi @LDjelloul you are correct, it is not possible to add the CSS to the custom module or reference a CSS file for email.

This is a great [guide for what CSS can be used for Email](https://www.campaignmonitor.com/css/).

The link to your HubSpot example doesn’t work without a login, but based on your screenshot and the mailchimp example, it looks like you’re going to need to size the image relative to your content.

The background image in the mailchinp example is set to cover, it is just sized to be taller than the email content:

 ![Jnix284_0-1671151940578.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/9/c/9c0d69e5de8bf7b8afcbfbb3d28cc8c6f93c08ac.png)

Hope this helps clear things up a bit!