<audio preload="none" controls="controls">
  <source type="audio/mpeg" src="https://anchor.fm/s/34f8474/podcast/play/3181901/https%3A%2F%2Fd3ctxlq1ktw2nl.cloudfront.net%2Fstaging%2F2019-4-8%2FWed--05-08---The-Pixel-3a-and--6141c10a3771a.m4a" />
</audio>
<audio class="a" preload="none" controls="controls">
  <source type="audio/mpeg" src="https://anchor.fm/s/34f8474/podcast/play/3181901/https%3A%2F%2Fd3ctxlq1ktw2nl.cloudfront.net%2Fstaging%2F2019-4-8%2FWed--05-08---The-Pixel-3a-and--6141c10a3771a.m4a" />
</audio>
<audio class="b" preload="none" controls="controls">
  <source type="audio/mpeg" src="https://anchor.fm/s/34f8474/podcast/play/3181901/https%3A%2F%2Fd3ctxlq1ktw2nl.cloudfront.net%2Fstaging%2F2019-4-8%2FWed--05-08---The-Pixel-3a-and--6141c10a3771a.m4a" />
</audio>
<audio class="c" preload="none" controls="controls">
  <source type="audio/mpeg" src="https://anchor.fm/s/34f8474/podcast/play/3181901/https%3A%2F%2Fd3ctxlq1ktw2nl.cloudfront.net%2Fstaging%2F2019-4-8%2FWed--05-08---The-Pixel-3a-and--6141c10a3771a.m4a" />
</audio>
<audio class="d" preload="none" controls="controls">
  <source type="audio/mpeg" src="https://anchor.fm/s/34f8474/podcast/play/3181901/https%3A%2F%2Fd3ctxlq1ktw2nl.cloudfront.net%2Fstaging%2F2019-4-8%2FWed--05-08---The-Pixel-3a-and--6141c10a3771a.m4a" />
</audio>

<p>Credit to <a href="https://www.techmeme.com/">Techmeme's</a> daily podcast for being our audio guinea pig.</p>
audio { display: block; }

audio.a {
  filter: sepia(100%) hue-rotate(45deg);
}

audio.b {
  filter: sepia(100%) hue-rotate(135deg);
}

audio.c {
  filter: sepia(100%) hue-rotate(45deg) contrast(60%) saturate(400%);
}

audio.d {
  filter: sepia(100%) saturate(1000%);
}

p {
  font-size: 0.9em;
  font-family: sans-serif;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.