> ## Documentation Index
> Fetch the complete documentation index at: https://docs.a0.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Writing prompts

## The anatomy of a good prompt

Every effective prompt has these elements:

### 1. Clear scope

State exactly what you want to change. Instead of "improve the form" try "add email validation to the signup form."

### 2. Specific details

Include colors, positions, text, behavior. Instead of "add a button" try "add a green 'Continue' button below the form that navigates to /dashboard."

### 3. Context when needed

If it's a bug, include the error. If it's a feature, explain where it fits in the flow.

### 4. One goal per message

Try not to combine "fix the login bug AND redesign the homepage AND add a new API endpoint." Picking one usually means it gets completed thoroughly.

## Examples that actually work

These prompts get results because they're clear, specific, and actionable.

<AccordionGroup>
  <Accordion title="Specific Login Request">
    ```text theme={null}
    I need to update the login screen:
    1. Change the button color from blue to green
    2. Add a "Forgot Password?" link below the login button
    3. Make the email input field show a keyboard with @ symbol
    4. Add validation to show error message if email format is wrong
    ```
  </Accordion>

  <Accordion title="Clear Settings Request">
    ```text theme={null}
    Add a new settings screen with these options:
    - Toggle for push notifications
    - Dark mode switch  
    - User profile picture upload
    - Logout button at the bottom
    ```
  </Accordion>

  <Accordion title="Detailed Bug Fix">
    ```text theme={null}
    The profile save button throws this error:
    TypeError: Cannot read property 'id' of undefined
    at ProfileScreen.js line 45

    Please fix by checking if user exists before accessing user.id
    ```
  </Accordion>

  <Accordion title="Build entire app">
    ```text theme={null}
    Build a tally counter app with the key output being UI design quality. 
    This app should have two components:
    - The home page where users see all of their tallied items (quick +/- in this UI)
    - The create tally item screen/modal which allows the user to set the name and other metadata
    Lets build this in the neobrutalism style with a cartoonish minimalism design.
    ```
  </Accordion>
</AccordionGroup>

<Tip>
  If you have an image or design reference, you can attach it to the chat! This helps the AI understand exactly what you're looking for visually.
</Tip>