kinetograph.
Terminology

Props

Input values you give a composition, from defaults, a zod schema or the --props option.

Props are the values a composition receives, such as a title or a colour. You can change them without editing the code.

npx kinetograph render src/index.tsx --comp Card --props '{"title":"Hello"}'

The component gets defaultProps with the --props values merged over them. getInputProps() returns the --props object.

--props takes a JSON object or the path of a JSON file. Add a zod 4 schema to a composition and Studio draws a form from it. Props saved as a preset are a JSON file in presets/.

See also

On this page