# How to Change the Color of #Mentions in a Multiline Input in Real-Time?

**URL:** <https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868>\
**Category:** Plugins\
**Created:** [October 31, 2023, 3:58pm UTC](https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868 "2023-10-31T15:58:48Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![joaquintorroba](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/joaquintorroba/32/179224_2.png) [@joaquintorroba](https://forum.bubble.io/u/joaquintorroba)\
**Post date:** [October 31, 2023, 3:58pm UTC](https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868/1 "2023-10-31T15:58:48Z")

</div>

Hey,  
I need help figuring out how to make mentions (#mention) change color in real-time within a multiline input.

**Context:**

- I am using the “@Mention Input Dropdown” plugin.
- This multiline input is part of a chat box in a chatbot.

**Images** :

- **Image 1** : Shows what happens when a user starts to type a #.
- **Image 2** : Here the user has selected a #mention. **This is the text that I want to change color**.

Thanks in advanced!

![CleanShot 2023-10-31 at 16.57.31](https://us1.discourse-cdn.com/bubble/original/3X/8/b/8b1b84334beb15819b3c600c5f5b1bac1a4cb014.png)

 ![CleanShot 2023-10-31 at 16.57.58](https://us1.discourse-cdn.com/bubble/original/3X/8/f/8f4dc03ae6d0c46b7e76d79a0203e0021ae7c655.png)

---

<div class="post-metadata">

**Author:** ![abe1366](https://avatars.discourse-cdn.com/v4/letter/a/c37758/32.png) [@abe1366](https://forum.bubble.io/u/abe1366)\
**Post date:** [February 17, 2024, 4:34pm UTC](https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868/2 "2024-02-17T16:34:32Z")

</div>

Hi. Did you ever figure this out? I have purchased a plugin that takes care of the mentions. However, I want my text that I retrieve back from the my table to show a different color for text that starts with @.  
I appreciate if you could let me know if you found a solution?

Thanks,

---

<div class="post-metadata">

**Author:** ![joaquintorroba](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/joaquintorroba/32/179224_2.png) [@joaquintorroba](https://forum.bubble.io/u/joaquintorroba)\
**Post date:** [February 19, 2024, 12:46pm UTC](https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868/3 "2024-02-19T12:46:06Z")

</div>

I haven’t. Partial solutions that don’t solve the user experience. Lmk if you find a solution. I think a solution could be to use some java but I need to explore it more.

---

<div class="post-metadata">

**Author:** ![abe1366](https://avatars.discourse-cdn.com/v4/letter/a/c37758/32.png) [@abe1366](https://forum.bubble.io/u/abe1366)\
**Post date:** [February 20, 2024, 3:41am UTC](https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868/4 "2024-02-20T03:41:39Z")

</div>

Same here. Spent a few hours trying to get this accomplished with find&Replace and Regex. But no matter what Regex pattern I tried, I couldn’t get this to work. I think that’s the way to go. I’ll let you know if I find the regex pattern.

Basically you do find & Replace option at the end of the text, and then there is a checkbox for regex pattern. You check that and try to find the right pattern.

Yours is different from mine a little bit. You’re trying to do it on the fly as the user is typing in an input field. Using bubble, the only way I can think of is doing a check after every letter is entered which could impact your user experience.

Maybe what you could do is trigger an event as soon as the @Mention plugin is used, applied or changed.

---

<div class="post-metadata">

**Author:** ![buero](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/buero/32/31435_2.png) [@buero](https://forum.bubble.io/u/buero)\
**Post date:** [February 8, 2025, 6:55am UTC](https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868/5 "2025-02-08T06:55:59Z")

</div>

any updates on this?

---

<div class="post-metadata">

**Author:** ![buero](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/buero/32/31435_2.png) [@buero](https://forum.bubble.io/u/buero)\
**Post date:** [February 8, 2025, 7:02am UTC](https://forum.bubble.io/t/how-to-change-the-color-of-mentions-in-a-multiline-input-in-real-time/290868/6 "2025-02-08T07:02:19Z")

</div>

i found this - maybe a better solution:

> **[Bubble - Visual Programming](https://forward-plugins-demo.bubbleapps.io/version-test/mentions)**
>
> Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications.
