Variant pills
Variant pills are one way of displaying your product variants. Learn more
Variant pills allow you to display the variants of a product on a product page or a featured product section. Customers can select the desired variant to add the product to their cart.
Border settings
Customize the appearance of variant pills border:
| Setting | Description |
| Thickness | Use the slider to adjust thickness of border. The range is from 0px to 12px. |
| Opacity | You can increase or decrease visibility of border color to make it more expressive or less noticeable. |
| Corner radius | Use the slider to control the rounding of variant pills. You can adjust the radius to achieve the desired level of roundness or squareness, aligning them with your design vision. The range is from 0px to 40px. |
Shadow settings
The “Shadow settings” allows you to customize the appearance of shadows for variant pills on your website.
| Setting | Description |
| Opacity | This setting controls the transparency or darkness of the shadow. You can adjust it to make the shadow more or less prominent. |
| Horizontal offset | Horizontal offset determines how far the shadow extends horizontally from the element casting the shadow. A positive value will move the shadow to the right, while a negative value will move it to the left. |
| Vertical offset | Vertical offset determines how far the shadow extends vertically from the element. A positive value will move the shadow downwards, while a negative value will move it upwards. |
| Blur | The blur setting controls the sharpness or softness of the shadow's edges. |