# Change default background grey color of map component

**URL:** <https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924>\
**Category:** Ignition Early Access\
**Created:** [December 25, 2019, 8:31am UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924 "2019-12-25T08:31:16Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [December 25, 2019, 8:31am UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924/1 "2019-12-25T08:31:16Z")

</div>

Hello,  
Is it possible to change the default background grey color of map component? When client offline instead of displaying map tile, it show grey color and I want to change the background color.

---

<div class="post-metadata">

**Author:** ![boyergary](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/boyergary/32/10316_2.png) [@boyergary](https://forum.inductiveautomation.com/u/boyergary)\
**Post date:** [December 26, 2019, 8:06pm UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924/2 "2019-12-26T20:06:41Z")

</div>

I don’t think this is possible, but there are a few things you can do instead:

1. Just make the map invisible if you are offline and there’s no content to display.
2. Put another image or frame over top of it that is only visible when they are offline. You could just have a solid color square as an image and make if visible when offline.

Gary

---

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [December 27, 2019, 8:20am UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924/3 "2019-12-27T08:20:58Z")

</div>

The reason I need this is, offshore Oil & Gas platform there is no internet and i want to create overview of the field. If I can replace grey background with blue and put my view icon on it in map, it show want I want.  
In sea there no street only plain blue color on the map.  
This trick make use of map competent offline for this special case.

---

<div class="post-metadata">

**Author:** ![Baskar\_Arumugam](https://avatars.discourse-cdn.com/v4/letter/b/94ad74/32.png) [@Baskar\_Arumugam](https://forum.inductiveautomation.com/u/Baskar_Arumugam)\
**Post date:** [January 31, 2022, 6:24am UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924/4 "2022-01-31T06:24:34Z")

</div>

Did you get the solution of this topic ?

> [@nader.chinichian](#):
>
> Is it possible to change the default background grey color of map component?

---

<div class="post-metadata">

**Author:** ![nader.chinichian](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nader.chinichian/32/9261_2.png) [@nader.chinichian](https://forum.inductiveautomation.com/u/nader.chinichian)\
**Post date:** [January 31, 2022, 6:51am UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924/5 "2022-01-31T06:51:57Z")

</div>

.leaflet-container {

```
background-color: transparent !important;

```

}

---

<div class="post-metadata">

**Author:** ![Baskar\_Arumugam](https://avatars.discourse-cdn.com/v4/letter/b/94ad74/32.png) [@Baskar\_Arumugam](https://forum.inductiveautomation.com/u/Baskar_Arumugam)\
**Post date:** [January 31, 2022, 7:27am UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924/6 "2022-01-31T07:27:39Z")

</div>

Thank you.

---

<div class="post-metadata">

**Author:** ![Michal\_Goralczyk](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/michal_goralczyk/32/55564_2.png) [@Michal\_Goralczyk](https://forum.inductiveautomation.com/u/Michal_Goralczyk)\
**Post date:** [September 19, 2025, 1:19pm UTC](https://forum.inductiveautomation.com/t/change-default-background-grey-color-of-map-component/30924/7 "2025-09-19T13:19:32Z")

</div>

Thank you!
