# Is this shadow style possible

**URL:** <https://forum.bubble.io/t/is-this-shadow-style-possible/267378>\
**Category:** Questions\
**Created:** [June 13, 2023, 9:36am UTC](https://forum.bubble.io/t/is-this-shadow-style-possible/267378 "2023-06-13T09:36:54Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![alexej.041028](https://avatars.discourse-cdn.com/v4/letter/a/cc9497/32.png) [@alexej.041028](https://forum.bubble.io/u/alexej.041028)\
**Post date:** [June 13, 2023, 9:36am UTC](https://forum.bubble.io/t/is-this-shadow-style-possible/267378/1 "2023-06-13T09:36:54Z")

</div>

![Screenshot 2023-06-13 at 11.35.11](https://us1.discourse-cdn.com/bubble/original/3X/8/7/879be03c4606ef3f9618a7410fbd19ee5c07d1e2.png)

I just wondered if this type of shadow style is possible and if so how do i make it

---

<div class="post-metadata">

**Author:** ![Newed](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/newed/32/262530_2.png) [@Newed](https://forum.bubble.io/u/Newed)\
**Post date:** [June 13, 2023, 12:49pm UTC](https://forum.bubble.io/t/is-this-shadow-style-possible/267378/2 "2023-06-13T12:49:38Z")

</div>

Yes, it is possible. Using native Bubble elements or custom code.

[Editor](https://bubble.io/page?type=page&name=multiple-shadows&id=codex-examples&tab=tabs-1)

[Preview](https://codex-examples.bubbleapps.io/version-test/multiple-shadows)

---

<div class="post-metadata">

**Author:** ![alexej.041028](https://avatars.discourse-cdn.com/v4/letter/a/cc9497/32.png) [@alexej.041028](https://forum.bubble.io/u/alexej.041028)\
**Post date:** [June 13, 2023, 1:40pm UTC](https://forum.bubble.io/t/is-this-shadow-style-possible/267378/4 "2023-06-13T13:40:47Z")

</div>

Tank you for answering my. Just one single question, do I put the code in a HTML element on my page, or is it placed in the element that I want to display the effect

---

<div class="post-metadata">

**Author:** ![Newed](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/newed/32/262530_2.png) [@Newed](https://forum.bubble.io/u/Newed)\
**Post date:** [June 13, 2023, 1:58pm UTC](https://forum.bubble.io/t/is-this-shadow-style-possible/267378/5 "2023-06-13T13:58:02Z")

</div>

When using custom code, you need to insert an HTML element into the page (it will be invisible in the preview, so don’t worry about it).

In the code, “#element-id” is a unique reference to the element you want to apply the CSS style, in this case the box-shadow property.

Therefore, you need to enter this unique ID in the element, in the appearance tab, last property. To do this, the option **“Expose the option to add an ID attribute to HTML elements”** needs to be checked in your app settings: **Settings \> General \> Advanced options**.

The ID does not need to contain the “#” character in the element field, just in the code, it is just a selector identifier. Also, “element-id” can be changed to any word you deem appropriate for your context of use, but the reference in code must use the same word defined in the element ID field.
