When a ready-made section isn’t quite right, you can build your own. Describe what you want: a tool visitors can use, a gallery, a form, or a layout. Durable generates a section you keep shaping until it feels like your brand.
Use Durable’s ready-made sections when they fit. Build your own when you want something more specific. If you can describe it, you can usually build it.
Build your own section
To build a section, open Website in the left menu and go to the page you want to update.
Click Add Section where you want the new section to appear.
In the section types bar, scroll until you see Custom, then select it. That’s how you start building your own instead of picking a ready-made type.
Describe what you want: content, layout, and vibe. Optionally upload an image (JPEG, PNG, or GIF) so AI can match the look and feel.
Click Create custom and watch the building animation as your section appears.
A reference image is optional, but it’s one of the fastest ways to get a layout that already feels on-brand. You can build more than one of these sections on the same page, so mix tools, galleries, motion, and promotional blocks until the page tells the full story.
Ideas to try
Start with the outcome you want for your visitor, then let AI handle the design. Copy a prompt, make it yours, and click Create custom.
A simple prompt can include what you want the section to do, how it should feel, and any details you want included: “Create a [type of section]. Visitors should [action]. Make it feel [mood/style]. Include [elements], and use [motion/reference image/CTA].” AI uses your business details, existing site-wide theme, and customizations as context, so the section feels connected to the rest of your site.
Think of these as creative directions, not templates. You can start with a practical goal like capturing leads, helping visitors estimate a price, or showing off your work. Then add motion, visuals, and interaction to make the section feel like yours.
Tools visitors can interact with
Quote calculator: “Build a quote calculator for my cleaning business. Visitors pick square footage with a slider, choose weekly or biweekly, and see the price update live.”
Party planner: “Create a planner that asks how many guests and how hungry they are, then shows how much food to order with a friendly summary.”
Membership tiers: “Design a spa membership section with three tiers, icons, and a monthly vs yearly toggle.”
Lead capture form: “Create a contact form for my landscaping business that asks what service they need, their timeline, and the best way to reach them. Make it feel friendly and easy to complete.”
Motion and visual storytelling
You can also describe how the section should move, like fading headers, fluid transitions, animated backgrounds, auto-sliding cards, or interactive sliders.
Story gallery: “Make a gallery of our space and food with small thumbnails that open larger photos, light motion, and links to related pages.”
Animated titles: “Create a hero section with headers that fade in smoothly, fluid motion between lines, and a soft animated background that feels premium.”
Interactive slider: “Build a before-and-after slider for my renovation business with smooth dragging, clear labels, and a polished reveal animation.”
Recognition wall: “Create a horizontal awards and press section with logos, short blurbs, and automated motion. Make it obvious you can scroll for more.”
Match a photo: Upload a mood board or screenshot, then prompt: “Match this vibe for my room rental business, keep my brand colors, and make the copy warm and inviting.”
Say who it’s for, what they should do, and how it should feel. Add ingredients like cards, sliders, icons, or CTAs, then refine with AI Edit.
Make it yours
Once it’s on the page, shape it until it feels right. Most sections you build are a conversation: generate, react, refine.
Edit content directly
Click any text to rewrite it in your voice.
Click images to replace them or generate new ones in AI Studio.
Nudge layout pieces: resize image areas, reorder items, and tidy spacing until it looks intentional.
Refine with AI Edit
Hover the section and click AI Edit, then ask for what you imagine:
“Make this a darker featured background”
“Try a different layout with more movement”
“Make the gallery thumbnails smaller”
“Copy the section above, but for bridal packages”
AI keeps your business, site-wide theme, and existing customizations in mind while it iterates, so you can explore boldly without starting over. Prefer AI Edit for bigger creative shifts (mood, layout, structure). Use direct edits when you already like the design and just need precise wording or image swaps.
Fine-tune interactive elements
When AI builds an interactive section (like a calculator, planner, slider, toggle, or guided tool), you can fine-tune how it works without starting from scratch.
Hover the section and click Edit Content.
Update the elements visitors interact with:
ID: the short name for that element. Formula fields use these IDs to calculate results, so choose names that are simple and easy to recognize, like guests, squareFeet, or packageType.
Label: the text people see, such as Guests or Square footage.
Type: how they input a value: slider, number, select (dropdown), or toggle.
Range controls: for sliders, set minimum, maximum, step, and default so the control feels right for your business.
Options: for dropdowns and radio buttons, add or remove choices, such as weekly vs biweekly or package names.
Formulas, in plain language
Some sections you build calculate a result from the inputs above. In Edit Content, you’ll see a Formula field: that’s the math behind the result.
Reference elements by their IDs, using the short names tied to each interactive field.
For example, if your section has elements with the IDs guests and hunger, the formula can reference both to calculate a recommended amount.
Use helpers like min, max, round, if, tier, and lookup when you need smarter logic.
Example: round(guests hunger 0.83, 1) multiplies guests by hunger, scales the result, then rounds to one decimal. Useful for “how much food?” style tools.
For the output, choose a format (number, currency, or percent) and how many decimal places to show.
Not sure where to start? Ask AI Edit to change the behavior in plain English first, such as “make the estimate a bit higher for rush jobs.” Jump into the formula only when you want precise control.
Shape what you built
Once you’ve built something you like, these are the details you can shape next.
Image galleries
Swap or regenerate photos, then link thumbnails to pages like menu, rooms, or services.
Ask for thumbnail grids that open larger images on click, great for spaces, food, and before/after work.
Add light motion: auto-play, next/previous controls, or a soft entrance animation so the gallery feels alive.
Calculators and planners
Lead with the visitor decision: “How much will this cost?” or “How much should I order?”
Keep inputs few and friendly: a slider plus one dropdown often beats a long form.
Polish labels and output format last, so the result reads like advice, not a spreadsheet.
Contact forms and lead generation
Make it easy for visitors to ask a question, book a consultation, or request a quote.
Ask for the details that help you qualify the lead, such as service type, budget, timeline, location, or preferred contact method.
Keep the form focused and approachable. A few clear questions usually convert better than a long intake form.
Match the call to action to the business goal, such as Request a quote, Book a free consultation, or Tell us about your project.
Cards, memberships, and recognition walls
Edit each card’s kicker, title, body, and image so the story stays sharp.
Reorder items to put your strongest offer or award first.
If the row scrolls sideways, make that obvious in your prompt: “show a hint that more cards are to the right.”
A simple way to work
Sketch with a prompt: describe the job and the feeling.
Optionally drop in a reference image: mood board, competitor vibe, or your own photo.
Generate with Create custom.
Remix with AI Edit: color, layout, motion, or “make another like this for X.”
Tighten by hand: edit copy, images, and familiar section elements just like you would in any other Durable section.
Duplicate the win: once one section lands, ask AI to copy it for another offer, location, or audience.
What's next
Treat every prompt like a sketch: try something bold, then refine. The more you build, the more your site feels like you. Build tools that help customers decide, and views that make your business feel alive.
For adding and rearranging ready-made types, see Working With Sections. If you already have embed code from another tool, use Add and Customize an Embed Section with Custom Code.