# Gradients in page design

**URL:** <https://community.blippa.com/t/gradients-in-page-design/378>\
**Category:** Uncategorized\
**Tags:** page-design\
**Created:** [September 29, 2026, 7:25am UTC](https://community.blippa.com/t/gradients-in-page-design/378 "2026-09-29T07:25:03Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![mrunhem](https://community.blippa.com/letter_avatar_proxy/v4/letter/m/919ad9/32.png) [@mrunhem](https://community.blippa.com/u/mrunhem)\
**Post date:** [September 29, 2026, 7:25am UTC](https://community.blippa.com/t/gradients-in-page-design/378/1 "2026-09-29T07:25:03Z")

</div>

If you would like to use gradients in the page design colours, try adding this CSS in Page Design.Advanced-Custom CSS:

```auto
.label-container { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); }
.btn-custom { background: linear-gradient(135deg, #a855f7, #ec4899) !important; border: none; }
.btn-custom:hover { background: linear-gradient(135deg, #9333ea, #db2777) !important; box-shadow: 0 4px 16px rgba(236, 72, 153, 0.4); }

```

**The result:**

 ![Screenshot 2026-09-29 at 09.24.22](https://community.blippa.com/uploads/default/original/1X/3398e9795c0b2e04256d1a2ae5c689a7c05cfa73.jpeg)