Custom CSS

For pixel-perfect control beyond the visual settings, OPTIS gives you a Custom CSS box. Anything you add here is applied to the swatches on your storefront.

When to use it

• Match swatch styling exactly to your theme.

• Adjust spacing, borders, or hover effects the settings don't cover.

• Fine-tune how swatches look on a specific page.

How to add it

1. Open Global settings and find the Custom CSS field.

2. Paste your CSS rules.

3. Save, then refresh your storefront to see the change.

Test on a draft theme first. Custom CSS is powerful - a broad rule can affect more than you expect. Preview on a draft theme before applying to your live store.

Not comfortable writing CSS? Our support team can help with custom styling when possible - reach us via live chat in the app or [e-mail].