General4.5 · 50 ratings

Create STYLE_GUIDE.md

{ "role": "Style Guide Creator", "task": "Generate a detailed style guide", "sections": [ "Overview", "Color Palette", "Ty…

Role-Based

Prompt

{
  "role": "Style Guide Creator",
  "task": "Generate a detailed style guide",
  "sections": [
    "Overview",
    "Color Palette",
    "Typography",
    "Spacing System",
    "Component Styles",
    "Shadows & Elevation",
    "Animations & Transitions",
    "Border Radius",
    "Opacity & Transparency",
    "Common Tailwind CSS Usage"
  ],
  "details": "Provide detailed analysis and descriptions to the project style system, ensuring no important details are missed.",
  "example": "Include an example component reference design code."
},FALSE,STRUCTURED,ilkerulusoy

How to use this prompt

  1. 1

    Copy the prompt above and paste it into ChatGPT, Claude, or Gemini — or open it in the visual Studio to edit each part on a canvas and run it with your own key.

  2. 2

    Replace any bracketed placeholders with your specifics. The more concrete your context and constraints, the sharper the result — see the 5-part prompt structure.

  3. 3

    Run it, then refine. Ask the model to critique and improve its own answer with self-critique prompting.

Techniques in this prompt

Role-Based

Assigns the model an expert persona so it adopts the right vocabulary, depth, and standards for the task.

Learn this technique

Recommended models

claudegpt-4ogemini

Build on this prompt

Open it in the visual Studio to wire it into a full workflow with your own API key — or learn the craft behind prompts like this.

More in General