About Layered Configurator
Turn product choices into quote requests.
Layered Product Configurator turns reusable transparent image layers into an interactive product experience. Visitors can choose finishes, swap parts, add extras and see their product and price estimate update together.
Make every option easy to see
Show customers exactly what they are choosing. Change a finish and the product changes. Select a different part and the matching layer appears. Add an extra and the preview, estimate and summary update together.
Build with reusable layers
Upload your base image and aligned transparent option layers, then connect them to your product choices through Framer's property panel.
Keep product details in Framer
Set product names, option groups, labels, images, defaults, base prices and option prices directly through the component's controls.
Help buyers create the right product
Guide customers through compatible choices with simple option rules. Keep their selected configuration, product preview and estimated total connected as they explore.
Built for desktop and touch
Give your product room to shine on desktop and keep options easy to use on smaller screens. Clear controls, visible selections and an accessible configuration summary help visitors move confidently towards an enquiry.
Make it fit your project
Adjust colours, typography, option styles, labels, spacing and corner radii from Framer's property panel.
Included
Layered product preview with reusable transparent images
Native Framer product and option controls
Swatch and thumbnail choices
Required selections and optional extras
Option compatibility rules
Live price estimates and configuration summary
Native Framer form connection helper
Shareable configuration links
Copyable product specifications
Responsive layouts and keyboard controls
Three complete examples with original layered assets
Setup guide and editable source
$39 once. Lifetime use for one licensed website. No external tools, API keys or monthly component fees.
