<!-- SPDX-License-Identifier: MIT -->
<!-- SPDX-FileCopyrightText: 2025-2026 Marcus Quinn -->

# Startup Bold — Agent Prompt Guide

Design tokens: see `02-colours.md`, `03-typography.md`, `05-layout.md`.

## Ready-to-Use Prompts

**Prompt 1 — SaaS landing hero:**

> Build a hero section on #ffffff. Left side: 13px uppercase overline #6b7280 with 0.06em tracking, 64px Plus Jakarta Sans 800 heading #111827 with -0.035em tracking, 18px body #6b7280 1.65 line-height (max 480px), two buttons — primary #4f46e5 pill 12px radius and secondary white with 2px #4f46e5 border. Right side: product screenshot in a card with 16px radius and 0 8px 32px rgba(0,0,0,0.1) shadow. Below hero: logo bar on #f9fafb — "Trusted by" in 13px #9ca3af, 5 greyscale logos.

**Prompt 2 — Pricing cards:**

> Create a 3-column pricing grid on #f9fafb section. Cards: #ffffff, 16px radius, 1px #e5e7eb border. Each: plan name 18px/600, price 48px/800 #111827, period 16px/400 #6b7280, feature list with #10b981 checkmarks. Middle card (recommended): 2px #4f46e5 border, "Most Popular" badge in #e0e7ff/#4f46e5 at top. CTA buttons: recommended card gets #4f46e5 primary fill, others get secondary outline. Hover: translateY(-2px) with medium shadow.

**Prompt 3 — Feature grid:**

> Design a 3-column feature grid on #ffffff. Section title: 36px Plus Jakarta Sans 700 #111827 centred, 16px subtitle #6b7280. Feature cards: no border, 28px padding. Each: 48px icon container with #e0e7ff background and #4f46e5 icon, 22px/600 title, 16px/400 #6b7280 description. Hover: background shifts to #f9fafb with 200ms ease-out. 32px gap between cards.

**Prompt 4 — CTA banner:**

> Build a full-width CTA section on #4f46e5 background. Centred content, max-width 640px. Heading: 36px Plus Jakarta Sans 700 #ffffff. Subtext: 16px #e0e7ff. Two buttons: white fill (#ffffff bg, #4f46e5 text) as primary, white outline (transparent bg, 2px #ffffff border, #ffffff text) as secondary. Both 12px radius. 80px vertical padding. Subtle pattern or gradient overlay optional.

<!--
Style archetype by AI DevOps (https://aidevops.sh)
DESIGN.md format: https://stitch.withgoogle.com/docs/design-md/overview
Not based on any specific brand. Use as a starting point for your project.
-->
