title: Inherit color but override opacity/transparency
body: <p>Is it possible to inherit the color but override the opacity value? Here's an example in <strong>pseudo</strong> CSS:</p>
  
  <pre><code>.color-class {
      background-color: rgba(255, 0, 0, 0);
  }
  
  .lighten {
      background-color: rgba(inherit, inherit, inherit, .4);
  }
  </code></pre>
  
  <p>Applied to</p>
  
  <pre><code>&lt;div style="color-class"&gt;I am red&lt;/div&gt;
  &lt;div style="color-class lighten"&gt;
      I am red and a little bit transparent
  &lt;/div&gt;
  </code></pre>
  
  <p>should result in a colored element and the other one being the same (inherited) color but with added transparency.</p>
  
  <p>I basically want to have a CSS class that lightens (or darkens) the background color without changing the color value.</p>