Product Page
The North Commerce Component's styling are defined by a CSS & there is a few CSS variables you can adjust that will update all of the styling for the product page all at once.
Preview of the Product Page
All you need to do is update the #HEX code for each of these CSS variables to update the colors everywhere.
.nc-container {
--primary-font: "Poppins", "sans-serif";
--primary-theme-color: #FF5500;
--primary-font-color: #000000;
--subtext-font-color: #747E94;
--secondary-font-color: #ffffff;
--primary-border-color: #FF5500;
--primary-inactve-border-color: #EEF1FB;
--primary-error-color: #ff0051;
--error-font-size: 14px;
--swatch-border-color: #f0f0f0;
--disabled-qty: #F5F5F5;
--disabled-add-to-cart: #d3d4d5;
--primary-input-border-color: #E5EBF1;
--swatch-background-color: #ADD8E6;
}
Last modified 2mo ago