revideo-psdtool

📘Documentation: https://34j.github.io/revideo-psdtool/

📦️NPM Package: https://www.npmjs.com/package/revideo-psdtool

https://github.com/user-attachments/assets/bb503b7e-49f6-4a32-8fdc-669a865b975f

Source

Installation

npm install revideo-psdtool
Copy

Usage

import { makeScene2D } from '@revideo/2d'
import { createRef, waitFor } from '@revideo/core'
import { Psd } from 'revideo-psdtool'

const scene = makeScene2D('scene', function* (view) {
  const psdRef = createRef<Psd>()
  view.add(
    <>
      <Psd
        psdSrc="/demo/ccchu.psd"
        psdToolData={{}}
        width={400}
        x={-100}
        y={85}
        ref={psdRef}
      />
    </>,
  )

  // 1. Change look
  // See https://34j.github.io/react-ag-psd-psdtool/
  // for options of psdToolData for your PSD file
  psdRef().psdToolData({ right_eye: 'wink' })

  // 2. Flip the PSD without "mirroring"
  // (unchanged text, flipped hair ornaments, etc.)
  psdRef().psdToolRenderOptions({ flipx: true })
})
Copy