# Slider and font

**URL:** <https://forums.realmacsoftware.com/t/slider-and-font/55919>\
**Category:** Elements\
**Created:** [April 29, 2026, 12:08pm UTC](https://forums.realmacsoftware.com/t/slider-and-font/55919 "2026-04-29T12:08:36Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Blumik](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/blumik/32/24405_2.png) [@Blumik](https://forums.realmacsoftware.com/u/Blumik)\
**Post date:** [April 29, 2026, 12:08pm UTC](https://forums.realmacsoftware.com/t/slider-and-font/55919/1 "2026-04-29T12:08:36Z")

</div>

Hello and hi there,

how can I achieve something like this in Element?

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [April 29, 2026, 12:22pm UTC](https://forums.realmacsoftware.com/t/slider-and-font/55919/2 "2026-04-29T12:22:39Z")

</div>

Hey @Blumik,

Yes, you can do this by using an absolute positioned container over the top of the slider, it looks like this…

👉 [Open the project in Elements](elementsapp://downloadDocument/zHEQ2kW95KBi)

Hope that helps 🙂

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [April 29, 2026, 9:02pm UTC](https://forums.realmacsoftware.com/t/slider-and-font/55919/3 "2026-04-29T21:02:34Z")

</div>

thought I would replicate with components I already have

---

<div class="post-metadata">

**Author:** ![Blumik](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/blumik/32/24405_2.png) [@Blumik](https://forums.realmacsoftware.com/u/Blumik)\
**Post date:** [April 30, 2026, 3:38am UTC](https://forums.realmacsoftware.com/t/slider-and-font/55919/4 "2026-04-30T03:38:33Z")

</div>

That’s exactly what I’m looking for, but how do I do that? Oh schon gesehen ☺

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [May 1, 2026, 6:46pm UTC](https://forums.realmacsoftware.com/t/slider-and-font/55919/5 "2026-05-01T18:46:45Z")

</div>

unable to share devpacks, I did add some controls and extras though, apologies, I even added my auto tailwind to hex (created as an exercise), to insert into the radial / linear gradient color. The fade now doesn’t start until into view