Background color of embedded video is correct on desktop site, but slightly off on mobile site

[parkgaedae]

my website is

interestingenglish.com

I matched the color in the video to that of the background of the row my video is to make it appear as though my head is floating, and it works very well on the desktop site, unfortunately on the mobile site the color of the background (or possibly the video?) changes, thus I’m not longer a floating head, but rather a dude in a slightly off colored video box…

Is there anyway to make me appear a floating head in the mobile and desktop versions?

Thanks!

[thai]

Hi There,

The background website video doesn’t match with the background color of first section.

The others video look good on my iPhone:

Could you please double check or provide us with some screenshots?

Many thanks.

[parkgaedae]

It’s hard to see the problem on an iPhone because once you start the video, it doesn’t play within the browser, the video opens in a separate video player, but you can see in the yellow thumbnail that the thumbnail yellow doesn’t completely match the yellow background.

I think somehow the video’s color is different when played on a mobile device than when it is played on a desktop browser because I fixed the background matching on the salmon colored video by taking a screenshot of the video, and using that for a thumbnail.

I’m not sure how clear what I’m explaining has come across, but I’m pretty sure, somehow, using any video player (wordpress embedded video, youtube, vimeo) the color somehow is different…

[rad]

Hi @parkgaedae,

That’s because the video background is solid, it’s another yellow background different from section’s yellow background. And you can directly see it here http://www.interestingenglish.com/yellow.mp4.

It’s either edit the video and use the same yellow from the section, or change the section background color to the same yellow background of the video. And the same for red background.

For reference, these are the color codes

Section’s yellow = #ffde00
Video’s yellow = #ffd806

Hence, you can change the section’s yellow to #ffd806 to match it with the video

Section’s red = #ff433f
Video’s red = #ff3a39

Hence, you can change the section’s background as well to #ff3a39

Thanks!