Adjust your Uscreen storefront’s colors to match your brand identity and maintain a unified design across all pages.
Color Customization Options
Brand Color
Your storefront's primary (brand) color will be used across your site's common pages, including:
Content pages
Account pages
Checkout pages
Call-to-action links
Buttons
Highlighted text
Navigate to Website
Under Branding, select Brand Color
Enter the hex code or pick a color of your choice
Click Save & Apply
ℹ️ INFO: If there are any issues with the contrast of your brand color, Uscreen will notify you with a warning message.
Color Scheme
The color scheme setting affects the overall appearance of your common pages, toggling between:
Light mode (light background with dark text)
Dark mode (dark background with light text)
This setting applies to your Home, Catalog, Custom, account, and checkout pages.
Navigate to Website
Under Branding, select Brand Color
Toggle Light or Dark
Click Save & Apply
Custom Scheme Color
In addition to the standard color scheme options (Light or Dark), you can further customize your site's appearance with the Custom Scheme Color option. This allows you to define a more personalized color palette for your website.
💡 TIP: The Custom Scheme Color works alongside your Brand Color and Color Scheme selection to create a more tailored look for your storefront.
Color Contrast Considerations
When choosing colors, ensure good contrast for readability and accessibility. Colors that contrast well make text and elements stand out, improving the overall user experience.
Light Color Scheme
When you choose the Light scheme, the pages affected by this scheme will display like the following:
Dark Color Scheme
When you choose the Dark scheme, the pages affected by this scheme will display like the following:
ℹ️ INFO: The Custom Scheme Color is dynamically updated based on your selections.
For example, if you pick the Dark Color Scheme, it will try to select a brighter color for text as contrast, and it will dynamically update depending on the Custom Scheme Color you choose to maintain good contrast.
Mobile and TV Apps Color Settings
App colors are managed separately from your website colors. Apps use accent colors.
🔗 Learn more about Accent Colors
📝 NOTE: Changes to app colors require an app update.
Advanced Color Customization with CSS
If you need more specific color customizations, you can use CSS through the Code Snippets feature.
🔗 Learn more about Code Snippets
💡 TIP: To view what each color scheme looks like on your site, view your storefront and browse through its pages.