How to use Hex color for Swatch filter option

By default, you need to upload each image which is corresponding with each filter option value (as instructed in this guide). If you are familiar with CSS, you can use Hex color to display the Swatches.


Instruction

1
Go to the  bc-sf-filter.scss.liquid file.
2
Add each style for each filter option value. For example: with the color "Jet Black", the code will look like:
.bc-sf-filter-option-swatch a[data-value="Jet Black"] span.bc-sf-filter-option-swatch-image {background-color: #111111 !important;}
Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.

Still need help? Contact Us Contact Us