Ecommerce UI kit: the price label each country asks for

For product designers and agencies building one store that sells into the UK, Germany, California, Japan, Australia and Canada. Type your own price, mandatory fee and VAT rate. Every label below updates.

Why the one-price card fails

Free ecommerce UI kits draw one price, “$40.00”, and add the fee at checkout. In the UK that drip pricing is banned since 6 April 2025 (Digital Markets, Competition and Consumers Act 2024), and the CMA can fine up to 10% of global turnover. California SB 478 has required every mandatory fee in the advertised price since 1 July 2024; tax and shipping may stay out. Germany wants the price incl. MwSt. and a note that delivery is added. Japan has required the tax-inclusive total since 1 April 2021.

How to get the kit into Figma

1. In Figma, drag the .sketch file onto the file browser. Figma imports .sketch files; Sketch users open the same file.
2. For one vector, open an .svg, copy it and paste it into Figma: it lands as an editable vector.
3. To rebuild the variant sets, import the plugin from manifest.json (Plugins › Development › Import plugin from manifest — menu names differ by Figma version and UI language). The .sketch keeps each variant as a named, colored shape; part of the component structure is simplified and the text labels come through the SVGs and the plugin.

A design file and a label calculator. It does not calculate tax in your store and is not legal advice. VAT rates differ by product — type the rate that applies to yours.