Marketingpartme-aiFree

stitch-ui-design-variants

Generate alternative Stitch design variant prompts for A/B testing and creative exploration. Use when the user wants multiple style, layout, or content options for a Stitch screen. Takes a base Design Spec or prompt and produces 3 distinct variants (layout, style, or content variations).

Repo bundle on Versuzpartme-ai/full-stack-skills422 indexed entries (SKILL.md and CLAUDE.md) from this repository — open the full bundle view.

Open bundle →

View on GitHub ↗</>github.com/partme-ai/full-stack-skills Yours? Claim it ↗

§ 01 — Stats

Stars379

Prior1167

Quality—

Score—

Tasks—

§ 02 — Install

Get stitch-ui-design-variants.

Free SKILL.md scraped from GitHub. Clone the repo or copy the file directly into your Claude Code skills directory.

One-line install · Claude Code

$npx versuz@latest install partme-ai-full-stack-skills-skills-stitch-skills-stitch-ui-design-variants

Or clone the repo

$git clone https://github.com/partme-ai/full-stack-skills.git

Or copy the SKILL.md manually

cp full-stack-skills/SKILL.MD ~/.claude/skills/partme-ai-full-stack-skills-skills-stitch-skills-stitch-ui-design-variants/SKILL.md

More Versuz picks

★ Featured$1.99

vz-bench-debug

Document

★ Featured$0.99

vz-scrape-runner

Web

Got something better ?Submit your skill — it enters tomorrow's cycle. No fee.

Submit yours →

§ 05 — Challenge

Think you can beat it?

$npx versuz challenge partme-ai-full-stack-skills-skills-stitch-skills-stitch-ui-design-variants↵

Show SKILL.md content (~601 tokens)

---
name: stitch-ui-design-variants
description: "Generate alternative Stitch design variant prompts for A/B testing and creative exploration. Use when the user wants multiple style, layout, or content options for a Stitch screen. Takes a base Design Spec or prompt and produces 3 distinct variants (layout, style, or content variations)."
allowed-tools: "stitch*:*, Read, Write"
---


# Stitch Design Variants

This skill acts as a **Variant Generator**. It takes a base design and produces alternative prompts to explore different creative directions.

## Input
*   **Base Spec**: The original Design Spec or Prompt.
*   **Variant Type**:
    *   `LAYOUT`: Keep style, change structure.
    *   `STYLE`: Keep structure, change theme/colors.
    *   `CONTENT`: Keep design, change text/data.

## Output Format (List of Strings)
A list of 3 distinct prompts.

## Logic Rules

### 1. Layout Variants
*   *Variant A*: Standard layout.
*   *Variant B*: Split screen or asymmetrical layout.
*   *Variant C*: Minimalist/Hidden navigation layout.

### 2. Style Variants
*   *Variant A*: Original Theme.
*   *Variant B*: Inverted Theme (Light <-> Dark).
*   *Variant C*: High Contrast / Monochromatic.

## Validation

Ensure each variant is **sufficiently distinct**: different layout structure (for LAYOUT), different color palette (for STYLE), or different content/copy (for CONTENT). If two variants look too similar, regenerate the weaker one.

## Example: Style Variants for a Dashboard

**Input**: "Desktop SaaS dashboard. Dark mode. Blue primary (#2563EB). Sidebar nav."

**Output**:

1. "Desktop SaaS dashboard. Dark mode with deep navy background (#0f172a). Primary blue (#2563EB) for CTAs. Sidebar navigation. Cards with subtle border glow. High-contrast text (#f8fafc)."
2. "Desktop SaaS dashboard. Light mode with clean white background (#ffffff). Primary blue (#2563EB) for CTAs. Sidebar navigation. Cards with soft gray (#f1f5f9) backgrounds and subtle shadows."
3. "Desktop SaaS dashboard. High-contrast monochrome with pure black background (#000000). Accent electric blue (#3b82f6) for active states only. Sidebar navigation. Minimal chrome, maximum data density."

## References

- [Examples](examples/usage.md)