Skip to main content

Section Library

30+ section types with 92+ variants. Add any to your site when building with AI.

Hero Section

Eye-catching introduction at the top of the page. Sets the tone and communicates the main value proposition.

Centered HeroSplit HeroMinimal HeroBold HeroVideo HeroGradient HeroCompact Hero

Best for: homepage, landing pages, service pages

Features Section

Showcase key features, services, or benefits. Explains what you offer and why it matters.

Grid LayoutAlternating LayoutFeature CardsIcon-Based FeaturesBento Grid

Best for: homepage, service pages, product pages

Testimonials Section

Display customer reviews and feedback. Builds trust and social proof.

Testimonial GridTestimonial CarouselFeatured Testimonial

Best for: homepage, landing pages, service pages

Pricing Section

Display pricing plans and packages. Helps visitors understand costs and choose the right option.

Pricing CardsPricing TableFeature Comparison

Best for: pricing pages, service pages, subscription products, packages

Call-to-Action Section

Prompt visitors to take action. Converts browsing into engagement.

Centered CTASplit CTABanner CTAMinimal CTA

Best for: end of pages, middle of long pages, after key sections

FAQ Section

Answer common questions. Reduces support burden and builds confidence.

Accordion FAQTwo-Column FAQSimple FAQCompact FAQ

Best for: homepage, support pages, product pages

Contact Section

Help visitors get in touch. Essential for lead generation and customer service.

Form OnlySplit ContactContact with Map

Best for: contact pages, end of service pages, homepage

Gallery Section

Showcase images and visual work. Perfect for portfolios, products, or spaces.

Grid GalleryMasonry GalleryGallery Carousel

Best for: portfolio pages, product pages, about pages

Team Section

Introduce your team members. Humanizes your business and builds trust.

Team GridTeam CardsMinimal Team

Best for: about pages, homepage, company pages

Booking & Appointments

Let visitors book appointments or services. Shows available services, date/time picker, and booking form.

Calendar ViewInline FormService Cards

Best for: clinics, salons, consultants, service pages, homepage

Custom Block

Custom HTML block for experts. Use for embeds, special layouts, or markup not covered by other sections. HTML is sanitized (no script, iframe).

Custom HTML Block

Best for: embeds, custom layouts, third-party widgets, expert users

Cost Estimator

Interactive cost estimate. Visitors select services, see instant total, CTA to contact/form.

Service CardsInline List

Best for: consultants, agencies, contractors, service businesses, homepage, services page

Product Showcase

Displays products from the e-commerce module. Grid, featured, catalog, or industry catalog with attributes.

Featured ProductsProduct GridFull CatalogIndustry Catalog

Best for: shop, homepage, product pages, e-commerce, travel packages

Catalog Table

Tabular display of products with industry attributes. Shows hotel × price matrix in rows. Best for travel agencies.

Price Table

Best for: travel packages, tour comparison, price lists

Stats / Numbers

Displays key statistics, metrics, or achievements with animated counters.

Stats GridAnimated CountersMinimal Stats

Best for: homepage, about page, social proof, credibility

Newsletter Signup

Email capture form to grow a subscriber list.

PopupBannerInline

Best for: homepage, blog, footer area, lead generation

Logo Cloud / Partners

Displays a row of brand logos — clients, partners, press mentions, or certifications.

Scrolling MarqueeLogo Grid

Best for: homepage, about page, social proof, partnerships

Timeline / Process Steps

Shows a sequence of steps, milestones, or a company history timeline.

Vertical StepsAlternating Timeline

Best for: about page, process explanation, company history, onboarding steps

Section Divider

Decorative divider between page sections — wave, diagonal, or curve shape.

Wave DividerDiagonal DividerCurve Divider

Best for: between any two sections, visual separation, transition

Before / After Slider

Interactive slider revealing a before and after image comparison. Great for transformations.

Comparison Slider

Best for: renovation, beauty, fitness, cleaning, design services

Business Hours & Map

Displays opening hours and/or an embedded map with business location.

Hours CardSplit with MapFull Map

Best for: restaurant, clinic, salon, retail store, contact page

Video Section

Displays a video — hero background, embedded player, or gallery of videos.

Video HeroEmbedded VideoVideo Gallery

Best for: homepage, product demo, testimonials, media, about page

Countdown Timer

Ticking countdown to a launch date, event, or sale end. Creates urgency.

Launch CountdownEvent CountdownSale Countdown

Best for: product launch, event promotion, limited-time offer, coming soon

Events

Displays upcoming events from the events module — cards, calendar, or countdown.

Event CardsCalendar ViewNext Event Countdown

Best for: events business, community, entertainment, education, concerts

Blog Posts

Displays blog posts from the blog module — latest posts, featured, or category grid.

Latest PostsFeatured PostBy Category

Best for: homepage, news, insights, content marketing

Customer Reviews

Displays customer reviews and ratings from the reviews module.

Reviews ListFeatured ReviewsRating Summary

Best for: social proof, trust building, homepage, product pages

Photo Gallery (Module)

Displays photo albums from the gallery module — albums view, lightbox, or slider.

Albums GridLightbox GalleryPhoto Slider

Best for: photography, portfolio, events, hospitality, real estate

Contact / Inquiry Form

Embeds a custom form from the forms module — inquiry, contact, or feedback.

Service InquiryContact FormFeedback Form

Best for: contact page, lead generation, customer feedback, service inquiry

Restaurant Menu

Displays the restaurant/café menu from the menu module.

Menu GridMenu ListCategorized MenuTabbed Menu

Best for: restaurant, café, bar, food truck, bakery

Online Ordering

Enables customers to place food/product orders directly on the site.

Quick OrderMenu OrderOrder + CartOrder + Cart (EU)

Best for: restaurant, takeaway, delivery, café, food ordering

Ready to use these sections?

Sign up and build your site with AI. Add any section from this library as you chat.

Start Building