# Common Issues
Source: https://docs.same.new/essentials/common-issues

Common issues you may run into on Same and how to resolve them.

## Overview

You may occasionally run into one of the issues below. Here’s how to resolve each one.

## Errors in chat

### Please try again: prompt is too long

An error that looks like this:

> Please try again
>
> prompt is too long: 207371 tokens > 200000 maximum

<img alt="Prompt is too long error." />

This error can happen if your chat becomes too large while using models from Anthropic, such as `claude-4.5-sonnet` or `claude-4.5-opus`.

**To resolve:** Create a new chat.

<Frame>
  <img alt="Screenshot showing the New Chat button with plus icon and tooltip in the chat panel." />
</Frame>

### Endless generation

Sometimes Same may **keep generating** without finishing (the response never settles).

**To resolve:**

1. **Start a new chat** using the "New Chat" button (<Icon icon="message-circle-plus" /> icon, top-left in the chat panel).
2. **Before you send your message,** remove attachments you do not need. You can **keep the chat reference** attachment so Same still has context from the earlier conversation.

<Frame>
  <img alt="Screenshot showing attachments in the composer and how to remove them." />
</Frame>

3. If endless generation **continues**, **remove every attachment** (including the chat reference) and try again.

***

For troubleshooting prompts and debugging issues with your website, see [Troubleshooting](/essentials/troubleshooting).


# Deploy
Source: https://docs.same.new/essentials/deploying

Learn how app deployment works on Same.new. Deploy full-stack apps built with prompts, no infrastructure setup or configuration needed.

