Waiting
Customize and export code (opens in a new tab)Compare designs
Each model builds its own version. Pick your favorite and customize it.
Desktop preview
See how each design looks on a full-width desktop screen. Mobile preview
Check how each design adapts to a small phone screen.
See how each design looks on a full-width desktop screen. Mobile preview
Check how each design adapts to a small phone screen.
How to create best pricing components?
Provide the actual plan details. List plan names, prices, billing periods, and the features that distinguish them. Include any free tier, usage limits, or highlighted plan only when those details match your offer.
Make comparisons straightforward. Tell the AI which differences help customers choose and provide a clear action for each plan. Specify how optional monthly and annual pricing should be presented.
Check every price and limit. Compare the plans side by side and stacked on mobile. Verify labels, feature alignment, and billing explanations so the design does not obscure important differences.
Examples of pricing components
Metis
Three-Tier Pricing Section with Highlighted Middle Plan
A pricing section with a centered heading and three side-by-side plan cards (Beginner, Intermediate, Professional) showing monthly prices, feature checklists, and Start Free Trial and Purchase buttons. The middle Intermediate card is highlighted with a solid blue background to emphasize it.
Vista
Custom Pricing Section with Monthly/Yearly Toggle and Contractor Slider
A dark pricing section headed 'One pricing plan for you' with a partner logo strip above a single 'Custom' pricing card. The card includes a monthly/yearly billing toggle, a contractor-count slider setting the $9/month price, a primary 'Get started' button, and a feature list of invoicing, payments, reminders, and reports.
Bendis
Three-Tier Pricing Section with Highlighted Pro Plan
A pricing section with a centered heading, supporting text, and a Active demo / Normal Tab toggle above three plan cards (Starter, Pro, Premium), each showing a large price per month, a feature checklist, and a Try It Now button. The Pro card is visually emphasized with a brighter blue background and a yellow call-to-action button.
Uinel
Software Pricing Plans Section with Three Tiers
A marketing pricing section titled "Select software" with three side-by-side plan cards (Beginner, Students, Team), each showing a price, short description, and a purple Buy now button. The middle Students card is elevated and highlighted, and the Team card carries a TRIAL FREE badge.
Explore component generators
Generate any section of your website with the same multi-model workflow.
No categories match your search.
