Hello,
I noticed this space behind/beneath the footer is colored based on whatever my color scheme 1 is on the Origin theme(and Dawn derivatives).
How can I color it independently?
@PoW8 Can you share you store url,
do you liek to remove the extra space or change the color only…
There is no extra space. I’m just stretching the page to show you the area I’m talking about. I just want to change it’s color but I’m not sure how to find it’s selector or anything.
@PoW8 Hello,
In my Origin theme (same behavior as Dawn derivatives), I noticed that the space beneath the footer automatically picks up the color from my color-scheme-1.
Example (screenshot attached): you can see the footer ends, and the strip below it inherits the theme’s main background color.
I’d like to color this space independently of my footer and other sections.
Is there a way to do this with custom CSS or by adjusting the theme settings?
Thanks in advance!
Solution you can test
Go to Online Store > Themes > Customize > Theme settings > Custom CSS (or Edit Code > base.css) and add:
/* Target the extra strip below footer */
body::after {
content: "";
display: block;
background-color: #000000; /* Change this to your preferred color */
height: 40px; /* Adjust height as needed */
}
If the strip is part of the footer wrapper, you can try:
.footer + div {
background-color: #000000; /* your independent color */
}
Unfortunately this doesn’t work. It adds essentially a block of color without changing the white space specified. The white block on my screenshot isn’t there in the page’s natural resting position, I scrolled all the way down and past the bottom, holding it in place while taking the screenshot.
If you try to scroll past the bottom of the theme you will go past the footer and when you let go the screen will snap back in place. I want to be able to change the color of that “void” beyond the footer to whatever color I want.
@PoW8 That “void” is controlled by the browser’s background color of the or , not by the footer or any extra div.
The solution is to set the html and body background color to what you want that overscroll area to be:
html, body {
background-color: #000000; /* change this to your preferred color */
}
Notes:
This will make the “beyond-footer void” match your chosen color.
If your theme sections (like main background) are already using their own background colors, they will cover the body so the visible change is only when overscrolling past the page bottom.
Works consistently in most modern browsers (Safari, Chrome, Firefox) and on mobile (iOS/Android).
If you want the main page area to still be another color, you can keep the page wrapper a different background, and only let the html/body carry the “overscroll” color, like so:
html, body {
background-color: #000000; /* overscroll void color */
}
.page-width, .content-for-layout {
background-color: #ffffff; /* your main site background */
}
That way, your site looks the same but when you pull past the footer, the “void” flashes with your chosen independent color.
Sorry about that. The password is “teunti”.
Hi @PoW8 ,
You can fix it by following these two simple steps:
Step 1: Click on Customize (see screenshot)
Step 2: Add the following CSS code:
html {
background: #11151c !important;
}
to the Custom CSS section (screenshot), then save and check the result.
Let me know if this works for you or if you need further assistance 
Best,
Felix
Thank you. That was the selector I was looking for. The default for these themes are the background color for color scheme 1 so my first thought was to just use 1 for the html,body and 2 for the main theme color but other aspects take the color of 1 by default.
Thank you for reading my comment! If you find it helpful, I’d really appreciate a like. 
@PoW8 did you find the problem solved ?
Technically but it came with another problem. I’ll just forget about it considering it’s not the biggest deal. Just an aesthetic thing I wanted and was like going to have effect on site performance or conversion. Thanks for asking.
@PoW8 I understand sometimes small aesthetic adjustments can cause unexpected side effects, and it makes sense to prioritize performance and conversion first. That said, my team and I specialize in solving these kinds of design challenges without compromising functionality or site speed. If you’d like, I can take a closer look and suggest a clean solution that maintains both the look you want and the site’s performance.
Let me know if you’d like me to explore this further.
Best regards.
No thank you. I appreciate it however it’s probably best I learn to not pick at certain details too much.
Totally understand! 
Sometimes it’s easy to get caught up in the little details, but the reason I offered to help is because those “small” things can sometimes make a big difference down the road. I just wanted to save you time and give you peace of mind so you don’t have to stress over them. But you’re doing great, and I respect that you want to learn it yourself too!