title: Webkit CSS to control the box around the color in an input[type=color]?
body: <p>Is there a Webkit-specific CSS style that will allow me to control the color/size/style of the box around the color in an <code>input[type=color]</code>?</p>
  <p>I'm setting the color and background color of the input already so it looks good with a cross-compatibility polyfill I'm using for older Chrome and Firefox.</p>
  <p>Now that Chrome actually has a <em>color picker</em>, there's a box around the color which leaves a <code>1px</code> grey box floating in the middle of the input when both color and background color of the input are set to the same color.</p>
  <p>Is there some CSS to get rid of it, either by setting that box's width to 0, changing the style to <code>none</code>, or, at worst, setting the color to the same as the color and background color?</p>
  <hr />
  <p>In this image, I'm talking about the grey box around the white area and outside the green:</p>
  <p><img src="https://i.stack.imgur.com/shFk8.png" alt="Screenshot of color picker" /></p>
  <p>I've found one workaround, which is to set a high enough padding that the box (the grey border and green contents) is squished to size 0.  But that's really hacky, and doesn't look very good over in Firefox.</p>