Gallery Pricing Sections
20 curated pricing section screenshots from Land-book Pro, tagged by pattern type and persona lean.…
$ aoe install @community/example-gallery-pricing-sectionsProjection
Always in _index.xml · the agent never has to ask for this.
PricingSectionGallery [example] v1.0.0
20 curated pricing section screenshots from Land-book Pro, tagged by pattern type and persona lean. The pricing section is the most analytically loaded section on a landing page: it must communicate value tiers, justify cost, reduce anxiety, and drive conversion — often to a single highlighted action. Pricing design is tightly coupled to business model, buyer persona, and brand register.
Loaded when retrieval picks the atom as adjacent / supporting.
PricingSectionGallery [example] v1.0.0
20 curated pricing section screenshots from Land-book Pro, tagged by pattern type and persona lean. The pricing section is the most analytically loaded section on a landing page: it must communicate value tiers, justify cost, reduce anxiety, and drive conversion — often to a single highlighted action. Pricing design is tightly coupled to business model, buyer persona, and brand register.
Meta
- License: Apache-2.0
- License Provenance: package-authorship-claim
Observations
- The 3-tier card grid is the dominant SaaS convention — and it signals trust. The majority of SaaS products in this gallery (base44, claudeai, durable, sprout, rideaway, ambrook) use a 3-column card layout with a center or right tier visually highlighted as 'recommended.' This is a convention strong enough that departing from it requires conscious justification. The convention works because it mirrors the buyer's mental model: 'free / starter / pro' or 'basic / growth / enterprise.'
- Dark-background pricing clusters around developer and fintech products. Cypher, codegen, spread, jace-ai, and sendrai all use dark or dark-adjacent backgrounds on pricing. This is consistent with the hero gallery pattern: dark = technical/infrastructure/financial. It also creates contrast that makes glowing accent cards (the 'recommended' tier) more dramatic.
- Non-SaaS products break the tier-card mold intentionally. Offcoustic (hardware) uses a specs/configuration matrix. Good-fella (agency) uses a project/retainer model. Titan (wealth management) surfaces a single premium tier with minimal comparison. Polar (open-source) leads with a percentage-fee transparency model. These breaks are intentional and aligned to the actual purchase decision the buyer is making.
- Usage-based pricing gets special visual treatment. Codegen, sendrai, and polar all have usage/volume as the primary axis. Visually they tend toward simpler layouts (fewer columns) with clear 'how pricing works' explanatory copy — because the cognitive model is different from tiered plans.
- Feature checklists vs. outcome language split along persona lines. B2B SaaS targeting technical or operational buyers (rideaway, codegen, claudeai) uses dense feature checklists. B2C and professional services (claimable, rhetorich, titan) use outcome/benefit language instead. The choice is as much about the buyer's vocabulary as design aesthetics.
Items
- File: ambrook.webp
- Pattern: 3-tier card grid + feature comparison rows + agri-sector color
- Persona Lean:
- warm-institutional
- swiss-modernist
- Notes: Earthy green palette; clear tier differentiation; farm/agri brand
- File: base39.webp
- Pattern: minimal 2-tier + large price numerals + clean whitespace
- Persona Lean:
- tokyo-minimal
- swiss-modernist
- Notes: Very restrained; price number is the typographic hero
- File: build-apps-with-ai-in-minutes--base44.webp
- Pattern: toggle monthly/annual + 3 tiers + highlighted recommended tier
- Persona Lean:
- warm-institutional
- dense-pragmatist
- Notes: Standard SaaS pricing layout; recommended tier uses brand color ring
- File: claimable--easily-appeal-denied-health-claims.webp
- Pattern: single prominent tier + outcome-framing copy + health sector
- Persona Lean:
- warm-institutional
- editorial
- Notes: Avoids comparison grid; focuses on value delivery promise
- File: claudeai.webp
- Pattern: clean 3-tier + free + pro + enterprise + feature list
- Persona Lean:
- swiss-modernist
- dense-pragmatist
- Notes: Anthropic brand; neutral palette; dense feature checklist rows
- File: codegen--the-os-for-code-agents.webp
- Pattern: usage-based pricing + developer-facing copy + code-adjacent aesthetic
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Credits/usage model framing; dark SaaS tone; dev-tool positioning
- File: cypher.webp
- Pattern: dark bg pricing + glowing accent card + crypto/web3 palette
- Persona Lean:
- brutalist-expressive
- dense-pragmatist
- Notes: Neon accent on highlighted tier; dark-mode-first; web3 brand energy
- File: durable-ai-website-builder-and-small-business-software.webp
- Pattern: 3 tiers + icon feature list + SMB-friendly copy + bright CTA
- Persona Lean:
- warm-institutional
- Notes: Bright colors; simplified language; targets non-technical users
- File: exactlyai--train-ai-to-replicate-your-brand-style.webp
- Pattern: 2-tier comparison + visual feature matrix + AI-brand palette
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Visual/image-centric feature callouts to match AI image product
- File: gogetta.webp
- Pattern: illustrated pricing + mascot presence + friendly tier names
- Persona Lean:
- warm-institutional
- Notes: Character mascot persists into pricing; consistent brand voice
- File: good-fella--frontend-development-studio--websites-tha.webp
- Pattern: agency project pricing + deliverables-focused + studio aesthetic
- Persona Lean:
- editorial
- brutalist-expressive
- Notes: Project/retainer model rather than SaaS tiers; creative studio tone
- File: jace-ai--your-247-email-assistant-that-drafts-for-you.webp
- Pattern: single-tier highlight + AI email use case callouts + clean dark
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Email use cases as feature proof points alongside price
- File: offcoustic--affordable-phone-booths-for-your-office-c.webp
- Pattern: physical product pricing + configuration matrix + office hardware
- Persona Lean:
- swiss-modernist
- warm-institutional
- Notes: Hardware/configuration model; specs table rather than feature checkboxes
- File: polar--monetize-your-software-with-ease--polar.webp
- Pattern: usage-based open-source pricing + percentage fee model + developer
- Persona Lean:
- dense-pragmatist
- tokyo-minimal
- Notes: Transparent percentage-cut model; very developer-community-focused
- File: rhetorich--make-speaking-your-firms-most-powerful-adv.webp
- Pattern: B2B service tiers + outcome language + professional services
- Persona Lean:
- swiss-modernist
- warm-institutional
- Notes: Firm/agency buyer framing; outcome-based tier naming
- File: rideaway--all-in-one-booking--management-platform-for.webp
- Pattern: SaaS platform tiers + booking feature highlights + mobility sector
- Persona Lean:
- warm-institutional
- dense-pragmatist
- Notes: Feature-heavy comparison; targets operators/fleet managers
- File: sendrai.webp
- Pattern: email infrastructure pricing + volume tiers + technical copy
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Message volume as primary pricing axis; API/developer product
- File: spread--flip-smarter.webp
- Pattern: fintech tier cards + dark bg + trading product feature list
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Financial product; dark premium aesthetic; feature-dense cards
- File: sprout.webp
- Pattern: 3-tier centered + soft palette + SMB growth tool
- Persona Lean:
- warm-institutional
- Notes: Friendly color palette; growth/marketing tool; approachable copy
- File: titan--wealth-management.webp
- Pattern: premium single-tier + wealth management aesthetic + trust signals
- Persona Lean:
- editorial
- swiss-modernist
- Notes: High-end wealth product; minimal tiers; credibility over features
Base Path
resources/landbook/sections-pricing
Persona Mapping
- Dense Pragmatist:
- claudeai
- codegen--the-os-for-code-agents
- sendrai
- jace-ai--your-247-email-assistant-that-drafts-for-you
- spread--flip-smarter
- rideaway--all-in-one-booking--management-platform-for
- Swiss Modernist:
- base39
- claudeai
- offcoustic--affordable-phone-booths-for-your-office-c
- sendrai
- rhetorich--make-speaking-your-firms-most-powerful-adv
- Warm Institutional:
- ambrook
- durable-ai-website-builder-and-small-business-software
- gogetta
- sprout
- rideaway--all-in-one-booking--management-platform-for
- Editorial:
- claimable--easily-appeal-denied-health-claims
- exactlyai--train-ai-to-replicate-your-brand-style
- good-fella--frontend-development-studio--websites-tha
- titan--wealth-management
- Brutalist Expressive:
- cypher
- good-fella--frontend-development-studio--websites-tha
- Tokyo Minimal:
- base39
- polar--monetize-your-software-with-ease--polar
Agent Workflow
1. Match pricing model to sample type first. Select samples from this gallery whose business model matches the target (SaaS subscription, usage-based, agency project, hardware). Structural decisions (number of columns, axis of comparison) depend on model, not persona.
2. Filter by buyer persona second. Within a model type, persona determines palette, copy density, and typography register. A developer-tool pricing section (polar, codegen) looks structurally similar to an SMB tool (durable, sprout) but reads completely differently in tone.
3. Use highlighted-tier examples for conversion emphasis. Samples where a center/right tier has a distinct background, border, or badge (build-apps-with-ai, base44) show how visual emphasis directs attention without additional copy.
4. Cross-reference CTAs. The CTA inside pricing cards is its own pattern set — see the CTA gallery atom for how button hierarchy and copy work in conversion contexts.
5. Anchor on notes for tonal calibration. The notes field captures the brand register that cannot be read from pattern alone — 'earthy green, farm brand' vs. 'neon accent, web3 energy' require different execution even if both use 3-tier grids.
Loaded when retrieval picks the atom as a focal / direct hit.
PricingSectionGallery [example] v1.0.0
20 curated pricing section screenshots from Land-book Pro, tagged by pattern type and persona lean. The pricing section is the most analytically loaded section on a landing page: it must communicate value tiers, justify cost, reduce anxiety, and drive conversion — often to a single highlighted action. Pricing design is tightly coupled to business model, buyer persona, and brand register.
Meta
- License: Apache-2.0
- License Provenance: package-authorship-claim
Observations
- The 3-tier card grid is the dominant SaaS convention — and it signals trust. The majority of SaaS products in this gallery (base44, claudeai, durable, sprout, rideaway, ambrook) use a 3-column card layout with a center or right tier visually highlighted as 'recommended.' This is a convention strong enough that departing from it requires conscious justification. The convention works because it mirrors the buyer's mental model: 'free / starter / pro' or 'basic / growth / enterprise.'
- Dark-background pricing clusters around developer and fintech products. Cypher, codegen, spread, jace-ai, and sendrai all use dark or dark-adjacent backgrounds on pricing. This is consistent with the hero gallery pattern: dark = technical/infrastructure/financial. It also creates contrast that makes glowing accent cards (the 'recommended' tier) more dramatic.
- Non-SaaS products break the tier-card mold intentionally. Offcoustic (hardware) uses a specs/configuration matrix. Good-fella (agency) uses a project/retainer model. Titan (wealth management) surfaces a single premium tier with minimal comparison. Polar (open-source) leads with a percentage-fee transparency model. These breaks are intentional and aligned to the actual purchase decision the buyer is making.
- Usage-based pricing gets special visual treatment. Codegen, sendrai, and polar all have usage/volume as the primary axis. Visually they tend toward simpler layouts (fewer columns) with clear 'how pricing works' explanatory copy — because the cognitive model is different from tiered plans.
- Feature checklists vs. outcome language split along persona lines. B2B SaaS targeting technical or operational buyers (rideaway, codegen, claudeai) uses dense feature checklists. B2C and professional services (claimable, rhetorich, titan) use outcome/benefit language instead. The choice is as much about the buyer's vocabulary as design aesthetics.
Items
- File: ambrook.webp
- Pattern: 3-tier card grid + feature comparison rows + agri-sector color
- Persona Lean:
- warm-institutional
- swiss-modernist
- Notes: Earthy green palette; clear tier differentiation; farm/agri brand
- File: base39.webp
- Pattern: minimal 2-tier + large price numerals + clean whitespace
- Persona Lean:
- tokyo-minimal
- swiss-modernist
- Notes: Very restrained; price number is the typographic hero
- File: build-apps-with-ai-in-minutes--base44.webp
- Pattern: toggle monthly/annual + 3 tiers + highlighted recommended tier
- Persona Lean:
- warm-institutional
- dense-pragmatist
- Notes: Standard SaaS pricing layout; recommended tier uses brand color ring
- File: claimable--easily-appeal-denied-health-claims.webp
- Pattern: single prominent tier + outcome-framing copy + health sector
- Persona Lean:
- warm-institutional
- editorial
- Notes: Avoids comparison grid; focuses on value delivery promise
- File: claudeai.webp
- Pattern: clean 3-tier + free + pro + enterprise + feature list
- Persona Lean:
- swiss-modernist
- dense-pragmatist
- Notes: Anthropic brand; neutral palette; dense feature checklist rows
- File: codegen--the-os-for-code-agents.webp
- Pattern: usage-based pricing + developer-facing copy + code-adjacent aesthetic
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Credits/usage model framing; dark SaaS tone; dev-tool positioning
- File: cypher.webp
- Pattern: dark bg pricing + glowing accent card + crypto/web3 palette
- Persona Lean:
- brutalist-expressive
- dense-pragmatist
- Notes: Neon accent on highlighted tier; dark-mode-first; web3 brand energy
- File: durable-ai-website-builder-and-small-business-software.webp
- Pattern: 3 tiers + icon feature list + SMB-friendly copy + bright CTA
- Persona Lean:
- warm-institutional
- Notes: Bright colors; simplified language; targets non-technical users
- File: exactlyai--train-ai-to-replicate-your-brand-style.webp
- Pattern: 2-tier comparison + visual feature matrix + AI-brand palette
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Visual/image-centric feature callouts to match AI image product
- File: gogetta.webp
- Pattern: illustrated pricing + mascot presence + friendly tier names
- Persona Lean:
- warm-institutional
- Notes: Character mascot persists into pricing; consistent brand voice
- File: good-fella--frontend-development-studio--websites-tha.webp
- Pattern: agency project pricing + deliverables-focused + studio aesthetic
- Persona Lean:
- editorial
- brutalist-expressive
- Notes: Project/retainer model rather than SaaS tiers; creative studio tone
- File: jace-ai--your-247-email-assistant-that-drafts-for-you.webp
- Pattern: single-tier highlight + AI email use case callouts + clean dark
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Email use cases as feature proof points alongside price
- File: offcoustic--affordable-phone-booths-for-your-office-c.webp
- Pattern: physical product pricing + configuration matrix + office hardware
- Persona Lean:
- swiss-modernist
- warm-institutional
- Notes: Hardware/configuration model; specs table rather than feature checkboxes
- File: polar--monetize-your-software-with-ease--polar.webp
- Pattern: usage-based open-source pricing + percentage fee model + developer
- Persona Lean:
- dense-pragmatist
- tokyo-minimal
- Notes: Transparent percentage-cut model; very developer-community-focused
- File: rhetorich--make-speaking-your-firms-most-powerful-adv.webp
- Pattern: B2B service tiers + outcome language + professional services
- Persona Lean:
- swiss-modernist
- warm-institutional
- Notes: Firm/agency buyer framing; outcome-based tier naming
- File: rideaway--all-in-one-booking--management-platform-for.webp
- Pattern: SaaS platform tiers + booking feature highlights + mobility sector
- Persona Lean:
- warm-institutional
- dense-pragmatist
- Notes: Feature-heavy comparison; targets operators/fleet managers
- File: sendrai.webp
- Pattern: email infrastructure pricing + volume tiers + technical copy
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Message volume as primary pricing axis; API/developer product
- File: spread--flip-smarter.webp
- Pattern: fintech tier cards + dark bg + trading product feature list
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Financial product; dark premium aesthetic; feature-dense cards
- File: sprout.webp
- Pattern: 3-tier centered + soft palette + SMB growth tool
- Persona Lean:
- warm-institutional
- Notes: Friendly color palette; growth/marketing tool; approachable copy
- File: titan--wealth-management.webp
- Pattern: premium single-tier + wealth management aesthetic + trust signals
- Persona Lean:
- editorial
- swiss-modernist
- Notes: High-end wealth product; minimal tiers; credibility over features
Base Path
resources/landbook/sections-pricing
Persona Mapping
- Dense Pragmatist:
- claudeai
- codegen--the-os-for-code-agents
- sendrai
- jace-ai--your-247-email-assistant-that-drafts-for-you
- spread--flip-smarter
- rideaway--all-in-one-booking--management-platform-for
- Swiss Modernist:
- base39
- claudeai
- offcoustic--affordable-phone-booths-for-your-office-c
- sendrai
- rhetorich--make-speaking-your-firms-most-powerful-adv
- Warm Institutional:
- ambrook
- durable-ai-website-builder-and-small-business-software
- gogetta
- sprout
- rideaway--all-in-one-booking--management-platform-for
- Editorial:
- claimable--easily-appeal-denied-health-claims
- exactlyai--train-ai-to-replicate-your-brand-style
- good-fella--frontend-development-studio--websites-tha
- titan--wealth-management
- Brutalist Expressive:
- cypher
- good-fella--frontend-development-studio--websites-tha
- Tokyo Minimal:
- base39
- polar--monetize-your-software-with-ease--polar
Agent Workflow
1. Match pricing model to sample type first. Select samples from this gallery whose business model matches the target (SaaS subscription, usage-based, agency project, hardware). Structural decisions (number of columns, axis of comparison) depend on model, not persona.
2. Filter by buyer persona second. Within a model type, persona determines palette, copy density, and typography register. A developer-tool pricing section (polar, codegen) looks structurally similar to an SMB tool (durable, sprout) but reads completely differently in tone.
3. Use highlighted-tier examples for conversion emphasis. Samples where a center/right tier has a distinct background, border, or badge (build-apps-with-ai, base44) show how visual emphasis directs attention without additional copy.
4. Cross-reference CTAs. The CTA inside pricing cards is its own pattern set — see the CTA gallery atom for how button hierarchy and copy work in conversion contexts.
5. Anchor on notes for tonal calibration. The notes field captures the brand register that cannot be read from pattern alone — 'earthy green, farm brand' vs. 'neon accent, web3 energy' require different execution even if both use 3-tier grids.
Relations
related: [@community/example-gallery-full-landings, @community/example-gallery-cta-sections, @community/example-gallery-feature-sections]
Meta
- License: Apache-2.0
- License Provenance: package-authorship-claim
Observations
- The 3-tier card grid is the dominant SaaS convention — and it signals trust. The majority of SaaS products in this gallery (base44, claudeai, durable, sprout, rideaway, ambrook) use a 3-column card layout with a center or right tier visually highlighted as 'recommended.' This is a convention strong enough that departing from it requires conscious justification. The convention works because it mirrors the buyer's mental model: 'free / starter / pro' or 'basic / growth / enterprise.'
- Dark-background pricing clusters around developer and fintech products. Cypher, codegen, spread, jace-ai, and sendrai all use dark or dark-adjacent backgrounds on pricing. This is consistent with the hero gallery pattern: dark = technical/infrastructure/financial. It also creates contrast that makes glowing accent cards (the 'recommended' tier) more dramatic.
- Non-SaaS products break the tier-card mold intentionally. Offcoustic (hardware) uses a specs/configuration matrix. Good-fella (agency) uses a project/retainer model. Titan (wealth management) surfaces a single premium tier with minimal comparison. Polar (open-source) leads with a percentage-fee transparency model. These breaks are intentional and aligned to the actual purchase decision the buyer is making.
- Usage-based pricing gets special visual treatment. Codegen, sendrai, and polar all have usage/volume as the primary axis. Visually they tend toward simpler layouts (fewer columns) with clear 'how pricing works' explanatory copy — because the cognitive model is different from tiered plans.
- Feature checklists vs. outcome language split along persona lines. B2B SaaS targeting technical or operational buyers (rideaway, codegen, claudeai) uses dense feature checklists. B2C and professional services (claimable, rhetorich, titan) use outcome/benefit language instead. The choice is as much about the buyer's vocabulary as design aesthetics.
Items
- File: ambrook.webp
- Pattern: 3-tier card grid + feature comparison rows + agri-sector color
- Persona Lean:
- warm-institutional
- swiss-modernist
- Notes: Earthy green palette; clear tier differentiation; farm/agri brand
- File: base39.webp
- Pattern: minimal 2-tier + large price numerals + clean whitespace
- Persona Lean:
- tokyo-minimal
- swiss-modernist
- Notes: Very restrained; price number is the typographic hero
- File: build-apps-with-ai-in-minutes--base44.webp
- Pattern: toggle monthly/annual + 3 tiers + highlighted recommended tier
- Persona Lean:
- warm-institutional
- dense-pragmatist
- Notes: Standard SaaS pricing layout; recommended tier uses brand color ring
- File: claimable--easily-appeal-denied-health-claims.webp
- Pattern: single prominent tier + outcome-framing copy + health sector
- Persona Lean:
- warm-institutional
- editorial
- Notes: Avoids comparison grid; focuses on value delivery promise
- File: claudeai.webp
- Pattern: clean 3-tier + free + pro + enterprise + feature list
- Persona Lean:
- swiss-modernist
- dense-pragmatist
- Notes: Anthropic brand; neutral palette; dense feature checklist rows
- File: codegen--the-os-for-code-agents.webp
- Pattern: usage-based pricing + developer-facing copy + code-adjacent aesthetic
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Credits/usage model framing; dark SaaS tone; dev-tool positioning
- File: cypher.webp
- Pattern: dark bg pricing + glowing accent card + crypto/web3 palette
- Persona Lean:
- brutalist-expressive
- dense-pragmatist
- Notes: Neon accent on highlighted tier; dark-mode-first; web3 brand energy
- File: durable-ai-website-builder-and-small-business-software.webp
- Pattern: 3 tiers + icon feature list + SMB-friendly copy + bright CTA
- Persona Lean:
- warm-institutional
- Notes: Bright colors; simplified language; targets non-technical users
- File: exactlyai--train-ai-to-replicate-your-brand-style.webp
- Pattern: 2-tier comparison + visual feature matrix + AI-brand palette
- Persona Lean:
- editorial
- swiss-modernist
- Notes: Visual/image-centric feature callouts to match AI image product
- File: gogetta.webp
- Pattern: illustrated pricing + mascot presence + friendly tier names
- Persona Lean:
- warm-institutional
- Notes: Character mascot persists into pricing; consistent brand voice
- File: good-fella--frontend-development-studio--websites-tha.webp
- Pattern: agency project pricing + deliverables-focused + studio aesthetic
- Persona Lean:
- editorial
- brutalist-expressive
- Notes: Project/retainer model rather than SaaS tiers; creative studio tone
- File: jace-ai--your-247-email-assistant-that-drafts-for-you.webp
- Pattern: single-tier highlight + AI email use case callouts + clean dark
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Email use cases as feature proof points alongside price
- File: offcoustic--affordable-phone-booths-for-your-office-c.webp
- Pattern: physical product pricing + configuration matrix + office hardware
- Persona Lean:
- swiss-modernist
- warm-institutional
- Notes: Hardware/configuration model; specs table rather than feature checkboxes
- File: polar--monetize-your-software-with-ease--polar.webp
- Pattern: usage-based open-source pricing + percentage fee model + developer
- Persona Lean:
- dense-pragmatist
- tokyo-minimal
- Notes: Transparent percentage-cut model; very developer-community-focused
- File: rhetorich--make-speaking-your-firms-most-powerful-adv.webp
- Pattern: B2B service tiers + outcome language + professional services
- Persona Lean:
- swiss-modernist
- warm-institutional
- Notes: Firm/agency buyer framing; outcome-based tier naming
- File: rideaway--all-in-one-booking--management-platform-for.webp
- Pattern: SaaS platform tiers + booking feature highlights + mobility sector
- Persona Lean:
- warm-institutional
- dense-pragmatist
- Notes: Feature-heavy comparison; targets operators/fleet managers
- File: sendrai.webp
- Pattern: email infrastructure pricing + volume tiers + technical copy
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Message volume as primary pricing axis; API/developer product
- File: spread--flip-smarter.webp
- Pattern: fintech tier cards + dark bg + trading product feature list
- Persona Lean:
- dense-pragmatist
- swiss-modernist
- Notes: Financial product; dark premium aesthetic; feature-dense cards
- File: sprout.webp
- Pattern: 3-tier centered + soft palette + SMB growth tool
- Persona Lean:
- warm-institutional
- Notes: Friendly color palette; growth/marketing tool; approachable copy
- File: titan--wealth-management.webp
- Pattern: premium single-tier + wealth management aesthetic + trust signals
- Persona Lean:
- editorial
- swiss-modernist
- Notes: High-end wealth product; minimal tiers; credibility over features
Base Path
resources/landbook/sections-pricing
Persona Mapping
- Dense Pragmatist:
- claudeai
- codegen--the-os-for-code-agents
- sendrai
- jace-ai--your-247-email-assistant-that-drafts-for-you
- spread--flip-smarter
- rideaway--all-in-one-booking--management-platform-for
- Swiss Modernist:
- base39
- claudeai
- offcoustic--affordable-phone-booths-for-your-office-c
- sendrai
- rhetorich--make-speaking-your-firms-most-powerful-adv
- Warm Institutional:
- ambrook
- durable-ai-website-builder-and-small-business-software
- gogetta
- sprout
- rideaway--all-in-one-booking--management-platform-for
- Editorial:
- claimable--easily-appeal-denied-health-claims
- exactlyai--train-ai-to-replicate-your-brand-style
- good-fella--frontend-development-studio--websites-tha
- titan--wealth-management
- Brutalist Expressive:
- cypher
- good-fella--frontend-development-studio--websites-tha
- Tokyo Minimal:
- base39
- polar--monetize-your-software-with-ease--polar
Agent Workflow
1. Match pricing model to sample type first. Select samples from this gallery whose business model matches the target (SaaS subscription, usage-based, agency project, hardware). Structural decisions (number of columns, axis of comparison) depend on model, not persona.
2. Filter by buyer persona second. Within a model type, persona determines palette, copy density, and typography register. A developer-tool pricing section (polar, codegen) looks structurally similar to an SMB tool (durable, sprout) but reads completely differently in tone.
3. Use highlighted-tier examples for conversion emphasis. Samples where a center/right tier has a distinct background, border, or badge (build-apps-with-ai, base44) show how visual emphasis directs attention without additional copy.
4. Cross-reference CTAs. The CTA inside pricing cards is its own pattern set — see the CTA gallery atom for how button hierarchy and copy work in conversion contexts.
5. Anchor on notes for tonal calibration. The notes field captures the brand register that cannot be read from pattern alone — 'earthy green, farm brand' vs. 'neon accent, web3 energy' require different execution even if both use 3-tier grids.
Source
aoe-engine/examples/frontend-design/primes/compiled/@community/example-gallery-pricing-sections/atom.yaml