What are CSS Customizations & Custom Module Builder?
FERMÀT now gives you two powerful AI-driven tools inside the funnel editor to customize your storefronts without writing code — and without waiting on a developer.
Edit with AI (CSS Customizations) lets you modify the visual styling of any existing module by describing what you want in plain language. Pierre iterates with you in real time until it looks exactly right — whether you're adjusting spacing, colors, typography, or layout details.
Custom Module Builder goes further: instead of modifying an existing module, you can describe an entirely new one from scratch. A dynamic product comparison table, a loyalty points display, a quiz-to-recommendation flow, a bundle builder with your exact brand logic — describe it to Pierre and it builds it for you. Once saved, the module is available to reuse across every funnel in your org.
Together, these two capabilities remove the bottleneck between your team's ideas and your live shopping experience.
How to Use Edit with AI (CSS Customizations)
Open any funnel in the FERMÀT funnel editor.
Click on the module you want to customize to select it.
In the module editor panel, click the "Edit with AI" tab.
Describe the visual change you want in plain language (e.g., "make the headline font larger and change the button color to forest green").
Pierre will apply the changes and show you a live preview.
Continue iterating with follow-up prompts until the module looks exactly right.
Click Save to apply the changes to your funnel.
How to Build a Custom Module
Open any funnel in the FERMÀT funnel editor.
Click the Pierre chat panel on the right side of the editor.
Click "Build Custom Module" (or describe the module you want directly in the chat).
Describe the module in plain language — be as specific as you'd like about layout, logic, and content (e.g., "Build a side-by-side product comparison module with three columns, showing price, key specs, and an Add to Cart button for each").
Pierre builds the module and displays a live preview.
Review the output. Note: Custom module iteration is coming soon — for now, this is a one-shot build. If the first result isn't quite right, try rephrasing your prompt with more detail.
Click Save Module to add it to your org's module library.
The saved module is now available to drag and drop into any funnel across your organization.
Where It Works
Surface | Edit with AI | Custom Module Builder |
Lander / Slug pages | ✅ | ✅ |
Product Funnels (PDP) | ✅ | ✅ |
Bundle / BDP pages | ✅ | ✅ |
DPP Templates | ✅ | ✅ |
Shop previews | ✅ | ✅ |
Both tools are accessible directly within the funnel editor and apply to all routes and surface types.
Use Cases
Seasonal campaign styling without a dev ticket. Your team wants to run a holiday campaign with a custom color palette and a festive banner module — but your dev team is heads-down on a platform migration. Use Edit with AI to restyle existing modules and Custom Module Builder to create a countdown timer or gift-guide grid. Ship the campaign on your schedule, not the dev queue's.
Brand-specific product comparison logic. You sell a product line with complex attributes (fit, material, use case) that your standard product grid doesn't display well. Build a custom comparison table with exactly the columns you need, your brand typography, and an Add to Cart button per variant — all in one prompt. Save it and reuse it across every collection page.
Loyalty and membership displays. Build a custom module that dynamically surfaces a shopper's points balance, tier status, or rewards eligibility — without custom dev work. Describe the module once, save it, and add it to any funnel.
Iterating on visual design in real time. Your design team has specific opinions about button radius, line height, and padding that don't match your default module styles. Instead of filing CSS tickets and waiting for QA cycles, use Edit with AI to get to the exact look in minutes — with a live preview at every step.
FAQs
Can I edit a custom module after I've saved it?
Full iteration on saved custom modules is coming soon. For now, if you want to adjust a module you've already built, you can rebuild it with a refined prompt or use Edit with AI to adjust the CSS styling after it's placed in a funnel.
Where do my saved custom modules live?
Saved modules are added to your organization's module library and are available to any member of your team. You'll see them appear as an option when adding a module to any funnel across your org.
Does Custom Module Builder work for all types of modules?
Pierre can build most standard module types — grids, banners, comparison tables, quiz flows, loyalty displays, countdown timers, and more. If a prompt doesn't produce the result you expect, try adding more specificity about layout, content, and logic.
Is Edit with AI the same as the AI CSS editor in the module settings?
Yes — Edit with AI is the name for the AI-powered CSS customization tab inside the module editor. It's different from Custom Module Builder, which creates a net-new module from scratch via the Pierre chat panel.
Do custom modules affect page performance?
Custom modules are built to the same performance standards as FERMÀT's native modules. If you notice any unexpected behavior, send feedback to the #dev-storefront channel and the team will take a look.