# Notification ribbon with a gradient fade-out

**URL:** <https://discourse.nodered.org/t/notification-ribbon-with-a-gradient-fade-out/66089>\
**Category:** Dashboard\
**Tags:** node-red-dashboard\
**Created:** [5 August 2022 17:54 UTC](https://discourse.nodered.org/t/notification-ribbon-with-a-gradient-fade-out/66089 "2022-08-05T17:54:29Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![earlywaff](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/earlywaff/32/56170_2.png) [@earlywaff](https://discourse.nodered.org/u/earlywaff)\
**Post date:** [5 August 2022 17:54 UTC](https://discourse.nodered.org/t/notification-ribbon-with-a-gradient-fade-out/66089/1 "2022-08-05T17:54:29Z")

</div>

Hi all, I want to do something like feed ribbon with gradient fade. I.e. the last message is a bright font, and subsequent ones will be less transparent.  
This is Smart Mirror 2, there is a very similar way to do the weather and calendar block. Are there any similar palettes for HP?

 ![](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/3X/a/e/aeb307731c5cfab4c6c31169dbff7bcdceea4fc1.jpeg)

---

<div class="post-metadata">

**Author:** ![knoepsche](https://sea2.discourse-cdn.com/flex026/user_avatar/discourse.nodered.org/knoepsche/32/69450_2.png) [@knoepsche](https://discourse.nodered.org/u/knoepsche)\
**Post date:** [6 August 2022 09:05 UTC](https://discourse.nodered.org/t/notification-ribbon-with-a-gradient-fade-out/66089/2 "2022-08-06T09:05:54Z")

</div>

Found something there:  
[https://stackoverflow.com/questions/24227636/how-to-make-a-gradient-overlay-at-bottom-of-list-to-indicate-more-items](https://stackoverflow.com/questions/24227636/how-to-make-a-gradient-overlay-at-bottom-of-list-to-indicate-more-items)

For this I would try a list in the ui-template node

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex026/uploads/nodered/original/1X/d073cd938eafa2e558d7c2cd59003b3ef4963033.png) [@system](https://discourse.nodered.org/u/system)\
**Post date:** [5 September 2022 09:06 UTC](https://discourse.nodered.org/t/notification-ribbon-with-a-gradient-fade-out/66089/3 "2022-09-05T09:06:03Z")

</div>

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.