SaaS landing page
A software landing page has one job, to turn a visit into a trial. The order below follows the questions a visitor asks on the way down, what is it, who uses it, what does it do, what does it cost and is it safe to try.
The order
Top to bottom, the way the sections sit on the finished page.
Step 2 / 10 · Hero
Hero
The promise in one line and a screenshot of the product, so the first screen already shows what people get.
The first screen of a page in sixteen layouts, from a centered statement to video, app, tabs, form and terminal.
Step 3 / 10 · Logo clouds
Logo cloud
Known customers right under the hero answer the quiet question whether others already trust it.
Customers and partners at a glance, in eight layouts from a quiet row to a running marquee and a dark band.
Step 4 / 10 · Features
Features
Three to six features with real outcomes turn the promise into something people can check.
What a product or service offers, in fifteen layouts: grids, cards, rows, tabs, four bento layouts, steps and a before and after.
Step 5 / 10 · Product tour
Product tour
A guided look at the product in use replaces a demo call for most visitors.
A guided walk through a product, in six layouts: steps with a changing screen, a scroll story, hotspots on a screen, a carousel, film chapters and an in-app tour with spotlight.
Step 6 / 10 · Pricing
Pricing
Clear plans with a highlighted favorite, placed after the value has been shown.
Plans, tiers, calculators and price lists, formatted in the visitor’s language.
Step 7 / 10 · Testimonials
Testimonials
Quotes with name and role right after the price meet doubt where it starts.
Quotes, reviews, ratings, videos and posts from the people who use it.
Step 8 / 10 · FAQ
FAQ
Answers on contracts, data and support remove the last reasons to wait.
Frequent questions as native accordions, grids, tabs and a search, with optional FAQPage data.
Step 9 / 10 · Free trial
Free trial
The closing invitation repeats the offer with what the trial includes.
Starting a trial with nothing left unclear. The form with the steps that follow, the trial days on a track, a plan with the date of the first charge, three ways to start and a window that takes the team name as it is typed.
Install all of it at once
One command puts every component of this collection into your project.
aiw add @ai-website/navbar @ai-website/hero @ai-website/logos @ai-website/features @ai-website/product-tour @ai-website/pricing @ai-website/testimonials @ai-website/faq @ai-website/free-trial @ai-website/footerPrompt for your AI assistant
Hand Claude, Cursor, Copilot or Codex the order and it builds the page from exactly these parts.
Build a SaaS landing page with the UI Kit. Use Navbar, Hero, Logo cloud, Features, Product tour, Pricing, Testimonials, FAQ, Free trial and Footer in this order. Write real copy for my offer and check the page in light and dark.More collections
- Local businessCafé, shop or trade around the corner
- Medical practiceTrust, hours and the next free slot
- Online shopFrom the shelf to the order
- PortfolioWork first, then the person behind it
- Blog or magazineFront page, reading and coming back
- EventProgram, tickets and the countdown
- App dashboardThe frame and the screens inside it
- AI productWhat the AI does, shown honestly
- Creator pageOne person, their work and their audience