# Color picker component in Perspective

**URL:** <https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864>\
**Category:** Ignition\
**Created:** [August 18, 2020, 3:35pm UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864 "2020-08-18T15:35:42Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![yash.bhan](https://avatars.discourse-cdn.com/v4/letter/y/bbe5ce/32.png) [@yash.bhan](https://forum.inductiveautomation.com/u/yash.bhan)\
**Post date:** [August 18, 2020, 3:35pm UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/1 "2020-08-18T15:35:42Z")

</div>

Hi

Just wanted to know if there is a color picker/selector component in the Perspective module.

---

<div class="post-metadata">

**Author:** ![paul-griffith](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/paul-griffith/32/37249_2.png) [@paul-griffith](https://forum.inductiveautomation.com/u/paul-griffith)\
**Post date:** [August 18, 2020, 4:27pm UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/2 "2020-08-18T16:27:10Z")

</div>

No.

I’m not aware of plans to add one in the near future. Someone could provide a third party module in the meantime.

---

<div class="post-metadata">

**Author:** ![yash.bhan](https://avatars.discourse-cdn.com/v4/letter/y/bbe5ce/32.png) [@yash.bhan](https://forum.inductiveautomation.com/u/yash.bhan)\
**Post date:** [August 19, 2020, 9:16am UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/3 "2020-08-19T09:16:58Z")

</div>

Oh alright, thanks.

---

<div class="post-metadata">

**Author:** ![kgamble](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/kgamble/32/8019_2.png) [@kgamble](https://forum.inductiveautomation.com/u/kgamble)\
**Post date:** [August 20, 2020, 2:16am UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/4 "2020-08-20T02:16:26Z")

</div>

Here is one on the exchange, I actually started a more robust one as well to add, just havent done it yet so who knows maybe one day!

> **[Ignition Exchange](https://inductiveautomation.com/exchange/112/overview)**
>
> Discover, share, and download community made Ignition resources in collaboration with your organization or the Ignition community.

---

<div class="post-metadata">

**Author:** ![yash.bhan](https://avatars.discourse-cdn.com/v4/letter/y/bbe5ce/32.png) [@yash.bhan](https://forum.inductiveautomation.com/u/yash.bhan)\
**Post date:** [August 22, 2020, 10:34am UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/5 "2020-08-22T10:34:12Z")

</div>

Woah! will try using this component, thanks a lot!

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [September 16, 2023, 5:15pm UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/6 "2023-09-16T17:15:58Z")

</div>

So, I needed a color picker and tried the one from the exchange.  
I thought it could be polished a bit more, and... I couldn't sleep last night anyway.

[color\_picker.zip](https://forum.inductiveautomation.com/uploads/short-url/h807APFo1lnkFDYGHE0RoV16qyE.zip) (34.6 KB)  
 ![image](https://us1.discourse-cdn.com/inductiveautomation/original/3X/7/8/78f8ca240491ed0f28a80a0acbe3152abe8c0dbb.png)

Not gonna lie, I stole the palette from the one @Travis.Cox made.  
Also used his mechanism to write the colors part to the parameter (property change script on the r/g/b components.).  
What changed, then ?  
Internally, I tried to clean it up a bit, make things simpler. Rewrote the scripts to make them clearer.  
Visually, The r/g/b/a components adapt to show what color you'll get by putting the slider handle somewhere. It's accurate enough.

I didn't test this on multiple browsers, so if you find something that behaves weirdly, please report back.  
Also note that the css used to modify the slider's handle and bind it to its container might need to be adjusted if you change the size of the sliders (there's some padding involved to make it stay inside).  
You'll find the handle's css in the `color_slider_handle`, as an injection,  
and the css for the slider itself in `color_slider`

There's also an alpha part. The color returned won't include it (hex code still on 6 characters) if there's no transparency.

The popup expects a popup\_id, an item\_id and an initial color.  
The popup\_id is used to close the popup, and is provided automatically if you use the `color_popup` function.  
`item_id` is used to filter the incoming messages, in case there are several things calling this popup.  
Can be pretty much anything, as long as it identifies the component that should receive the message.  
`color` is, well, an initial color, in case you need to change a color instead of creating a new one.  
This could probably be improved, maybe just giving it a default color... I didn't need it so I didn't do it.

I might polish it some more when I get time, but this is good enough for my use case.

edit: Just realized it's missing a style class... that's in my actual project.  
I'll try and fix this asap. And maybe also make things align a bit more neatly.

edit: forgot about this. Updated with slightly better looking version.

---

<div class="post-metadata">

**Author:** ![gavinw0606](https://avatars.discourse-cdn.com/v4/letter/g/ec9cab/32.png) [@gavinw0606](https://forum.inductiveautomation.com/u/gavinw0606)\
**Post date:** [April 7, 2026, 6:11pm UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/7 "2026-04-07T18:11:21Z")

</div>

Hi there, I’m coming in pretty late to this thread, but this color picker is exactly what I’ve been looking for. I’m a relatively new Ignition Programmer. Is it okay to pretty much just copy and paste this into my own project? I’m not sure how usage rights work for this. I’d be more than happy to credit you in any way you’d like!

---

<div class="post-metadata">

**Author:** ![pturmel](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pturmel/32/3295_2.png) [@pturmel](https://forum.inductiveautomation.com/u/pturmel)\
**Post date:** [April 8, 2026, 6:05am UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/8 "2026-04-08T06:05:26Z")

</div>

The exchange has specific rights grants. (Basically MIT-style open source.) You should read its terms.

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [April 8, 2026, 7:04am UTC](https://forum.inductiveautomation.com/t/color-picker-component-in-perspective/37864/9 "2026-04-08T07:04:51Z")

</div>

You can take mine, the download link is still active (in the post right above yours).  
I should put it on the exchange but it just wouldn't work last time I tried...

Note that the one on the exchange was made by Travis Cox, so if you want to credit someone it should be him.
