CODEWITHSUNDEEP
htmlmacosvideohtml5-videoh.264
Edouard Short
Edouard Short

Reputation: 55

Color Variations in video - HTML5

I am having some trouble with video colors on MacOs.

I have some consistent variations of color between mac os and other plateform (even iphone seems to match the others), and it seems to come from video decoding.

Here is an example with a video on a webpage with a background color that is suppose to match the video background.

My web page on linux

My web page on MacOs

Upvotes: 3

Views: 1651

Answers (2)

Markus Schumann
Markus Schumann

Reputation: 8254

This looks to me like an issue of color range or black level. Black can be signaled as '0' or '16' for 8-Bit.

Your video looks like black is encoded as '16' but the player assumes black as '0'. So the player gets '16' and interprets it at as dark gray although it was intended as black.

Both variations are valid (black as '0' or '16').

So in your case the player assumes or gets signaled the incorrect range.

The color range metadata in your H.264 stream may be missing or wrong or the player may ignore the color range metadata and assume black is '0'.

Create your output in full range (black as '0'), make sure its signaled correctly and try again. FFMPEG gives you control of the range settings.

Upvotes: 1

szatmary
szatmary

Reputation: 31130

When encoding the video, the correct color space metadata is not being set. I recently wrote a blog post covering exactly this. https://mux.com/blog/your-browser-and-my-browser-see-different-colors/

Another option is to use canvas to read the video color, and set your background using that. https://mux.com/blog/canvas-adding-filters-and-more-to-video-using-just-a-browser/

Upvotes: 3

Related Questions