# Color picker in plugin UI

**URL:** <https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635>\
**Category:** UXP Plugin API\
**Tags:** ui, feature-request, api-feedback\
**Created:** [February 12, 2019, 2:31pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635 "2019-02-12T14:31:29Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![talkaboutdesign](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/talkaboutdesign/32/80_2.png) [@talkaboutdesign](https://forums.creativeclouddeveloper.com/u/talkaboutdesign)\
**Post date:** [February 12, 2019, 2:31pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/1 "2019-02-12T14:31:29Z")

</div>

Is there a way to add color picker to plugin UI? I want user to be able to select a color. Or at the very least offer a few preset colors to pick from.

Thanks for your feedback in advance.

---

<div class="post-metadata">

**Author:** ![stevekwak](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/stevekwak/32/48_2.png) [@stevekwak](https://forums.creativeclouddeveloper.com/u/stevekwak)\
**Post date:** [February 12, 2019, 3:43pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/2 "2019-02-12T15:43:44Z")

</div>

There is no API generating color picker UI. However, nothing stops you from building a simple color picker with a few preset colors yourself. Also since the XD 15 update, you are able to read/write user’s assets panel.

---

<div class="post-metadata">

**Author:** ![PaoloBiagini](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/paolobiagini/32/29_2.png) [@PaoloBiagini](https://forums.creativeclouddeveloper.com/u/PaoloBiagini)\
**Post date:** [February 25, 2019, 9:48pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/3 "2019-02-25T21:48:28Z")

</div>

I’ve implemented a simple color picker that gets assets colors in my Frame Maker plugin.

If you need to look at the code:  
[https://github.com/paolobiagini/xd-frame-maker](https://github.com/paolobiagini/xd-frame-maker)  
Hope it helps.  
Keep in mind that I’m just a designer so the javascript logic could be not very professional.

---

<div class="post-metadata">

**Author:** ![talkaboutdesign](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/talkaboutdesign/32/80_2.png) [@talkaboutdesign](https://forums.creativeclouddeveloper.com/u/talkaboutdesign)\
**Post date:** [February 25, 2019, 10:06pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/4 "2019-02-25T22:06:15Z")

</div>

This is very helpful. Thanks!

---

<div class="post-metadata">

**Author:** ![kerrishotts](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/kerrishotts/32/8_2.png) [@kerrishotts](https://forums.creativeclouddeveloper.com/u/kerrishotts)\
**Post date:** [February 26, 2019, 9:42am UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/5 "2019-02-26T09:42:37Z")

</div>

Cool 🙂 Love the integration w/ Assets!

---

<div class="post-metadata">

**Author:** ![rehdie](https://avatars.discourse-cdn.com/v4/letter/r/858c86/32.png) [@rehdie](https://forums.creativeclouddeveloper.com/u/rehdie)\
**Post date:** [October 17, 2019, 5:16pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/6 "2019-10-17T17:16:22Z")

</div>

Why don’t support the HTML \<input type=“color”\> ? That should be the easiest way to add this feature.

For now \<input type=“color”\> creates a simple text-field. Since Chrome does support this feature (according to [https://caniuse.com/#feat=input-color](https://caniuse.com/#feat=input-color)), XD could support it quite easily (assuming that XD is an electron-Application)

---

<div class="post-metadata">

**Author:** ![cpryland](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/cpryland/32/1172_2.png) [@cpryland](https://forums.creativeclouddeveloper.com/u/cpryland)\
**Post date:** [October 17, 2019, 5:57pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/7 "2019-10-17T17:57:14Z")

</div>

UXP (which provides XD’s extensibility) is a from-scratch implementation of HTML/CSS, with JS being provided by the standard V8 engine.

But we could certainly vote for a color input type. I think it’s been requested and is planned.

---

<div class="post-metadata">

**Author:** ![kerrishotts](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/kerrishotts/32/8_2.png) [@kerrishotts](https://forums.creativeclouddeveloper.com/u/kerrishotts)\
**Post date:** [October 18, 2019, 10:53pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/8 "2019-10-18T22:53:51Z")

</div>

XD isn’t an Electron app – rather it’s a native app that uses some JS and has a completely custom rendering engine for plugins (based on HTML and CSS, but it’s not a browser, so support isn’t perfect.)

As for `input type="color"` it’s on our backlog… hopefully we’ll be able to get to it soon. We had to get some other support in before working on this feature itself. Plus there is a little bit of difficulty here – the web spec that supports a color picker doesn’t actually allow transparency or HSL. Which XD definitely does… so actual support here gets a little thorny.

We may end up having to go out-of-spec for this one and do something like `input type="xd-color"` or similar. (problem then is that this becomes app-specific – and other apps have very different color pickers.)

---

<div class="post-metadata">

**Author:** ![cpryland](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/cpryland/32/1172_2.png) [@cpryland](https://forums.creativeclouddeveloper.com/u/cpryland)\
**Post date:** [October 20, 2019, 4:15pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/9 "2019-10-20T16:15:36Z")

</div>

That’s OK if it’s app-specific. Anything this close to the core of a graphic app’s detailed API could be expected to be specific.

---

<div class="post-metadata">

**Author:** ![igcorreia](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/igcorreia/32/35_2.png) [@igcorreia](https://forums.creativeclouddeveloper.com/u/igcorreia)\
**Post date:** [October 21, 2019, 2:08pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/10 "2019-10-21T14:08:55Z")

</div>

Agreed on this one, developers will respect it and understand the behind the scenes decisions and limitations. I would go xd-color or implemente just color for the full coverage and legacy-color for the old one 🙂

---

<div class="post-metadata">

**Author:** ![Velara](https://sea1.discourse-cdn.com/flex015/user_avatar/forums.creativeclouddeveloper.com/velara/32/1278_2.png) [@Velara](https://forums.creativeclouddeveloper.com/u/Velara)\
**Post date:** [July 12, 2021, 2:43am UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/12 "2021-07-12T02:43:21Z")

</div>

> [@igcorreia](#):
>
> I would go xd-color or implemente just color for the full coverage and legacy-color for the old one 🙂

I changed this to a feature request.

Also, I’d vote for opening the XD color picker.

---

<div class="post-metadata">

**Author:** ![Powerbooster](https://avatars.discourse-cdn.com/v4/letter/p/c89c15/32.png) [@Powerbooster](https://forums.creativeclouddeveloper.com/u/Powerbooster)\
**Post date:** [December 15, 2021, 12:57pm UTC](https://forums.creativeclouddeveloper.com/t/color-picker-in-plugin-ui/635/13 "2021-12-15T12:57:14Z")

</div>

> [@stevekwak](#):
>
> nothing stops you from building a simple color picker with a few preset colors yourself

Has there been any update on the release of this colour picker API. Having preset of colours is a workaround, but it is limiting the users control. Cheers.
