> ## Documentation Index
> Fetch the complete documentation index at: https://fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Embed Fillout forms on React

> Increase conversions and intake data by embedding a powerful Fillout form on your React app.

<CardGroup cols={1}>
  <Card title="React" icon="react" iconType="regular" color="#FFC738" horizontal href="https://www.npmjs.com/package/@fillout/react">
    View the docs and get started here
  </Card>
</CardGroup>

## What is React?

[**React**](https://react.dev/?ref=filloutforms-helparticle) is a JavaScript library for building user interfaces, allowing developers to create interactive and dynamic web applications efficiently. It provides a modular and declarative approach to building UI components, facilitating the development of scalable and maintainable applications.

## How it works

Embedding Fillout forms in a custom-built React app can be a great way to get refined control over how the forms are displayed on your site. You’ll also be able to define custom button designs for embeds like popups and sliders. To start embedding, simply add the `@fillout/react` npm library to your React project, and then select what kind of embed you’d like to use.

For example, embed a popup form using either a standard button or a custom one:

<img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/u2EZ6ISDg1R6HSZi/images/sharing-and-embedding/image-46.png?fit=max&auto=format&n=u2EZ6ISDg1R6HSZi&q=85&s=a83882eef5f187390eca70c4542ac4c1" alt="Screenshot of the Share tab of a form" width="3452" height="1756" data-path="images/sharing-and-embedding/image-46.png" />

## Related article

<CardGroup cols={3}>
  <Card title="Share & embed" icon="arrow-up-right-from-square" iconType="regular" color="#FFC738" href="/sharing">
    Share your forms via link, embed, or QR code.
  </Card>
</CardGroup>