# Perspective Menu Tree Linear Gradient **URL:** \ **Category:** Ignition\ **Created:** [June 25, 2020, 6:09am UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010 "2020-06-25T06:09:28Z")\ **Posts on this page:** 8\ **Page:** 1
**Author:** ![craigb](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@craigb](https://forum.inductiveautomation.com/u/craigb)\ **Post date:** [June 25, 2020, 6:09am UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/1 "2020-06-25T06:09:28Z")
I have a left dock with a slight Linear Gradient… ```auto linear-gradient(to right, #0C7BB3, #0C5BB3) ``` In that dock I have a Menu tree that I’m trying to get to match the gradient behind it. Linear Gradient in the style properties (Background Image) doesn’t work, it just makes the menu tree match the session theme. If i try and make the background transparent that doesn’t work either as that makes level 2 transparent also. Liner Gradient works for each individual item but that still doesn’t work if level 2 is shorter then level one. What is the best way around this ? ---
**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\ **Post date:** [June 26, 2020, 4:42pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/2 "2020-06-26T16:42:02Z")
@craigb, there are 4 spots where you’ll need to apply that gradient: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/1/9/19f012fe4889400d5fde6e48c4446201dfc732dd.png) ---
**Author:** ![craigb](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@craigb](https://forum.inductiveautomation.com/u/craigb)\ **Post date:** [June 26, 2020, 5:12pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/3 "2020-06-26T17:12:08Z")
Thank you, When I do that it leaves me with white space as picture attached. ![Capture](https://us1.discourse-cdn.com/inductiveautomation/original/3X/9/2/920f99d970a2eea04a79e5eb7a7c251b966ee255.jpeg) ---
**Author:** ![craigb](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@craigb](https://forum.inductiveautomation.com/u/craigb)\ **Post date:** [June 26, 2020, 5:14pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/4 "2020-06-26T17:14:44Z")
Fixed it, I noticed you are using ‘background:’ rather then ‘backgroundImage’ Once I changed that, it now works. 😁 Scratch that… Level 2 now doesn’t cover level 1. ![Capture](https://us1.discourse-cdn.com/inductiveautomation/original/3X/a/8/a8de713c7b958fac79a8410adfea2b70f8701751.jpeg) ---
**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\ **Post date:** [June 26, 2020, 5:50pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/5 "2020-06-26T17:50:13Z")
Shoot; it sure doesn’t! There is a solution for that, but you’ll need to get into custom themes: [https://docs.inductiveautomation.com/display/DOC80/Perspective+Themes](https://docs.inductiveautomation.com/display/DOC80/Perspective+Themes) You’ll need to create a style override so you can apply that gradient to one of the inner layers that the standard styling can’t reach: ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/3/a/3ae7c06f55148c815e9dc29a508734730785e3a6.png) ![ezgif-3-dbca34b6c4f6](https://us1.discourse-cdn.com/inductiveautomation/original/3X/0/9/09de5a2dc3877971fdab4a5c3270150761c8617a.gif) One caveat… As you get into custom themes, you’ll have the ability to style layers of the components that are subject to change between releases. You’ll just need to make sure that any custom theme styling that you’ve done is still functional as you upgrade. If anything breaks, you’ll need to debug with your browsers debug console. Custom themes give you ultimate control over the look and feel, but they certainly fall into the “use at your own risk” category. ---
**Author:** ![craigb](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@craigb](https://forum.inductiveautomation.com/u/craigb)\ **Post date:** [June 26, 2020, 7:16pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/6 "2020-06-26T19:16:49Z")
Thank you. I created the style over ride but it never changed. Do i need to do anything addition to reset / reload the CSS ? ![Capture](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/a/7a1656d777952de3c36a9e5d7406c8044e58b081.jpeg) ---
**Author:** ![jball](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/jball/32/11128_2.png) [@jball](https://forum.inductiveautomation.com/u/jball)\ **Post date:** [June 26, 2020, 7:45pm UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/7 "2020-06-26T19:45:36Z")
Looks good. Probably just need to restart your gateway for it to take. ---
**Author:** ![ARIFRAHUMAN\_A](https://avatars.discourse-cdn.com/v4/letter/a/e19b73/32.png) [@ARIFRAHUMAN\_A](https://forum.inductiveautomation.com/u/ARIFRAHUMAN_A)\ **Post date:** [February 13, 2026, 4:40am UTC](https://forum.inductiveautomation.com/t/perspective-menu-tree-linear-gradient/36010/8 "2026-02-13T04:40:10Z")
Hi, I tried it. It applied only to the items, but I’m not able to apply it to the whole menu (including the free space around the items). How can I achieve this? I’ve attached an image for your reference. ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/d/c/dc21dd103145316095a2cb88862663a6442558d2.png)