title: Can the default named CSS colors be overridden?
body: <p>Inspired by <a href="http://clrs.cc/" rel="nofollow noreferrer">COLORS: A nicer color palette for the web</a>, I was wondering if there is way to override the default named color definition as defined in the <a href="https://www.w3.org/TR/css3-color/" rel="nofollow noreferrer">HTML/CSS specification</a> with these new colors.</p>
  
  <p>I am aware that I can create custom CSS rules (and LESS) to define new colors and apply these to which ever elements, however the interest here is for example </p>
  
  <pre><code>h1{
      /* #ff0000 is current definition of red, I want to redefine it to #FF4136 */
      color: red;
  }
  </code></pre>
  
  <h2><strong>Update</strong></h2>
  
  <p>I was so inspired by my question, I ended up digging around in the Blink and WebKit source code and from what I can see, these colors are defined within code.</p>
  
  <h2><a href="http://clrs.cc/" rel="nofollow noreferrer">Webkit</a> Line ~3299</h2>
  
  <pre><code>static const ColorValue colorValues[] = {
      { CSSValueAqua, 0xFF00FFFF },
      { CSSValueBlack, 0xFF000000 },
      { CSSValueBlue, 0xFF0000FF },
      { CSSValueFuchsia, 0xFFFF00FF },
      { CSSValueGray, 0xFF808080 },
      { CSSValueGreen, 0xFF008000  },
      { CSSValueGrey, 0xFF808080 },
      { CSSValueLime, 0xFF00FF00 },
      { CSSValueMaroon, 0xFF800000 },
      { CSSValueNavy, 0xFF000080 },
      { CSSValueOlive, 0xFF808000  },
      { CSSValueOrange, 0xFFFFA500 },
      { CSSValuePurple, 0xFF800080 },
      { CSSValueRed, 0xFFFF0000 },
      { CSSValueSilver, 0xFFC0C0C0 },
      { CSSValueTeal, 0xFF008080  },
      { CSSValueTransparent, 0x00000000 },
      { CSSValueWhite, 0xFFFFFFFF },
      { CSSValueYellow, 0xFFFFFF00 },
      { CSSValueInvalid, CSSValueInvalid }
  };
  </code></pre>
  
  <h2><a href="https://www.w3.org/TR/css3-color/" rel="nofollow noreferrer">Blink</a> ~ Line 157</h2>
  
  <h2>Update 2</h2>
  
  <p>There may some hope for the future. FireFox Nightly build includes the concept of a <a href="https://hacks.mozilla.org/2013/12/css-variables-in-firefox-nightly/" rel="nofollow noreferrer">CSS-variable</a>. Although a vendor specific at this point, it 'almost' is related to my question. The related W3C specification : <a href="https://www.w3.org/TR/css-variables-1/" rel="nofollow noreferrer">CSS Custom Properties for Cascading Variables Module Level 1</a> - see Example 4</p>