Skip to main content

​
Choosing an Artboard

When a Rive object is instantiated or when a Rive file is rendered, you can specify the artboard to use. If no artboard is given, the default artboard, as set in the Rive editor, is used. If no default artboard is set, the first artboard is used. Only one artboard can be rendered at a time. 
export const Simple = () => (
  <Rive src="https://cdn.rive.app/animations/vehicles.riv" artboard="Truck" />
);

// With `useRive` Hook:
export default function Simple() {
  const { RiveComponent } = useRive({
      src: 'https://cdn.rive.app/animations/vehicles.riv',
      artboard: 'Truck',
      autoplay: true,
  });

  return <RiveComponent />;
}