Overview
By default, the carousel arrows in Upcart’s upsell section are black. If your upsell background is dark, the arrows may be difficult to see. You can fix this by changing the arrow color with a simple CSS update.
Where to find the custom CSS editor
Go to Upcart > Cart Editor > Settings > Custom CSS
Scroll down to the input field and paste your CSS code
Click Save
Refresh your storefront to preview the changes
Example CSS to change the arrow color
.styles_PreviewCarousel__ [class~='control-next']::before, .styles_PreviewCarousel__ [class~='control-prev']::before { border-color: white !important; }This changes both the next and previous carousel arrows to white.
How to customize
You can update border-color to match your brand’s palette. Use any valid color format:
Named colors (example:
black,white,red)Hex codes (example:
#ffffff)RGB values (example:
rgb(255, 255, 255))
Example:
border-color: #00bcd4 !important;
This ensures your upsell navigation arrows remain visible against any background color.