Carousel System

Install

npm install

Input CSV Format

Required columns:

• heading
• text

Optional columns:

• image
• imagebg

Example file: examples/sample.csv

Validate CSV

npm run validate -- --csv examples/sample.csv

Validation rules:

• heading and text are required
• remote URLs in image / imagebg must return content-type: image/jpeg
• invalid CSV fails before render/preview

Styling controls:

• --text-position top|middle|bottom
• --font-color "#heading,#text" (if one color is provided, both use it)
• --image-fit contain|cover
• --imagebg-mode always|fallback

Generate MP4 (default mode)

npm run generate -- --csv examples/sample.csv

With options:

npm run generate -- --csv examples/sample.csv --duration 3 --format vertical
npm run generate -- --csv examples/sample.csv --text-position middle --font-color "#ffffff,#e5e7eb"
npm run generate -- --csv examples/sample.csv --image-fit cover --imagebg-mode fallback

Outputs to:

• out/<csv-name>.mp4 (auto-increment if file exists)

Generate Carousel PNG Slides

npm run generate -- --csv examples/sample.csv --mode carousel --duration 3 --format square

Outputs to:

• out/<csv-name>/slide-01.png
• out/<csv-name>/slide-02.png
• ...

Preview in Remotion Studio

npm run preview -- --csv examples/sample.csv

With options:

npm run preview -- --csv examples/sample.csv --duration 3 --format horizontal
npm run preview -- --csv examples/sample.csv --text-position top --font-color "#fefefe,#d1d5db"
npm run preview -- --csv examples/sample.csv --image-fit contain --imagebg-mode always

Optional Config

carousel.config.js supports:

• font
• colors
• fps
• defaultFormat
• colors.placeholderStart
• colors.placeholderEnd

CLI flags override config values.