render(element, container)

Render element at Figma container.

element (required)

Top-level React component that defines your Figma app.

Example:

<Page name="Mobile">

<Frame name="iPhone">

<View>

<Text>Hello World</Text>

</View>

</Frame>

</Page>

container (required)

The element to render into. It's recommended to use figma.root or figma.currentPage.

Examples

Render multiple pages:

import { Page, View, Text, render } from 'react-figma';

const App = () => (

<>

<Page name="Page 1">

<View>

<Text>Hello world!</Text>

</View>

</Page>

<Page name="Page 2">

<View>

<Text>Hello world!</Text>

</View>

</Page>

</>

);

export default () => {

render(<App />, figma.root);

};

Render to figma.currentPage:

import { View, Text, render } from 'react-figma';

const App = () => (

<View>

<Text>Hello world!</Text>

</View>

);

export default () => {

render(<App />, figma.currentPage);

};