# Setting images as background-image in css/sass

**URL:** <https://discourse.gohugo.io/t/setting-images-as-background-image-in-css-sass/48262>\
**Category:** support\
**Tags:** images, sass, dart-sass\
**Created:** [February 13, 2024, 9:21am UTC](https://discourse.gohugo.io/t/setting-images-as-background-image-in-css-sass/48262 "2024-02-13T09:21:19Z")\
**Posts on this page:** 1\
**Showing post:** 7

<div class="post-metadata">

**Author:** ![Harry-Gardiner](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.gohugo.io/harry-gardiner/32/21189_2.png) [@Harry-Gardiner](https://discourse.gohugo.io/u/Harry-Gardiner)\
**Post date:** [February 16, 2024, 9:01am UTC](https://discourse.gohugo.io/t/setting-images-as-background-image-in-css-sass/48262/7 "2024-02-16T09:01:58Z")

</div>

Thanks @jmooring. I’ve now got it working.

I was hoping it would be able to fetch the image just by calling `"vars" site.Params.style` as per the [reference](https://discourse.gohugo.io/t/initialize-sass-variables-from-hugo-templates/42053). But I guess the key part re images is the following:

```auto
{{ $test_image := "" }}
{{ with site.Params.style.test_image }}
  {{ with resources.Get . }}
      {{ $test_image = .RelPermalink }}
  {{ end }}
{{ end }}

```

This is where the image is bound to the variable.

@jmooring what would be the preferred way to store and use images? Using the above method with /assets or simply compressing and image then placing it in /static/images and calling it from static?

---

_[View the full topic](https://discourse.gohugo.io/t/setting-images-as-background-image-in-css-sass/48262)._
