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

# Introduction

> Turn your concepts into working applications. HypeFrame transforms your ideas into production-ready full-stack web apps in minutes.

## Transform ideas into applications

Got a concept? A design file? Just describe what you want to build. HypeFrame takes your input and generates complete, functional web applications with everything you need included. Perfect for MVPs, internal tools, prototypes, or production apps.

## How it works

<Steps>
  <Step title="Share your vision">
    Tell HypeFrame what you want to build. Describe your app idea in plain language, or share a link to your design file from Figma or other design tools.

    <Card title="Getting started" icon="rocket" href="/getting-started/start.project">
      Learn the basics of describing your app to HypeFrame.
    </Card>
  </Step>

  <Step title="Import your designs">
    If you have designs ready, share the link. HypeFrame reads your design files
    and understands the structure, components, and layout you want.

    <Card title="Working with designs" icon="palette" href="/integrations/figma">
      Best practices for preparing and sharing your design files.
    </Card>
  </Step>

  <Step title="Build and refine">
    HypeFrame generates your application code. Review it, make changes through
    conversation, and iterate until it's exactly what you need.

    <Card title="Building your app" icon="code" href="/prompting/getstarted-with-prompting">
      Understand how HypeFrame creates your application.
    </Card>
  </Step>

  <Step title="Deploy and share">
    Once you're happy with your app, deploy it with a single click. Your application goes live and is ready for users.

    <Card title="Deployment" icon="globe" href="/build/deployment">
      Learn how to publish your application.
    </Card>
  </Step>
</Steps>

## Organize your projects

<CardGroup cols={3}>
  <Card title="Your projects" icon="folder" href="/getting-started/start.project">
    Access all your applications in one place. Open, continue, or duplicate any project whenever you need.
  </Card>

  <Card title="Project configuration" icon="gear" href="/build/management">
    Customize how your applications are built. Set environments, configure
    deployment options, and adjust settings.
  </Card>

  <Card title="Account settings" icon="user" href="/getting-started/create.account">
    Manage your profile, preferences, and account details.
  </Card>
</CardGroup>

## Everything you need to build

<AccordionGroup>
  <Accordion title="Natural language editing">
    Talk to HypeFrame like you would to a developer. Ask for changes, new features, or fixes using everyday language, and watch your app update automatically.

    <Card title="Using the chat interface" icon="message" href="/prompting/prompting-strategies">
      Master the art of describing changes and features to HypeFrame.
    </Card>
  </Accordion>

  <Accordion title="Full code access">
    Want to see what's under the hood? View the complete source code HypeFrame
    generates. Edit it directly when you need precise control or want to add
    custom functionality.

    <Card title="Code editor" icon="code" href="/prompting/getstarted-with-prompting">
      Learn how to view and modify your application's code.
    </Card>
  </Accordion>

  <Accordion title="Live preview">
    See your application in action before you deploy. Preview changes instantly in
    your browser and test everything works as expected.

    <Card title="Preview mode" icon="eye" href="/build/deployment">
      Use the preview feature to test your application.
    </Card>
  </Accordion>

  <Accordion title="Data and user management">
    Need to store data or manage users? Just ask HypeFrame to add these features
    to your app. Everything you need is already available—simply request what you
    want, and it's integrated seamlessly into your application.

    <Card title="Data and user management" icon="plug" href="/integrations/database">
      Learn how to add data storage and user management to your applications.
    </Card>
  </Accordion>

  <Accordion title="One-click deployment">
    Ready to go live? Deploy your application to the web instantly. No complex
    setup, no configuration headaches—just click and your app is live. Once
    deployed, you'll automatically have access to insights about your website's
    performance and how users interact with it.

    <Card title="Deploy your app" icon="rocket" href="/build/deployment">
      Publish your application to production in seconds.
    </Card>
  </Accordion>

  <Accordion title="Track your application">
    Want to understand how your app is performing? View page views, user interactions, and performance metrics right in HypeFrame. No additional setup needed—it's all there when you need it.

    <Card title="Analytics and insights" icon="chart" href="/build/analytics">
      Learn how to access and use analytics for your deployed applications.
    </Card>
  </Accordion>
</AccordionGroup>

## Master the art of building with AI

<CardGroup cols={2}>
  <Card title="Effective communication" icon="lightbulb" href="/prompting/prompting-strategies">
    Learn how to describe your ideas clearly so HypeFrame understands exactly what you want to build.
  </Card>

  <Card title="Advanced techniques" icon="rocket" href="/prompting/prompting-examples">
    Discover strategies for building complex applications and achieving polished,
    professional results.
  </Card>

  <Card title="Example prompts" icon="book" href="/prompting/prompting-examples">
    Browse a collection of proven prompts and examples to inspire your own
    projects.
  </Card>

  <Card title="Troubleshooting" icon="wrench" href="/prompting/prompting-strategies">
    Learn how to refine your requests and fix issues when things don't turn out as expected.
  </Card>
</CardGroup>

## Pricing and subscriptions

<Info>
  Find the right plan for your needs. Whether you're building one project or
  many, we have options that scale with you.
</Info>

<Info>
  Your subscription is flexible. Upgrade, downgrade, or cancel anytime—no
  long-term commitments required.
</Info>

## What you can build

**HypeFrame works for everyone building web applications.**\
Here's what people are creating:

* Minimum viable products for testing ideas quickly
* Business dashboards and internal tools for teams
* Client presentations and interactive prototypes
* Workflow automation and productivity apps
* Full production applications ready for real users

Ready to start? [Create your first application with HypeFrame](https://hypeframe.ai)

## Get support

**We're here to help you succeed.**\
Have questions? Need assistance? Reach out to us for help, feedback, and collaboration.

<CardGroup cols={2}>
  <Card title="Email support" icon="mail" href="mailto:contact@hypeframe.ai">
    Send us an email and we'll get back to you as soon as possible.
  </Card>

  <Card title="Discord community" icon="message" href="https://discord.gg/ZJDSJxwx">
    Join our Discord community to connect with other builders and get help.
  </Card>
</CardGroup>