With this hook you can add custom props to the canvas element. But there are some props that cannot be overwritten. They are:

  • dpr For now it's fixed to 1. The user can export the canvas with a higher resolution.
  • gl.preserveDrawingBuffer Used for exporting the canvas.
  • style.height Controlled by the user.
  • style.width Controlled by the user.

If you need to overwrite any of these props, please let us know.

Example of use.

import { useEffect } from 'react'
import { useCanvasProps } from './effect-control'
export default function App({
  const { setCanvasProps } = useCanvasProps()
  useEffect(() => {
    setCanvasProps({ flat: true, frameloop: 'demand' })
  }, [])
  return (