Deployment brings your project **online**. Same integrates with [Netlify](https://www.netlify.com/) to generate a permanent domain that anyone can access. You can claim the deployment to take control and customize the domain.

## Trigger deployment

Same often deploys automatically when a task seems complete. You can also directly tell Same to deploy at any point:

```md theme={null}
Deploy my project
```

Same will automatically clean up your code, solve errors, and deploy for you.

<Note>
  If the deployment attempt failed, just tell Same to debug and retry: `md My
      deployment failed, debug and retry `
</Note>

## Deployment URLs

After deployment, you'll get:

1. **Preview Domain:** A unique URL for that specific deployment. Good for testing.
2. **Main Domain:** The primary project URL that stays updated with your latest deployed version.

<Tip>
  Share your main domain with friends or on social media to let others visit
  your site. You can always find the domain by clicking Deployed button.
</Tip>

<Frame>
  <img />
</Frame>

## Claim deployment

You can claim deployment in Netlify to transfer the site to your own account and setup domains.

**To claim the deployment**

1. Click **Deployed** button
2. Click <Icon icon="key" /> **Claim Deployment**
3. You will be redirected to Netlify, follow the instructions to claim

<Note>
  Domain customization is not yet available within Same. Claim your project via
  Netlify and follow their domain setup instructions.
</Note>

<Frame>
  <img />
</Frame>

## Manage deployment

You can take down the deployment to unpublish your project. A project taken down can be redeployed, and the main domain stays the same.

**To take down deployment**

1. Click **Deployed** button
2. Click <Icon icon="unlink" /> **Take down**

**To redeploy**

1. Click **Deploy** button
2. Click <Icon icon="rotate-ccw" /> **Redeploy**

## Troubleshooting deployment issues

If your deployment fails with an error message, there are several common causes and solutions to try.

<Warning>
  **Build failed during deployment. Build the project locally to reproduce and fix the errors.**

  This error can occur when there are issues with your deployment configuration or account limits.
</Warning>

To troubleshoot this error, check the following:

1. **Have you claimed the deployment for this project?**

   When you claim a deployment, all future deployments for that project will use your own Netlify account and credits. Check if you've claimed this project's deployment:

   * Click **Deployed** button to see deployment status
   * If it shows as claimed, you're using your own Netlify resources

   Learn more about [claiming your deployment](#claim-deployment) above.

2. **Have you run out of free credits in your Netlify account?**

   If you've claimed this project's deployment, check your Netlify account to see if you've exhausted your build minutes. Claimed deployments use your own Netlify resources, which have limits on free plans.

   <Note>
     Unclaimed deployments use Same's Netlify resources and are free to you. If
     your deployment isn't claimed, credit issues are unlikely the cause.
   </Note>

3. **Solutions to resolve credit issues:**

   If you've claimed the deployment and run out of Netlify credits, you have two options:

   * **Top up your Netlify credits:** Log into your Netlify account and add more build minutes to your plan
   * **Remix your project on Same:** Create a fresh copy of your project with a new, unclaimed deployment that uses Same's resources

   <Tip>
     Remixing creates a new project with its own unclaimed deployment. This
     gives you a fresh start with deployments handled by Same's infrastructure.
     Learn more about [remixing projects](/essentials/project-management#remix).
   </Tip>

If the issue persists after checking these items, contact our support team at [support@same.new](mailto:support@same.new) and include the link to your project (example: [https://same.new/chat/project-id](https://same.new/chat/project-id)).

## FAQ

<AccordionGroup>
  <Accordion title="Why should I deploy?">
    Deploying your project has several benefits:

    1. **Share with Others:** Make your project accessible to anyone through a public URL
    2. **Test in Production:** Verify your project works in a real environment
    3. **Version Control:** Each deployment creates a snapshot you can return to
    4. **Professional Presentation:** Show your work to clients or employers with a live site

    <Tip>
      Deploy early and often to catch issues and gather feedback from real users.
    </Tip>
  </Accordion>

  <Accordion title="Can I deploy my site elsewhere?">
    Currently, Same doesn't support deploying to other platforms natively. However, you have two options:

    1. **Download your project:**
       * Download the code and deploy it manually to your preferred platform
       * Follow the platform-specific deployment instructions

    <Note>
      Project download is a premium feature only available on paid plans.
    </Note>

    2. **Link with GitHub:**
       * Push your code to GitHub
       * Deploy from your GitHub repository using any hosting service
       * Maintain full control over your deployment process
  </Accordion>

  <Accordion title="How to customize the domain of my deployed project?">
    Currently, Same doesn't support custom domains natively. To use a custom domain:

    1. **Claim your project on Netlify:**
       * Deploy your project first through Same
       * Follow the claiming process on Netlify

    2. **Set up custom domain:**
       * Go to your site settings in Netlify
       * Follow Netlify's domain configuration process
  </Accordion>

  <Accordion title="Why should I claim my project?">
    Claiming your project on Netlify provides several key benefits:

    1. **Permanent URL:** Get a consistent, non-expiring URL for your site
    2. **Custom Domain:** Add your own domain name
    3. **Site Controls:** Access deployment settings and analytics
    4. **Team Access:** Share site management with collaborators

    Learn more about [claiming benefits on Netlify](https://docs.netlify.com/welcome/build-with-ai/prototyping-best-practices/#benefits-of-claiming-your-deployments).
  </Accordion>

  <Accordion title="What will happen if I don't claim my deployed project?">
    If you don't claim your deployed project:

    1. **Temporary Access:** Your project will remain accessible through the Same-generated URL
    2. **Limited Time:** The deployment will expire after 14 days of inactivity
    3. **Data Preservation:** Your project code and history remain safe in Same
    4. **Redeployment:** You can always redeploy the project to reactivate the URL

    <Warning>
      Unclaimed deployments expire after 14 days. To ensure continuous availability, either claim your project on Netlify or redeploy regularly.
    </Warning>
  </Accordion>
</AccordionGroup>


# Manual edit
Source: https://docs.same.new/essentials/manual-editing

Same.new's AI code editor gives you full control. Create files and folders, access a terminal shell, and edit UI, backend, and logic with precision.

While Same builds based on your prompts, you can also directly interact with the project using the integrated workbench.

## Code Editor

Modify project files directly in the editor.

<Frame>
  <img alt="Screenshot of the Same workbench showing the code editor, file tree, and preview panel." />
</Frame>

**Key Features:**

* **File Tree:** Browse directories on the left. Right-click (or long-press on mobile) for options.
* **Saving:** Changes save automatically after inactivity, or manually with `Cmd/Ctrl + S`. An unsaved file shows a `Save` button in the header.
* **Read-Only Mode:** If viewing a project you don't own, you must fork it to enable editing.

### Creating Files and Folders

(Requires project ownership)

1. **Right-click** (or long-press) in the file tree on a folder or empty space (for root).
2. Select **"New File"** or **"New Folder"**.
3. Enter a name and confirm.

<Frame>
  <img alt="Screenshot showing the file tree context menu with options for New File and New Folder." />
</Frame>

### Renaming and Deleting

(Requires project ownership)

Use the right-click context menu in the file tree to rename or delete items. Deleting a folder removes all its contents.

## Terminal

Access a shell environment within the workbench.

<Frame>
  <img alt="Screenshot of the integrated terminal within the Same workbench." />
</Frame>

**Key Features:**

* **Run Commands:** Execute standard commands (e.g., `bun install`, `ls`).
* **Working Directory:** Starts in `/home/project`. Use `cd` to navigate into your project folder.
* **Multiple Terminals:** Use the <Icon icon="plus" /> icon in the tab bar to open more terminals.

<Info>
  The terminal is containerized and operations performed within the terminal are
  reset on page refresh.
</Info>

## File and Folder Uploads

(Requires project ownership)

1. **Drag and Drop:** Drag files/folders onto the file tree panel. Drop on a folder to upload there, or empty space for the root.
2. **Upload Buttons:** Use the Upload File and Upload Folder buttons at the bottom of the file tree. These upload to an `uploads/` folder in the root.

<Frame>
  <img alt="Screenshot highlighting the upload file and upload folder buttons at the bottom of the file tree." />
</Frame>


# Project management
Source: https://docs.same.new/essentials/project-management

Control your AI projects in Same.new. Rename, remix, reset, or delete apps directly from your dashboard. Fast, easy, and intuitive.

## Project visibility

By default, new projects are **public**, meaning anyone can view them in Same. You can make your project private.
<Info>Only you can access your private projects.</Info>

### How to change project visibility

1. Enter the project workspace
2. Click the project name dropdown in the top left
3. A dropdown with project options will appear
4. Click **Make Private** or **Make Public** to toggle visibility

<Frame>
  <img alt="Screenshot showing the lock icon in the Workbench to toggle project visibility." />
</Frame>

## Remix

You can remix an existing project to make it your own and start customizing from there.

### How to remix your projects

1. Enter the project and wait for it's initiation
2. Click <Icon icon="ellipsis" /> and open the drawer
3. Click <Icon icon="shuffle" /> **Remix**
4. Same will make a copy and redirect you to the new project

<Tip>
  Use remix to test new ideas while preserving your base project.
</Tip>

### How to remix others' projects

1. **Browse the gallery** to discover community projects
2. Pick one you like and click the <Icon icon="shuffle" /> **Remix**
3. Same will make a copy and redirect you to the new project

## Download

You can download your project code for local development, self-hosting, or simply backup.

<Note>
  To download your projects, you need to upgrade to a paid plan.
</Note>

### How to download your projects

1. Enter the project and wait for it's initiation
2. Click the <Icon icon="download" /> **Download**
3. Your code will be compressed in zip and downloaded to your device.

<img />

### How to download a specific version

1. Enter the project and wait for it's initiation
2. Click <Icon icon="history" /> **Show history**
3. Hover on the version you want to download and click the <Icon icon="download" /> **Download**
4. Your code will be compressed in zip and downloaded to your device.

## Rename and delete

Your project name is autogenerated by AI; you can rename your projects at any time with no impact. You may also delete projects that are no longer needed.

### How to rename your projects

1. Go to [your profile page](https://same.new/users/me)
2. Click <Icon icon="ellipsis" /> of the project you want to rename
3. Click <Icon icon="pencil" /> **Rename** to initiate rename
4. Confirm and save

### How to delete your projects

1. Go to [your profile page](https://same.new/users/me)
2. Click <Icon icon="ellipsis" /> of the project you want to delete
3. Click <Icon icon="trash" /> **Delete** to initiate delete
4. Confirm and delete

## Advanced management

Same uses [bun](https://bun.sh/) as the default runtime. You can customize your project setup commands your preferred.

### How to manage your project setup commands

1. Enter the project and wait for it's initiation
2. Click <Icon icon="settings" /> **Project Settings**
3. Edit the project directory, install, build, and start dev server commands
4. Save and refresh


# Prompting
Source: https://docs.same.new/essentials/prompting

Learn how to effectively communicate with Same AI to build your projects. Tips for clear prompts, providing context, and getting better results.

## What is prompting?

Prompting is how you communicate with Same to build your project. Treat a chat as a conversation with Same, where every message is a prompt.

*Remember, Same is not a human, so it is important to be clear and concise in your prompts.*

## Simple prompts

Each prompt should relate to a single task or change. This helps keep Same focused on a single task and improves the quality of the output.

Instead of: "Rebuild the entire dashboard with a new design and add analytics."

Try:

1. "Update the color scheme using these hex codes: #..."
2. "Refactor the dashboard Card component to use Tailwind CSS."
3. "Add a chart component here to display user signups."
4. "Add analytics tracking for button clicks."

This helps Same focus and makes it easier to review changes.

### Simple chats

Start new chats frequently. Treat each chat as a single task or feature.

**Benefits:**

* **Cost Control:** Prevents context windows from becoming too large, reducing token usage.
* **Accuracy:** Keeps Same focused on the current task without confusion from old context.
* **Debugging:** Makes it easier to isolate issues within a shorter history.

**When to start a new chat:**

* After completing a feature.
* When switching to a significantly different task.
* If the chat history becomes very long or Same seems confused.

<Tip>
  Use the "New Chat" button (<Icon icon="message-circle-plus" /> icon, top-right in chat panel)
  to start fresh.
</Tip>

### Be specific

Here is an example of a prompt that is not effective:

```md theme={null}
the dropdown menu isn't working and the button should be green
```

This prompt has several issues:

1. Did not provide **context** on which dropdown menu isn't working.
2. Did not describe what **specifically** isn't working.
3. Added another bug report **along** with it.

When prompting Same, it is paramount to provide as much context as you can, while keeping your prompt lean of any extraneous details (such as the second bug report in the example).

Here is a better version of the prompt:

```md theme={null}
The "choose provider" dropdown doesn't expand when I click on it. Could you fix this?
```

With this prompt, we provided **the exact** dropdown that isn't working and mentioned **how** it isn't working. We also provided a note to Same that we would like it to fix the issue, which communicates our intent clearly.

### Things Same should *not* be asked to do

To avoid unnecessary errors or confusion, keep in mind:

* **Do not ask Same for token estimates.**\
  Same does not have access to internal token counts and any guess would be unreliable. You can keep an eye on your token usage by clicking on your profile icon or going to the [settings page](https://same.new/settings) ([learn more](https://localhost:3000/usage/tokens#monitoring-your-usage)).
* **Do not ask for downloadable ZIPs.**\
  While Same can generate or modify files, packaging and serving a ZIP is outside its capabilities. Instead, use the download button in your project ([learn more](/essentials/project-management#download)).
* **Do not ask Same to revert files or changes.**\
  Use the built-in [version control](/essentials/version-control) system for reverting to previous states. This is more reliable and keeps the chat focused.

## Providing context

While Same can search your codebase on its own, providing context directly will help same better understand your needs.

* **Links:** Provide URLs to documentation, examples, or inspiration.
  ```md theme={null}
  Use the styling from this example: https://ui.shadcn.com/docs/components/button
  ```
* **Files & Summaries:** Use the `@ Add context` button in the chat input.
  * Select specific project files Same needs to read or modify.
  * Include summaries of previous relevant chats.
* **Conversation History:** Refer to previous messages or decisions within the current chat.

<Tip>
  Using `@ Add context` is more efficient than asking Same to search for
  information.
</Tip>

<Frame>
  <img alt="Screenshot showing the '@ Add context' button in the chat input area." />
</Frame>

## Guiding Same's actions

Usually, prompts are handled as a one-shot action, where Same will attempt to complete the task in one go. When working with complex tasks, it might be helpful to guide Same through the process step-by-step.

For example, you could use the phrases like:

1. "Create a **plan** for implementing the new user profile feature."
2. "Investigate and provide a **report** for the bug in the payment flow."
3. "What are **three ways** we can improve the performance of this page?"

This instructs Same to think and plan before proceeding with the expected action.

## Reviewing and iterating

Same shows code changes (diffs) and updates the live preview.

1. **Review Diffs:** Check the tool invocation blocks to see what code changed.
2. **Check Preview:** Verify the visual changes in the live preview panel.
3. **Give Feedback:** If needed, tell Same what to adjust. Be specific.
   ```md theme={null}
   Make the button smaller and change the text color to white in dark mode.
   ```

## Editing your messages

If you need to change a previous instruction:

1. Hover over your message.
2. Click the **pencil icon**.
3. Edit the text.
4. Submit the changes.

Same will process the updated instruction. You may be asked if you want to revert the project state to that point, which would clear subsequent messages.

<Frame>
  <img alt="Screenshot showing the edit icon appearing on hover over a user message." />
</Frame>

## Reverting when things go wrong

It is important to keep in mind that generative AI, including Same, is not perfect. It may make mistakes or create unwanted changes.

If this happens, you can always [revert your project](/essentials/version-control) to a previous state or check out our [troubleshooting guide](/essentials/troubleshooting).


# Troubleshooting
Source: https://docs.same.new/essentials/troubleshooting

Troubleshoot common issues with Same AI. Learn how to resolve problems, provide better feedback, and recover when things go wrong.

## How to troubleshoot when things go wrong

Same.new uses the power of AI, or more specifically: LLMs, to bring your prompts to life. Sometimes, these LLMs may not work as expected.

Here are some tips to troubleshoot Same (our AI) effectively.

## Reviewing Same's output (chat history)

In the chat history, you will see diffs of the changes made, files viewed, and commands executed. This helps you understand what Same did and why:

<img />

When Same generates code or makes changes, it will also provide a summary of what it did. Review this summary to ensure it aligns with your expectations:

<img />

Always compare the changes with the generated summary to confirm that Same understood your request and executed it correctly.

## Reviewing your website

After Same makes changes, check the live preview of your website. This helps you see the actual impact of the changes made.

<img />

If something doesn't look right, don't panic.

## Reverting or adjusting changes

If the changes made by Same are not what you expected, you can either:

1. **Give Feedback:** Provide specific feedback to Same about what needs to be adjusted.
   ```md theme={null}
   The button is too large, and the text color in dark mode is not visible.
   ```
2. **Revert Changes:** If the changes are not satisfactory, you can [revert to a previous state](/essentials/version-control#restoring-and-reverting) of your project. This will restore your project to a known good state, before the changes were made.

Reverting can be a better option if you are looking for better performance and lower costs as it keeps the context window smaller.

Alternatively, moving forward and providing feedback allows Same to improve the existing changes rather than starting over.

It's up to you to decide which approach works best for your situation.

## Common issues and how to handle them

Sometimes, even with careful prompting, things may not go as expected. Below are some common pitfalls and how to approach each of them when using Same.

### Same fails to implement your request (sometimes loops or stalls)

This can happen when the prompt is too broad, contains multiple tasks, or lacks enough context. To resolve:

* **Ask Same to think first.** You can prompt Same with:
  ```
  Before making any changes, create a plan for implementing this feature.
  ```
* **Provide context.** Use the `@ Add context` button to include relevant files, code snippets, or summaries ([learn more](/essentials/prompting#providing-context)).
* **One task at a time.** Break complex changes into small prompts and submit them individually.
* **Create new chats.** Starting over with a fresh chat often improves accuracy and reduces confusion, especially if looping occurs.
* **Chat with Same.** Feel free to discuss ideas or constraints with Same before requesting implementation. This can surface edge cases or reveal misunderstandings early.

### Same breaks or mangles code

If your website breaks, or existing features are accidentally changed:

1. **Revert to a previous state.** Reverting avoids compounding the problem and helps reduce token usage in long chats.
2. **Then re-prompt.** Try again with a new chat and improved instructions:
   * Add limits:
     ```
     Do not modify any existing CSS classes or unrelated components.
     ```
   * Explain what went wrong:
     ```
     You removed the login modal, which wasn't part of the request. Please preserve existing functionality.
     ```

Starting fresh with better constraints usually leads to better results than trying to repair an over-complicated chat history.

### Same uses too many tokens (or gets slow/confused)

LLMs perform best in short, focused conversations. If you're running into performance issues:

* **Start a new chat.** Large chats increase token usage and slow down response quality.
* **Narrow the scope.** Provide only the necessary files or summaries with `@ Add context` ([learn more](/essentials/prompting#providing-context)).
* **Be direct.** Avoid vague or compound requests. Instead, explicitly state the task and scope.


# Version control
Source: https://docs.same.new/essentials/version-control

Version control in Same.new lets you track changes, undo edits, and collaborate across app versions. Build safely with full history and rollback.

Same automatically saves checkpoints of your project as you work.

## Checkpoints

Checkpoints are created automatically:

1. **After agent actions:** When Same edits, creates, or deletes files. The checkpoint is linked to the agent's message block.
2. **For user messages:** Capturing the project state *before* your instruction was processed.

This creates a detailed history of your prompts and Same's actions.

## Viewing History

Major versions (created when Same explicitly versions the project) are shown in the **Version History** panel.

1. Click the **Clock icon** in the top-right of the chat panel.
2. A dropdown shows major versions and the latest state.

<img alt="Screenshot showing the clock icon and the version history tab." />

## Reverting to a Version

You can revert to a specific version to restore your project to a previous state.

<Steps>
  <Step title="Preview a Version">
    Click the **preview button** on the version you would like to preview. This (temporarily) sets your project to the given version, allowing you to preview and assess the version.

    <img alt="Screenshot the actions for a version in the list." />
  </Step>

  <Step title="Rollback to the Version">
    Once you have reviewed the version and decide to revert back to it, click the **Rollback** button to **permanently revert** back to that version.  Clicking this **permanently** resets the project to that state. All later messages and changes are **deleted**. Use with caution.

    <img alt="Screenshot the controls for a version (while previewed)." />
  </Step>
</Steps>

## Reverting to a Checkpoint

You can interact with checkpoints associated with user messages and agent actions.

<Steps>
  <Step title="Preview a Checkpoint">
    Click **Rollback to message** next to a message or action block. This loads a **preview** of the project state at that point in the workbench (editor, preview, terminal).

    <img alt="Screenshot showing the 'Rollback' button next to a message." />
  </Step>

  <Step title="Revert to a Checkpoint">
    After restoring (previewing) a checkpoint, the button changes to **Revert to message**. Clicking this **permanently** resets the project to that state. All later messages and changes are **deleted**. Use with caution.

    *Note: You can create a [Remix](/essentials/project-management#remix) of your project to retain the history before you revert.*

    <Note>
      Restoring/reverting a user message loads the state *before* that message
      was processed.
    </Note>

    <img alt="Screenshot showing the 'Revert to message' button on a user message block." />
  </Step>

  <Step title="Return to Latest State (Exit Preview)">
    If you are previewing an older checkpoint and want to return to the current state *without* reverting:

    1. Click the **Clock icon**.
    2. Select **"Latest changes"** at the top.
       The workbench will reload the most recent project state.

    <img alt="Screenshot highlighting the 'Latest changes' option in the version history dropdown." />
  </Step>
</Steps>


# FAQ
Source: https://docs.same.new/get-started/faq

Explore the Same.new FAQ, how it works, what you can build, and how to get started with our no-code AI app builder.

## Capabilities and Limitations

<AccordionGroup>
  <Accordion title="What is Same?">
    Same is an AI-powered platform that helps you build, iterate, and manage websites and web applications simply by describing what you need.
  </Accordion>

  <Accordion title="How can Same build full-stack applications?">
    Same uses the [Next.js](https://nextjs.org/) framework by default, which enables full-stack development with both frontend and backend capabilities in a single codebase.

    **Key features:**

    * React-based frontend development
    * API routes for backend logic
    * Built-in TypeScript/JavaScript support
    * Easy integration with databases, authentication providers, and payment platforms
    * Production-ready deployment options

    This approach allows you to create complete, scalable applications without managing separate frontend and backend codebases.
  </Accordion>

  <Accordion title="What programming languages does Same support?">
    Same supports multiple programming languages, with **JavaScript and TypeScript** being the primary languages due to our Next.js foundation.

    While you can use other languages, Same works best with the JavaScript/TypeScript ecosystem.
  </Accordion>

  <Accordion title="Can I transfer my Same project to WordPress?">
    **No, not directly.** Same projects are built with Next.js, which uses a completely different architecture than WordPress.

    **Your options:**

    * Download your code and deploy it independently
    * Manually recreate your design in WordPress
    * Use Same to generate static HTML/CSS that you can adapt for WordPress themes
  </Accordion>

  <Accordion title="Can I use Same to build mobile apps?">
    **Same is designed for web applications**, not native mobile apps. However, you have several options:

    **What Same can do:**

    * Build responsive web apps that work perfectly on mobile browsers
    * Create Progressive Web Apps (PWAs) that feel like native apps
    * Generate mobile-optimized designs and layouts

    <Tip>
      Pro tip: Ask Same to create responsive designs that automatically adapt to mobile screens for the best mobile web experience.
    </Tip>
  </Accordion>
</AccordionGroup>

## Subscriptions and Accounts

<AccordionGroup>
  <Accordion title="How do I upgrade my subscription plan?">
    **To upgrade your subscription plan:**

    1. Navigate to [same.new/settings](https://same.new/settings)
    2. Click **"Manage Subscription"**
    3. Select your desired plan and confirm it
    4. Complete the payment process

    **What happens after the upgrade:**

    * **Immediate billing** for the new plan
    * **New tokens** from your new plan arrive within minutes
    * **Unused tokens** from your previous plan are credited and used first
    * **Billing cycle resets** to your new plan's schedule
  </Accordion>

  <Accordion title="How do I downgrade my subscription plan?">
    **To downgrade your subscription plan:**

    1. Navigate to [same.new/settings](https://same.new/settings)
    2. Click **"Manage Subscription"**
    3. Select your desired plan and confirm it

    **What happens after the downgrade:**

    * Your subscription will be **scheduled** to the new plan from your **next billing cycle**.
  </Accordion>

  <Accordion title="How do I cancel my subscription?">
    **To cancel your subscription:**

    Visit your [settings page](https://same.new/settings) and click the cancellation button.

    <Note>
      **Important details:**

      * Your subscription remains active until the end of your current billing period
      * After cancellation, your account automatically reverts to the Free plan
      * You may still incur charges for token usage that exceeds your subscription limits after cancellation
    </Note>
  </Accordion>

  <Accordion title="How do I request a refund?">
    **Our refund policy:**

    Subscriptions are **final and non-refundable**. However, we understand that technical issues can significantly impact your experience.

    **When we may offer compensation:**

    * Serious technical issues that prevent you from using Same
    * Platform outages or bugs that affect your projects
    * Service disruptions beyond your control

    **To request assistance:**

    Email our support team at [support@same.dev](mailto:support@same.dev) with:

    1. **Detailed description** of the issue you experienced
    2. **Screenshots** of any error messages
    3. **Project link** (if applicable)
    4. **Timeline** of when the issue occurred

    We review each case individually and may provide token credits as compensation based on the severity and impact of the issue.
  </Accordion>

  <Accordion title="What was your previous pricing model?">
    **Previous pricing structure (now discontinued):**

    * **Free Plan:** 500,000 tokens per month with community support
    * **Pro Plan:** \$10/month for 2 million tokens
      * Additional usage: $10 per 2 million tokens ($5 per million tokens)

    This pay-as-you-go model has been replaced with our current fixed-tier plans to provide more predictable pricing.
  </Accordion>
</AccordionGroup>


# Welcome
Source: https://docs.same.new/get-started/introduction

Get started with Same.new, build AI apps for free and launch using just a prompt. Trusted by 600,000+ builders. No code required.

Same incorporates the most powerful AI models with the most capable agentic environment to let you build, iterate, run, and manage your web apps.

## Get Started

<CardGroup>
  <Card title="Quickstart" href="/get-started/quick-start" icon="sparkles">
    Your step-by-step guide for getting started.
  </Card>

  <Card title="Build basics" href="/essentials/prompting" icon="terminal">
    Understand how to give instructions and provide context effectively.
  </Card>

  <Card title="Version control" href="/essentials/version-control" icon="git-branch">
    See how project history is saved and how to revert changes.
  </Card>

  <Card title="Deploy" href="/essentials/deploying" icon="rocket">
    Learn how to deploy your projects to the web.
  </Card>
</CardGroup>

## Need Help?

<CardGroup>
  <Card title="Community Discord" href="https://discord.gg/tjHuQJaPsy" icon="discord">
    Ask questions and connect with other users and the Same team.
  </Card>
</CardGroup>


# Quickstart
Source: https://docs.same.new/get-started/quick-start

This guide shows you how to build and deploy your first website or web application in Same.new using a prompt. No coding experience needed.

Working with Same is easy. Just talk to Same - describe what you want, share reference, or ask for suggestions. Still, to spark inspiration and make your experience even smoother, we’ve created this quick guide.

<Icon icon="sparkles" /> **Let's get started:**

## 1. Create a project

Same lets you start your project effortlessly - whether you have a design in hand, just an idea, or you're looking to explore. Choose one of the options below to begin:

<AccordionGroup>
  <Accordion title="Start from a design you love">
    If you have an existing design you want to replicate:

    1. **Paste a URL** into the input field. Same will visit the website and generate a clone.
    2. Or, **upload an image** (screenshot or mockup). Same will analyze the image and build the project accordingly.
  </Accordion>

  <Accordion title="Describe what you have in mind">
    If you're starting from scratch or a concept:

    1. **Type a description** of the project you want to build into the input field.
    2. Be as specific or as vague as you want, you can iterate after the initial version is complete.
  </Accordion>

  <Accordion title="Browse ideas to spark your project">
    If you're looking to explore new ideas:

    1. **Browse the gallery** to discover community projects
    2. Pick one you like and click the <Icon icon="shuffle" /> **Remix**
    3. Tweak and refine it to match your idea
  </Accordion>
</AccordionGroup>

## 2. Refine your project

You can view and interact with your project directly in the <Icon icon="app-window" /> **App tab** . Same provides you the flexibility to edit specific elements, or add new functions as needed.

<AccordionGroup>
  <Accordion title="Select and edit specific elements">
    You can quickly make changes to any part of your page by:

    1. Click the <Icon icon="pointer" /> **Select** to start
    2. Click on the text, image, or whatever elements you want to change
    3. **Edit it directly** in the panel, the changes will be reflected realtime
    4. Or **describe the changes** you'd like to apply and send it to Same

    <Tip>
      You can not only adjust the look of the selected elements, but also any function and logic related. For example, try:

      ```md theme={null}
      Disable the button when the verification failed
      ```

      ```md theme={null}
      Add the product to the cart when clicking it
      ```
    </Tip>
  </Accordion>

  <Accordion title="Add new functions with natural language">
    Describe what you want to add - like "Add multi-language support", "Add authentication integration" - and Same will build it for you automatically.

    <Tip>
      To have better control of the result, give Same smaller, sequential instructions.
    </Tip>
  </Accordion>

  <Accordion title="Ask Same for suggestions">
    When you feel unsure about what to do next, simply ask Same for recommendations during your workflow. For example, try:

    ```md theme={null}
    How to send emails to my potential clients filled the form?
    ```
  </Accordion>
</AccordionGroup>

## 3. Deploy your project

When you deploy, your project goes live for the world to see. We encourage frequent deployments to test early, collect feedback, and iterate quickly. While you can wait until everything is perfect, remember — only live projects can grow and evolve.

You can click the **Deploy** button in the upper right corner of your workspace or simply tell Same to deploy:

```md theme={null}
Deploy my project
```

## 4. Continue your journey

Now that you have completed the initial setup, here are a few things you can try next to improve your project:

<CardGroup>
  <Card title="Build basics" href="/essentials/prompting" icon="terminal">
    Understand how to give instructions and provide context effectively.
  </Card>

  <Card title="Version control" href="/essentials/version-control" icon="git-branch">
    See how project history is saved and how to revert changes.
  </Card>

  <Card title="Deploy" href="/essentials/deploying" icon="rocket">
    Learn how to publish your project and manage it.
  </Card>

  <Card title="Maximizing performance" href="/performance/maximizing-performance" icon="lightbulb">
    Best practices for efficient development with Same.
  </Card>
</CardGroup>


# Clerk for authentication
Source: https://docs.same.new/integrations/clerk

Connect Clerk Auth to Same.new to add secure login, signup, and sessions to your project. Set up in minutes.

## What is Clerk?

[Clerk](https://clerk.com/) is a complete **user management** solution for modern web applications. It provides **authentication**, **user profiles**, **session management**, and **access control**. Clerk can be easily integrated to simplify building user-centric apps.

When you connect Same with Clerk, you can use natural language to:

* Set up authentication flows and UI for sign-up and login
* Manage user sessions, roles, and permissions
* Retrieve and update user profile data directly within your project

## Get started with Clerk

We recommend connecting to Clerk through MCP

<Steps>
  <Step title="Open MCP tools panel">
    Click **Tools** and open the panel.

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Connect to Clerk MCP">
    Find the card for Clerk and click **Add Clerk**

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Set up your Clerk account">
    Follow the instructions to create a Clerk application for your project. You may need to sign up for an account if you don't have one yet.

    <Info>
      Clerk provides free plans for new users. [Check Clerk's pricing](https://clerk.com/pricing).
    </Info>
  </Step>

  <Step title="Add Clerk authentication to your project">
    Once the connection is successful, directly ask Same to:

    ```md theme={null}
    Add authentication to my project with Clerk
    ```

    Same will automatically set up the authentication foundation for your project.
  </Step>

  <Step title="Set up your Clerk API keys">
    To fully integrate with Clerk, you need to copy your API keys to your `.env` file. You can directly ask Same for detailed instructions:

    ```
      How to set up my Clerk API keys in my project?
    ```

    <Note>
      Clerk has different keys for test environment (where you are building) and live environment (where your app is published). You can use the test environment keys first, then switch to live environment keys when you deploy. [Learn how to deploy your Clerk app to live environment](https://clerk.com/docs/deployments/overview#api-keys-and-environment-variables)
    </Note>
  </Step>
</Steps>

## Sample prompts with Clerk

Here are some sample prompts you can try with Clerk to discover its full functionality:

<AccordionGroup>
  <Accordion title="Add Clerk authentication to your project">
    ```md theme={null}
    Add authentication to my project with Clerk
    ```
  </Accordion>

  <Accordion title="Design organization authentication for your SaaS app">
    ```md theme={null}
    Design and create a role and permission system for my project with auth
    ```
  </Accordion>
</AccordionGroup>


# GitHub for version control
Source: https://docs.same.new/integrations/github

Connect your GitHub repo to Same.new to sync code, track changes, and streamline full-stack app development with prompt-powered workflows.

## What is GitHub?

[GitHub](https://github.com/) is a **code hosting platform** for **version control** and **collaboration**. It allows you to store your code, track changes, and work with others on projects.

When you connect Same with GitHub, you can use natural language to:

* Create and manage repositories for your projects
* Push your project code to GitHub automatically
* Track changes and maintain version history

## Get started with GitHub

We recommend connecting to GitHub through MCP

<Steps>
  <Step title="Open MCP tools panel">
    Click **Tools** and open the panel

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Connect to GitHub MCP">
    Find the card for GitHub and click **Add GitHub**

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Authorize the connection">
    Follow the page instructions to approve the connection. You may need to sign up for an account if you don't have one yet.

    <Info>
      GitHub is free for personal users.
    </Info>
  </Step>

  <Step title="Create a repository for your project">
    Once the connection is successful, directly ask Same to:

    ```md theme={null}
    Create a GitHub repository for my project and push my code
    ```

    Same will automatically create a repository and push your project code to GitHub.
  </Step>
</Steps>

## Sample prompts with GitHub

Here are some sample prompts you can try with GitHub:

<AccordionGroup>
  <Accordion title="Create a repository and push code">
    ```md theme={null}
    Create a GitHub repository for my project and push my code
    ```
  </Accordion>

  <Accordion title="Update your repository">
    ```md theme={null}
    Push my latest changes to GitHub
    ```
  </Accordion>

  <Accordion title="Create a new branch">
    ```md theme={null}
    Create a new branch for feature development
    ```
  </Accordion>
</AccordionGroup>


# Neon for database
Source: https://docs.same.new/integrations/neon

Learn how to integrate Neon Database with Same.new. Add a Postgres-powered backend to your AI apps and deploy from a prompt, no setup required.

## What is Neon?

[Neon](https://neon.tech) is a fully managed, serverless **PostgreSQL database** designed for modern development. It separates storage and compute for autoscaling, enables instant branching for safe experimentation, and supports rich collaboration workflows.

<Note>
  A database stores, organizes, and retrieves data for your project. With a database, you can persist user data, content, and configurations — even after the app is closed or restarted.
</Note>

When you connect Same with Neon, you can use natural language to:

* Have Same design and build a schema that fits your project
* Spin up and manage database branches for safe testing
* Explore and analyze your data without leaving your Same workspace

## Get started with Neon

We recommend connecting to Neon through MCP

<Steps>
  <Step title="Open MCP tools panel">
    Click **Tools** and open the panel

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Connect to Neon MCP">
    Find the card for Neon and click **Add Neon**

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Authorize the connection">
    Follow the page instructions to approve the connection. You may need to sign up for an account if you don't have one yet.

    <Info>
      Neon provides free plans for new users. [Check Neon's pricing](https://neon.com/pricing).
    </Info>
  </Step>

  <Step title="Design and connect to a database with Neon">
    Once the connection is successful, directly ask Same to:

    ```md theme={null}
    Design the database schema for my project and connect it to a new Neon project
    ```

    Same will automatically manage everything for you, from Neon project creation and database schema design to final connection and migration.
  </Step>
</Steps>

## Sample prompts with Neon

Here are some sample prompts you can try with Neon to discover its full functionality:

<AccordionGroup>
  <Accordion title="Connect your project to a database">
    ```md theme={null}
      Design the database schema for my project and connect it to a new Neon project

    ```
  </Accordion>

  <Accordion title="Branch database before developing a major functionality">
    ```md theme={null}
      Create a new database branch
    ```
  </Accordion>

  <Accordion title="Query and analyze data">
    ```md theme={null}
      What's the stock of each active product I have?
    ```
  </Accordion>
</AccordionGroup>


# Integrations
Source: https://docs.same.new/integrations/overview

Setup integration with Same.new. Connect to GitHub, Supabase, Neon, and Clerk to power full-stack apps by AI, built and deployed from a prompt.

## MCP integrations

[MCP](https://modelcontextprotocol.io/introduction) is an open protocol that standardizes how applications provide context to large language AI models.

We recommend using MCP integrations with Same to extend our AI system's capabilities in several ways:

* Seamlessly integrate with third-party platforms and services
* Streamline your development workflow through automated processes
* Access rich contextual information from integrated tools
* More possibilities waiting for your exploration...

### Featured

<CardGroup>
  <Card
    title="GitHub"
    href="/integrations/github"
    icon={
    <svg
      width="25"
      height="25"
      viewBox="0 0 1024 1024"
      fill="currentColor"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M512 0C229.12 0 0 229.12 0 512c0 226.56 146.56 417.92 350.08 485.76 25.6 4.48 35.2-10.88 35.2-24.32 0-12.16-0.64-52.48-0.64-95.36-128.64 23.68-161.92-31.36-172.16-60.16-5.76-14.72-30.72-60.16-52.48-72.32-17.92-9.6-43.52-33.28-0.64-33.92 40.32-0.64 69.12 37.12 78.72 52.48 46.08 77.44 119.68 55.68 149.12 42.24 4.48-33.28 17.92-55.68 32.64-68.48-113.92-12.8-232.96-56.96-232.96-252.8 0-55.68 19.84-101.76 52.48-137.6-5.12-12.8-23.04-65.28 5.12-135.68 0 0 42.88-13.44 140.8 52.48 40.96-11.52 84.48-17.28 128-17.28 43.52 0 87.04 5.76 128 17.28 97.92-66.56 140.8-52.48 140.8-52.48 28.16 70.4 10.24 122.88 5.12 135.68 32.64 35.84 52.48 81.28 52.48 137.6 0 196.48-119.68 240-233.6 252.8 18.56 16 34.56 46.72 34.56 94.72 0 68.48-0.64 123.52-0.64 140.8 0 13.44 9.6 29.44 35.2 24.32C877.44 929.92 1024 737.92 1024 512 1024 229.12 794.88 0 512 0z"
      />
    </svg>
    }
  >
    Version control and collaborative development platform
  </Card>

  <Card
    title="Neon"
    href="/integrations/neon"
    icon={
    <svg
      xmlns="http://www.w3.org/2000/svg"
      width="24"
      height="24"
      viewBox="0 0 28 28"
      fill="currentColor"
    >
      <path
        fillRule="evenodd"
        d="M0 4.828C0 2.16 2.172 0 4.851 0h18.436c2.679 0 4.85 2.161 4.85 4.828V20.43c0 2.758-3.507 3.955-5.208 1.778l-5.318-6.809v8.256c0 2.4-1.955 4.345-4.367 4.345H4.851C2.172 28 0 25.839 0 23.172zm4.851-.966a.97.97 0 0 0-.97.966v18.344c0 .534.435.966.97.966h8.539c.268 0 .34-.216.34-.483v-11.07c0-2.76 3.507-3.956 5.208-1.779l5.319 6.809V4.828c0-.534.05-.966-.485-.966z"
        clipRule="evenodd"
      />
      <path d="M0 4.828C0 2.16 2.172 0 4.851 0h18.436c2.679 0 4.85 2.161 4.85 4.828V20.43c0 2.758-3.507 3.955-5.208 1.778l-5.318-6.809v8.256c0 2.4-1.955 4.345-4.367 4.345H4.851C2.172 28 0 25.839 0 23.172zm4.851-.966a.97.97 0 0 0-.97.966v18.344c0 .534.435.966.97.966h8.539c.268 0 .34-.216.34-.483v-11.07c0-2.76 3.507-3.956 5.208-1.779l5.319 6.809V4.828c0-.534.05-.966-.485-.966z" />
      <path d="M23.287 0c2.679 0 4.85 2.161 4.85 4.828V20.43c0 2.758-3.507 3.955-5.208 1.778l-5.319-6.809v8.256c0 2.4-1.954 4.345-4.366 4.345a.484.484 0 0 0 .485-.483V12.584c0-2.758 3.508-3.955 5.21-1.777l5.318 6.808V.965a.97.97 0 0 0-.97-.965" />
    </svg>
    }
  >
    Serverless Postgres database
  </Card>

  <Card
    title="Supabase"
    href="/integrations/supabase"
    icon={
    <svg
      width="24"
      height="24"
      viewBox="0 0 109 113"
      fill="currentColor"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path d="M63.7076 110.284C60.8481 113.885 55.0502 111.912 54.9813 107.314L53.9738 40.0627L99.1935 40.0627C107.384 40.0627 111.952 49.5228 106.859 55.9374L63.7076 110.284Z" />
      <path d="M63.7076 110.284C60.8481 113.885 55.0502 111.912 54.9813 107.314L53.9738 40.0627L99.1935 40.0627C107.384 40.0627 111.952 49.5228 106.859 55.9374L63.7076 110.284Z" />
      <path d="M45.317 2.07103C48.1765 -1.53037 53.9745 0.442937 54.0434 5.041L54.4849 72.2922H9.83113C1.64038 72.2922 -2.92775 62.8321 2.1655 56.4175L45.317 2.07103Z" />
    </svg>
    }
  >
    Open source Firebase alternative with Postgres, Auth, Storage, and more
  </Card>

  <Card
    title="Clerk"
    href="/integrations/clerk"
    icon={
    <svg
      width="25"
      height="25"
      viewBox="2 0 28 28"
      fill="currentColor"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path d="M25.0679 24.3328L21.7628 21.0277C21.659 20.9242 21.5235 20.8585 21.3779 20.8411C21.2324 20.8236 21.0852 20.8554 20.9598 20.9313C19.734 21.6708 18.3296 22.0616 16.8981 22.0616C15.4666 22.0616 14.0622 21.6708 12.8364 20.9313C12.7108 20.8562 12.5638 20.8249 12.4184 20.8423C12.2731 20.8597 12.1376 20.925 12.0334 21.0277L8.72826 24.3328C8.62469 24.4337 8.55705 24.5657 8.53571 24.7087C8.51436 24.8516 8.5405 24.9977 8.6101 25.1244C8.65705 25.2087 8.72209 25.2816 8.80053 25.3378C11.1532 27.0482 13.9871 27.9695 16.8958 27.9695C19.8045 27.9695 22.6384 27.0482 24.9911 25.3378C25.0692 25.2815 25.1341 25.209 25.1814 25.1252C25.2288 25.0414 25.2574 24.9484 25.2653 24.8525C25.2721 24.7567 25.258 24.6606 25.2239 24.5709C25.1898 24.4811 25.1366 24.3999 25.0679 24.3328ZM25.0702 4.06393L21.7663 7.36789C21.6627 7.47215 21.5269 7.53839 21.3809 7.55588C21.235 7.57337 21.0874 7.54109 20.9621 7.46426C19.2519 6.43354 17.2137 6.09177 15.2608 6.50825C13.3079 6.92473 11.5865 8.06829 10.4456 9.70705C9.57967 10.9541 9.09282 12.4251 9.04374 13.9425C8.99337 15.46 9.38302 16.9596 10.1657 18.2606C10.2413 18.3858 10.273 18.5327 10.2558 18.6779C10.2385 18.8232 10.1733 18.9585 10.0705 19.0625L6.76539 22.3665C6.69923 22.4341 6.61911 22.4865 6.53062 22.5201C6.44213 22.5536 6.34739 22.5673 6.25302 22.5605C6.15864 22.5536 6.06691 22.5262 5.98421 22.4802C5.90151 22.4342 5.82984 22.3708 5.7742 22.2942C3.70405 19.4494 2.80237 15.9197 3.25451 12.4306C3.70665 8.94152 5.47826 5.75821 8.20513 3.53507C10.5595 1.61356 13.484 0.525844 16.5218 0.441789C19.5596 0.357734 22.5398 1.28207 24.9968 3.07045C25.0735 3.12612 25.137 3.1979 25.183 3.28074C25.229 3.36358 25.2563 3.45547 25.263 3.54998C25.27 3.6445 25.2564 3.73942 25.2231 3.82816C25.1899 3.9169 25.1377 3.99735 25.0702 4.06393ZM16.9044 18.1299C17.4207 18.1299 17.9319 18.0282 18.4089 17.8306C18.8859 17.633 19.3193 17.3434 19.6844 16.9783C20.0495 16.6133 20.3391 16.1799 20.5366 15.7029C20.7342 15.2259 20.8359 14.7147 20.8359 14.1984C20.8359 13.6821 20.7342 13.1708 20.5366 12.6939C20.3391 12.2169 20.0495 11.7835 19.6844 11.4184C19.3193 11.0533 18.8859 10.7637 18.4089 10.5662C17.9319 10.3686 17.4207 10.2669 16.9044 10.2669C15.8617 10.2669 14.8617 10.6811 14.1244 11.4184C13.3871 12.1557 12.9729 13.1557 12.9729 14.1984C12.9729 15.2411 13.3871 16.241 14.1244 16.9783C14.8617 17.7156 15.8617 18.1299 16.9044 18.1299Z" />
    </svg>
    }
  >
    Authentication and user management
  </Card>
</CardGroup>

### Custom MCP

You can add any MCP server to Same. Simply navigate to the **MCP Tools** panel and connect as you wish.
Explore some [Example MCP servers](https://modelcontextprotocol.io/examples) here.

<Frame>
  <img />
</Frame>


# Supabase for database
Source: https://docs.same.new/integrations/supabase

Set up Supabase integration in Same.new. Add real-time auth, Postgres, and storage to your AI apps. No manual configuration required.

## What is Supabase?

[Supabase](https://supabase.com/) is an open source backend service provider of **PostgreSQL database**, **authentication**, **real-time subscriptions**, and **serverless functions**. It combines multiple tools into a unified platform for building scalable applications.

<Note>
  A database stores, organizes, and retrieves data for your project. With a database, you can persist user data, content, and configurations — even after the app is closed or restarted.
</Note>

When you connect Same with Supabase, you can use natural language to:

* Have Same design and build a schema that fits your project
* Have Same integrate with Supabase's authentication to manage your users
* Explore and analyze your data without leaving your Same workspace

## Get started with Supabase

We recommend connecting to Supabase through MCP

<Steps>
  <Step title="Open MCP tools panel">
    Click **Tools** and open the panel

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Connect to Supabase MCP">
    Find the card for Supabase and click **Add Supabase**

    <Frame>
      <img />
    </Frame>
  </Step>

  <Step title="Authorize the connection">
    Follow the page instructions to approve the connection. You may need to sign up for an account if you don't have one yet.

    <Info>
      Supabase provides free plans for new users. [Check Supabase's pricing](https://supabase.com/pricing).
    </Info>
  </Step>

  <Step title="Design and connect to a database with Supabase">
    Once the connection is successful, directly ask Same to:

    ```md theme={null}
    Design the database schema for my project and connect it to a new Supabase project
    ```

    Same will automatically manage everything for you, from Supabase project creation and database schema design to final connection and migration.
  </Step>
</Steps>

## Sample prompts with Supabase

Here are some sample prompts you can try with Supabase to discover its full functionality:

<AccordionGroup>
  <Accordion title="Connect your project to a database">
    ```md theme={null}
      Design the database schema for my project and connect it to a new Supabase project

    ```
  </Accordion>

  <Accordion title="Add authentication to your project with Supabase">
    ```md theme={null}
      Add authentication to my project with Supabase
    ```
  </Accordion>

  <Accordion title="Query and analyze data">
    ```md theme={null}
      What's the stock of each active product I have?
    ```
  </Accordion>
</AccordionGroup>


# Cancel subscription
Source: https://docs.same.new/usage/cancel-subscription

Need to cancel your Same.new subscription? Learn how to manage your plan and stop future billing. You can downgrade or switch plans anytime.

## How to Cancel Your Subscription

You can easily cancel your Same subscription through the settings page. Here's how:

1. Go to [same.new/settings](https://same.new/settings)
2. Navigate to the **Subscription & Usage** section
3. Click on the **Cancel** button

<Info>
  Your subscription will remain active until the end of your current billing
  period. After that, your account will revert to the Free plan with its
  associated token limits. You may still be charged for tokens used after the
  subscription ends if it passes the subscription's token limit.
</Info>

## After Cancellation

* Your account will automatically switch to the Free plan when your subscription ends
* You'll retain access to your projects and can continue using Same with Free plan limits
* You can resubscribe at any time to regain access to premium features

## Need Help?

If you're experiencing any issues with cancellation or have questions about your subscription, please contact our support team at [support@same.dev](mailto:support@same.dev).

For information about our refund policy, please see our [Refunds](/usage/refunds) page.


# Downgrade subscription
Source: https://docs.same.new/usage/downgrade-subscription

Need fewer features or a lighter plan? Downgrade your Same.new subscription easily. Keep building with the flexibility to scale up or down.

## How to Downgrade Your Subscription

You can downgrade your subscription through the settings page:

1. Go to [same.new/settings](https://same.new/settings)
2. Click "Manage Subscription"
3. Select a lower-tier plan from the pricing modal
4. Confirm your downgrade selection

## When Changes Take Effect

* You'll be billed at the lower rate for the new plan from the next billing cycle
* You can always choose to switch back to another plan when needed

## Downgrading to Free Plan

To switch to the Free plan, you need to cancel your current subscription.

Visit our [Cancel Subscription](/usage/cancel-subscription) guide for step-by-step instructions.

<Info>
  The Free plan includes 500,000 agent tokens per month. Make sure this will be sufficient for your usage before downgrading.
</Info>

## Need Help?

If you're experiencing any issues with downgrading or have questions about your subscription, please contact our support team at [support@same.dev](mailto:support@same.dev).

For more information about our pricing plans and token limits, see our [Pricing](/usage/pricing) page.


# Pricing
Source: https://docs.same.new/usage/pricing

See Same.new pricing for AI app builders. Compare free and paid plans, understand usage limits, and find the right plan for your next AI project.

> 🔔 **Pricing Update**: We've introduced new pricing tiers based on your feedback! Check out our new plans below that offer more tokens.

Same offers straightforward pricing plans designed to scale with your usage. Choose the plan that best fits your needs.

## Plans

We provide free plans by default with 500,000 tokens per month. You may upgrade to Pro as needed:

<CardGroup>
  <Card title="Basic - $10/month" icon="sparkles">
    <div>
      <span>**Included:**</span>

      <ul>
        <li>**2,000,000** tokens per month</li>
        <li>Premium model</li>
        <li>Download projects</li>
        <li>Remix projects</li>
      </ul>

      <span>Perfect for trying out Same.</span>
    </div>
  </Card>

  <Card title="Pro - $25/month" icon="bolt">
    <div>
      <span>**Included:**</span>

      <ul>
        <li>**5,000,000** tokens per month</li>
        <li>Premium model</li>
        <li>Download projects</li>
        <li>Remix projects</li>
      </ul>

      <span>Great for rapid prototyping.</span>
    </div>
  </Card>

  <Card title="Max - $50/month" icon="rocket">
    <div>
      <span>**Included:**</span>

      <ul>
        <li>**10,000,000** tokens per month</li>
        <li>Premium model</li>
        <li>Download projects</li>
        <li>Remix projects</li>
      </ul>

      <span>Perfect for building live production apps.</span>
    </div>
  </Card>

  <Card title="Ultra - $100/month" icon="crown">
    <div>
      <span>**Included:**</span>

      <ul>
        <li>**20,000,000** tokens per month</li>
        <li>Premium model</li>
        <li>Download projects</li>
        <li>Remix projects</li>
      </ul>

      <span>**Token Usage Beyond 20M:**</span>

      <ul>
        <li>Pay as you go: **\$10** per additional 2 million tokens</li>
      </ul>

      <span>Ideal for developing complex projects.</span>
    </div>
  </Card>
</CardGroup>

## What are Tokens?

Same uses "tokens" to measure the computational resources used during interactions. Think of tokens as pieces of words or code. For more details on how tokens work, see the [Tokens](/usage/tokens) page.

## How Usage is Calculated

Usage is based on **tokens**. Every interaction with Same, including processing prompts, analyzing context (like URLs or images), and generating code, consumes tokens.

Each plan includes a fixed number of tokens per month:

* **Free Plan**: 500,000 tokens
* **Basic Plan**: 2 million tokens
* **Pro Plan**: 5 million tokens
* **Max Plan**: 10 million tokens
* **Ultra Plan**: 20 million tokens

If you require more than 20 million tokens on the Ultra plan, additional usage is available at our usage-based pricing rates.

You can monitor your usage in your account settings. Learn more about [Tokens](/usage/tokens).

### Do unused tokens roll over?

All unused tokens expire at the end of each billing cycle or when your subscription ends (after cancelling). This applies to all subscription plans.

## Need More?

For enterprise needs or custom plans, please [contact us](mailto:support@same.dev).

## Previous Pricing Model

Before our new tier-based system, we offered:

* **Free Plan**: 500,000 tokens per month with community support
* **Pro Plan**: \$10/month for 2 million tokens, with additional usage charged at \$10 per 2 million tokens (\$5 per million tokens)

This pay-as-you-go model has been replaced with our new fixed-tier plans above to provide better value and more predictable pricing.


# Refunds
Source: https://docs.same.new/usage/refunds

Learn how Same.new handles refund requests. Review our policy, understand eligibility criteria, and see what steps are involved in the process.

## Refund Policy

We do not provide direct refunds for subscriptions. All subscriptions are final and non-refundable.

## Unexpected Issues

However, we understand that technical issues can sometimes occur. If you experience serious issues that significantly impact your ability to use our service, we are happy to provide compensation in the form of token credits.

### How to Request Token Credits

If you've encountered any serious issues, please reach out to our support team.

1. Provide a short description of the issue
2. Provide a screenshot of any error messages
3. Provide a url to the project

We will review each case individually and provide appropriate compensation based on the severity and impact of the issue.

Reach out to us at [support@same.dev](mailto:support@same.dev)

## Contact Us

If you have any questions about this policy, please reach out to our support team.


# Tokens
Source: https://docs.same.new/usage/tokens

Track AI token usage in Same.new, monitor your limits, and see how tokens fuel every app you build. Stay in control and never miss a deploy.

## What are Tokens?

Same uses "tokens" as the primary unit to measure the resources consumed during your interactions. Think of tokens as pieces of words or code that Same processes.

* **Roughly:** 1 token is about 4 characters in English.
* **Example:** 1,500 words is approximately 2,048 tokens.

Every interaction, from understanding your prompts and context to generating code and using tools, consumes tokens.

<Info>
  Learn more about tokens from the [official OpenAI
  docs](https://help.openai.com/en/articles/4936856-what-are-tokens-and-how-to-count-them).
</Info>

## How Usage is Calculated

Your token usage is calculated based on the complexity and size of each request you make to Same. The key factors are:

1. **Input Tokens (Context):** This includes:

   * Your prompt text.
   * The content of any files, images, or chat summaries you provide as context using the `@ Add context` button.
   * The conversation history included in the request.
   * **Calculation:** **6%** of these input tokens are counted towards your usage for each request.

2. **Output Tokens (Response):** This includes:
   * The code, text, or reasoning generated by Same.
   * Tokens used by tools (e.g., file edits, terminal commands, web searches) and their results.
   * **Calculation:** **100%** of these output tokens are counted towards your usage.

**Total Usage per Request = (6% of Input Tokens) + (100% of Output Tokens)**

<Frame>
  <img alt="Screenshot showing the chat input box with 'Model context'." />
</Frame>

## Optimizing Token Usage

* **Start New Chats Frequently:** Treat each chat like a specific task or feature. This keeps the context window smaller and focused, leading to better performance and lower costs. A summary of previous work is automatically attached to new chats for continuity. See [Maximizing Performance](/performance/maximizing-performance).
* **Use `@ Add context`:** Instead of relying on long conversation history or Same's exploration, create new chats often and use the `@ Add context` button to provide specific files or chat summaries relevant to your current request. This is much more token-efficient.
* **Be Specific:** Clear, concise prompts require fewer tokens for Same to understand and generate relevant output.
* **Monitor Usage:** Keep an eye on your token consumption in your account settings.

## Monitoring Your Usage

You can monitor your token usage within Same. Your remaining token balance and usage history are available in your account settings.

<Frame>
  <img alt="Screenshot showing where to view token usage in account settings" />
</Frame>

<Info>
  Understanding token usage helps you optimize your interactions with Same and
  manage your plan effectively. For details on pricing, see our [Pricing
  page](/usage/pricing).
</Info>


# Upgrade subscription
Source: https://docs.same.new/usage/upgrade-subscription

Upgrade your Same.new subscription to Pro, Max or Ultra. Get more tokens, faster performance, and powerful features to build without limits.

## Upgrade when you hit usage limits

When you reach your current plan's token limits while using Same, you'll be prompted to upgrade:

1. A button labeled "Upgrade Tier" will appear when you hit your usage limits
2. Click the button to view all pricing plans
3. Select your desired plan and confirm the upgrade
4. The upgrade process will complete automatically

<Frame>
  <img alt="Screenshot showing the subscription upgrade modal with pricing tiers" />
</Frame>

## Upgrading Manually

You can also upgrade your subscription at any time:

1. Go to [same.new/settings](https://same.new/settings)
2. Click the "Manage Subscription" button in the subscription section
3. Select your desired plan from the pricing modal
4. Complete the upgrade process

## After Upgrading

* Your new token limits may take a few minutes to update
* You'll be billed the amount for the new plan and your billing cycle will reset
* If you still have unused tokens from your previous plan, you will be credited for them

<Info>
  Need help with your subscription? Contact our support team at [support@same.dev](mailto:support@same.dev).
</Info>

For more information about our pricing plans and token limits, see our [Pricing](/usage/pricing) page.