# Hero image in custom header

**URL:** https://meta.discourse.org/t/hero-image-in-custom-header/336371
**Category:** Support
**Created:** [November 15, 2024, 5:02pm UTC](https://meta.discourse.org/t/hero-image-in-custom-header/336371 "2024-11-15T17:02:46Z")
**Posts on this page:** 1
**Page:** 1

<div class="post-metadata">

### Author: ![king\_laurel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/king_laurel/32/461779_2.png) [@king\_laurel](https://meta.discourse.org/u/king_laurel)
#### Post date: [November 15, 2024, 5:02pm UTC](https://meta.discourse.org/t/hero-image-in-custom-header/336371/1 "2024-11-15T17:02:46Z")

</div>

I am trying to add a hero image to a custom header component. I want the hero image to change based off dark/light mode.

I saw in the `color_definitions.scss` there is a `dark-light-choose()` so I tried adding the images (`*.png`) to my workspace AND tried uploading it in the admin. I noticed that when I upload the images to admin they disappear after a short while in my local instance.

Are there any docs on how to upload hero images? Thanks!