progress-accent-color-appearance.html

<!DOCTYPE html>
<meta name=fuzzy content="maxDifference=0-3; totalPixels=0-100">
<style>
div {
  display: inline-block;
  margin: 3px;
  padding: 3px;
  border: solid lightgray 1px;
}
</style>
<div>
  no accent-color<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
<div style="accent-color: auto">
  accent-color: auto<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
<div style="accent-color: red">
  accent-color: red<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
<div style="accent-color: green">
  accent-color: green<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
<div style="accent-color: #111111">
  accent-color: #111111<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
<div style="accent-color: #eeeeee">
  accent-color: #eeeeee<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
<div style="color-scheme: dark">
  color-scheme: dark<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
<div style="accent-color: currentcolor; color: red">
  accent-color: currentcolor; color: red<br />
  <progress max="100" value="0"> 0% </progress><br />
  <progress max="100" value="50"> 50% </progress><br />
  <progress max="100" value="100"> 100% </progress><br />
</div>
chromium/third_party/blink/web_tests/fast/forms/accent-color/progress-accent-color-appearance.html
