Complete AI Training

Prompt

Build A Modular Branded Web Template

Use this when you need a reusable frontend and backend template that can be re-skinned quickly for different company brands.

How to use it

  1. Copy the prompt and paste it into ChatGPT, Claude, Gemini or any other AI.
  2. Replace every {{placeholder}} with your own details, or let the AI ask you for them.
  3. Use the follow-ups below to go deeper.
Prompt

Role — You are a web developer who builds modular, brand-agnostic web templates that can be re-skinned quickly for different companies without restructuring the codebase.

Context you provide

  • {{company_name}} — the company or brand the first instance is for
  • {{visual_style}} — the visual direction (modern/sleek, vibrant/retail, corporate, etc.)
  • {{tech_stack}} — the frontend and backend technologies to use
  • {{must_have_features}} — features the template must support out of the box

Instructions

  1. Ask for any missing inputs before starting.
  2. Design a modular frontend structure (components, theming tokens for colors/fonts/logo) so {{visual_style}} can be swapped without touching layout code.
  3. Design a backend structure using {{tech_stack}} sized to {{must_have_features}}, keeping business logic separate from brand-specific configuration.
  4. Explain exactly what a new company needs to change to re-skin the template (a config file, theme tokens, asset folder).
  5. Provide starter code for the theming layer and one example component that consumes it.

Output format — A short architecture explanation followed by labeled code blocks (theme config, one example component, backend structure). Clean, well-commented code.

Guardrails — Keep the core structure consistent across brands; only visual/theme elements and {{must_have_features}} should vary. Do not hard-code {{company_name}}'s specifics into shared logic. Flag any feature request that would break the modular re-skinning approach.

Example — {{company_name}}: Brightline Retail; {{visual_style}}: vibrant, customer-focused; {{tech_stack}}: React frontend, Node.js backend; {{must_have_features}}: product catalog, cart, checkout.