Read more

HTML/CSS: "transparent" is not a color

Dominik Schöler
March 25, 2020Software engineer at makandra GmbH

Heads up: transparent is not a real color, but black with 0% opacity.

Illustration UI/UX Design

UI/UX Design by makandra brand

We make sure that your target audience has the best possible experience with your digital product. You get:

  • Design tailored to your audience
  • Proven processes customized to your needs
  • An expert team of experienced designers
Read more Show archive.org snapshot

In Safari, this makes e.g. gradients between transparent and white have some gray tones in the middle.

/* Unexpected in Safari */
linear-gradient(to right, white 0%, transparent 100%)

/* Correct */
linear-gradient(to right, white 0%, rgba(255,255,255,0) 100%)
Posted by Dominik Schöler to makandra dev (2020-03-25 10:48)