Ash Color Chooser

## Overview

This document describes how to achieve <input type=”color”> UI in ChromeOS/Ash.

# Motivation

<input type=”color”> is a new input type introduced in HTML5. It enables users to pick a color and returns a value of #hhhhhh format. WebKit forms team has decided to use platform’s default color picker rather than implementing a new one. It means that we need to implement our own color picker view for ChromeOS/Ash.

# First Goal

• Implement simple color picker dialog working with <input type=”color>.

• Implement with views, not HTML.

• Features

  • Behave as Modal Dialog (see doc)
    • Appears in the topmost z-order
  • Pick up a color from HSV model
    • Has both a Hue bar and a Saturation-Value plane (see below mock).
  • Pick up a color from text
    • Allow copy/paste
    • Specify the color by …
      • rgb(xx ,yy, zz)
      • #RRGGBB
      • CSS well-known color name
      • … anything else?
  • Work on Chrome OS

• first mock

  

  • Confirmed that the upper box isn’t necessary, since the color will be shown in the page.

• Current screenshot:

  

# Next plans (not confirmed yet)

• Global Color Picker: Picking a color from any point on the desktop.
  • Even from other tab, window or desktop.
• “Favorite Color” feature
  • Pick up the color easily from each user’s favorite color.
• Works on Windows and Chrome OS
  • Currently, Windows has native OS Color PIcker Dialog. This new Color Picker will replace it.

# Not Goal

• Alpha value (transparency) support
  • HTML5 spec has not supported alpha value.

# References

Input type=color spec: https://www.w3.org/TR/html-markup/input.color.html