Single Product Alpha
overview
Available for:
Figma
Bricks
Gutenberg
Overview
Variables
This frame uses the following locally scoped variables to make it easier for you to edit the style or behavior of this frame. Variables can be viewed or edited from the CSS tab.
--img-gallery-ratio
Set the aspect ratio of the Product Image
--img-gallery-radius
Border Radius for all Images in the Gallery
--product-gap
Adjust spacing consistently throughout
--price-color
Change the color of the price
--canceled-price-color
Change the color of the canceled price
--price-font-size
Edit the font-size of all prices (Price + Variation Price)
--variation-label-color
Change the color of the variation label
--variation-span
Width of the variations content column
--border-color
Changes the color of all borders
--border-width
Changes the width of all borders
--quantity-width
Change the width of the quantity field
--select-width
Change the width of the variation selection
--button-color
Edit the button background color
--button-color-hover
Edit the button background hover color
--button-text
Edit the button text color
--button-text-hover
Edit the button text hover color
--review-avatar-size
--review-avatar-radius
HTML5 Tags & Attributes
Accessibility Notes
No additional accessibility notes for this frame.
Related Frames
FAQs
Use the related frames section above to check FAQs for other frames related to this frame if you don't see your question here.