Skip to main content
CSS is fun and cool and I like it.

Adventures in CSS Semi-Transparency Land

Recently, I was asked to make some tweaks to a landing page and, among the things I found in the code, there were two semitransparent overlays — both with the same RGB values for the background-color — on top of an image. Something like this:

<img src='myImage.jpg'/>
<div class='over1'></div>
<div class='over2'></div>

There was no purpose to having two of them other than the fact that having just one didn’t tint the image enough. For some reason, whoever initially coded that … Read article “Adventures in CSS Semi-Transparency Land”


Transparent JPG (With SVG)

Let’s say you have a photographic image that really should be a JPG or WebP, for the best file size and quality. But what if I need transparency too? Don’t I need PNG for that? Won’t that make for either huge file sizes (PNG-24) or weird quality (PNG-8)? Let’s look at another way that ends up best-of-both-worlds.… Read article “Transparent JPG (With SVG)”