# Link styling UI controls in custom component

**URL:** <https://forums.realmacsoftware.com/t/link-styling-ui-controls-in-custom-component/47844>\
**Category:** Elements API\
**Created:** [May 30, 2025, 10:57pm UTC](https://forums.realmacsoftware.com/t/link-styling-ui-controls-in-custom-component/47844 "2025-05-30T22:57:15Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![happynut](https://avatars.discourse-cdn.com/v4/letter/h/edb3f5/32.png) [@happynut](https://forums.realmacsoftware.com/u/happynut)\
**Post date:** [May 30, 2025, 10:57pm UTC](https://forums.realmacsoftware.com/t/link-styling-ui-controls-in-custom-component/47844/1 "2025-05-30T22:57:16Z")

</div>

Hi

I am trying to create a group of ‘link styling’ controls in a custom component, something like the links group that comes with the built in text component.

I can do basic controls (for example using the themecolor picker to style one ‘state’) but linking the the current value of a segmented element like state to individual colour pickers or font weight sliders and then passing those values to the template html is making my old brain ache

Does anyone have an example of properties.json config for this kind of set-up. Just something to point me in the right direction.

---

<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:** [June 1, 2025, 11:42am UTC](https://forums.realmacsoftware.com/t/link-styling-ui-controls-in-custom-component/47844/2 "2025-06-01T11:42:04Z")

</div>

Not 100% what you need… so, before I run off and build an example, I thought I should check!

Is that what you’re trying to do?

![CleanShot 2025-06-01 at 12 .40.16](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/2/2/222c6f30c88aecceca015f62d429b3922aecb840.gif)

---

<div class="post-metadata">

**Author:** ![happynut](https://avatars.discourse-cdn.com/v4/letter/h/edb3f5/32.png) [@happynut](https://forums.realmacsoftware.com/u/happynut)\
**Post date:** [June 2, 2025, 12:12am UTC](https://forums.realmacsoftware.com/t/link-styling-ui-controls-in-custom-component/47844/3 "2025-06-02T00:12:11Z")

</div>

Yes, that is exactly what I have in mind

Thank you for making sense of my rambling, rereading it made me shudder

---

<div class="post-metadata">

**Author:** ![ben](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/ben/32/28488_2.png) [@ben](https://forums.realmacsoftware.com/u/ben)\
**Post date:** [June 2, 2025, 6:46am UTC](https://forums.realmacsoftware.com/t/link-styling-ui-controls-in-custom-component/47844/4 "2025-06-02T06:46:06Z")

</div>

Hey @happynut

Here’s an example project with the controls setup in the “ **Properties** ” custom component — hope this is what you were after 🙂

[elementsapp://downloadDocument/rQLwiCEU3yU4](elementsapp://downloadDocument/rQLwiCEU3yU4)

 ![CleanShot 2025-06-02 at 08.45.47@2x](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/e/2/e2de8eba2fa85fde3246bbc2dce171ef03cff283.jpeg)

---

<div class="post-metadata">

**Author:** ![happynut](https://avatars.discourse-cdn.com/v4/letter/h/edb3f5/32.png) [@happynut](https://forums.realmacsoftware.com/u/happynut)\
**Post date:** [June 11, 2025, 8:41am UTC](https://forums.realmacsoftware.com/t/link-styling-ui-controls-in-custom-component/47844/5 "2025-06-11T08:41:17Z")

</div>

Apologies for not replying sooner.

Yup! This is great. Cheers!