Custom Stacks

Custom Stacks let you define your own AI build templates. If your agency has a specific coding style, preferred framework, or a client type you build for repeatedly, custom stacks save you from writing the same instructions over and over.

What Custom Stacks Do

When you create a custom stack, you're writing a system prompt — a set of instructions that the AI follows every time that stack is selected. This prompt tells the AI:

• What code structure to use
• What design patterns to follow
• What sections or features to include by default
• What tone or style to apply to content
• Any rules or constraints to follow

Think of it as training the AI to build the way your agency builds.

Creating a Custom Stack

1. Go to Settings → Build Stacks — You'll see a list of the default stacks plus any custom stacks you've already created.
2. Click "Create Custom Stack" — This opens the custom stack editor.
3. Name Your Stack — Give it a clear, descriptive name. Examples: "Agency Portfolio," "SaaS Landing Page," "Medical Practice."
4. Write Your System Prompt — This is the core of your custom stack. Write detailed instructions for the AI. The more specific you are, the better the output.
5. Save — Your custom stack now appears in the stack selector in the Builder.

Writing an Effective System Prompt

A good custom stack prompt is specific and structured. Here's what to include:

Code Framework & Structure Tell the AI exactly what code to produce. Example: "Generate a static HTML site using Tailwind CSS. Use semantic HTML5 elements. Include a responsive navbar with mobile hamburger menu."

Design Direction Describe the visual approach. Example: "Use a dark color scheme with a navy (#1a1a2e) background. Typography should be modern — use Inter for body text and Playfair Display for headings."

Required Sections List the sections every site built with this stack should include. Example: "Always include: hero with background image, services grid (3 columns), testimonials carousel, team section, contact form, footer with social links."

Content Tone Guide the AI on how to write copy. Example: "Write in a professional but approachable tone. Avoid jargon. Use short paragraphs and bullet points for scannability."

Technical Requirements Specify any technical details. Example: "Include Schema.org structured data for local business. Add OpenGraph meta tags. Ensure all images have alt text. Target a Lighthouse performance score of 90+."

Example Custom Stack Prompts

"Dental Practice" Stack:

Build a professional dental practice website using HTML and Tailwind CSS. Include: hero section with smiling patient photo and "Book Appointment" CTA, services grid (general dentistry, cosmetic, orthodontics, emergency), about the practice section with doctor profiles, patient testimonials, insurance accepted section, contact with map. Use a clean white/blue color scheme. Tone should be warm and reassuring.

"SaaS Product" Stack:

Build a SaaS product landing page using HTML and Tailwind CSS. Include: hero with product screenshot and signup CTA, feature grid with icons, how-it-works steps, pricing table (3 tiers), testimonials from business users, FAQ accordion, footer with product links. Use a modern dark theme. Tone should be confident and benefit-focused. Include animations on scroll.

Managing Custom Stacks

• Edit — Click any custom stack to update its name or system prompt.
• Delete — Remove stacks you no longer use. This doesn't affect sites already built with that stack.
• Duplicate — Copy an existing stack as a starting point for a new one. Great for creating variations (e.g., "Contractor - Plumber" and "Contractor - Electrician").

Tips

• Start with a default stack and customize — If a default stack is close to what you want, note what it does well and write your custom prompt to expand on it.
• Test and iterate — Build a test site with your custom stack, see the output, then refine the prompt. It usually takes 2–3 rounds to get the prompt dialed in.
• Share with your team — Custom stacks are available to all team members on your account. Create stacks for your agency's most common project types so anyone on the team can produce consistent results.
• Be specific about what you DON'T want — If there are patterns or elements you want the AI to avoid, say so explicitly. Example: "Do not use stock photo placeholder URLs. Do not include Lorem Ipsum text."