Background color different in real life

Hey there,
I noticed that the background color of my site is not the one I choosed.
You can see the difference in the 2 screenshots :
What I see in Pro (and what I’d like to have) :

What I have on my website :

Hi There,

It could be the default CSS overrides your custom CSS.

Please update your custom CSS to this:

.grad1 {
	background: -moz-linear-gradient(top,rgba(244,244,244,1) 0%,rgba(255,255,255,0) 100%) !important;
	background: -webkit-linear-gradient(top,rgba(244,244,244,1) 0%,rgba(255,255,255,0) 100%) !important;
	background: linear-gradient(to bottom,rgba(244,244,244,1) 0%,rgba(255,255,255,0) 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f4f4f4',endColorstr='#00ffffff',GradientType=0 );

.grad2 {
	background: -moz-linear-gradient(top,rgba(255,255,255,0) 0%,rgba(244,244,244,1) 100%) !important;
	background: -webkit-linear-gradient(top,rgba(255,255,255,0) 0%,rgba(244,244,244,1) 100%) !important;
	background: linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(244,244,244,1) 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff',endColorstr='#f4f4f4',GradientType=0 );

.grad3 {
	background: rgb(255,255,255);
	background: -moz-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(136,188,211,1) 100%) !important;
	background: -webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(136,188,211,1) 100%) !important;
	background: linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(136,188,211,1) 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff',endColorstr='#88bcd3',GradientType=0 );

.grad4 {
	background: -moz-linear-gradient(top,rgba(137,255,231,0) 0%,rgba(196,255,243,1) 50%,rgba(255,255,255,0) 100%) !important;
	background: -webkit-linear-gradient(top,rgba(137,255,231,0) 0%,rgba(196,255,243,1) 50%,rgba(255,255,255,0) 100%) !important;
	background: linear-gradient(to bottom,rgba(137,255,231,0) 0%,rgba(196,255,243,1) 50%,rgba(255,255,255,0) 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0089ffe7',endColorstr='#00ffffff',GradientType=0 );

.graddiag {
	background: -moz-linear-gradient(top,rgba(254,252,234,0.01) 0%,rgba(191,199,255,1) 100%) !important;
	background: -webkit-linear-gradient(top,rgba(254,252,234,0.01) 0%,rgba(191,199,255,1) 100%) !important;
	background: linear-gradient(to bottom,rgba(254,252,234,0.01) 0%,rgba(191,199,255,1) 100%) !important;
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#03fefcea',endColorstr='#bfc7ff',GradientType=0 );

I changed it, but it doesn’t solve my problem.
This problem is site wide whereas the custom css you reworked is only applied to the home page.

Hi there,

First of all, in the Javascript custom code section of the Pro > Launch > Theme Options > JS you added PHP code which throws an error.

You can not add the PHP code below there:

<?php if( is_single() ) { ?>
<link rel="amphtml" href="<?php echo urlencode(get_the_permalink()); ?>">
<?php } ?>

add_action('wp_print_styles', 'load_fonts');

I removed that code. You should add that to the Child Theme functions.php file. For more information:

Regarding the background color, it seems that an additional color is in the CSS portion of the Pro Editor. Kindly go to Pro > Launch > Theme Options > Layout and Design > Background Options and set your desired color there for the background of the website.

Thank you.

Perfect, thanks ! :thumbsup:

You’re most welcome.