kinetograph.

A red-orange halo round the bright parts of a picture, with film grain on top.

$npx kinetograph add halation
Source

Props

Every prop has a default, so the component renders as it is. Change any of them in Studio or in code.

  • src

    string = "photos/nasa-city-2.jpg"

    Picture in public/ (used when no children are given).

  • strength

    number = 1

    How much glow is added back. 0 is off, 1 is a visible but gentle halo.

  • radius

    number = 30

    Reach of the tight halo in pixels (the wide one is 3.2 times that).

  • threshold

    number = 0.14

    How bright a pixel must be (linear) before it glows. Lower glows more of the picture.

  • tint

    colour = "#ff5a2a"

    The colour of the halo. Film halation is red-orange.

  • tintMix

    number = 0.62

    0 glows in the highlight's own colour, 1 in the tint.

  • grain

    number = 0.07

    Film grain amount (0 for none).

  • grainSize

    number = 1.4

    Grain size in pixels.

  • fadeIn

    integer = 36

    Frames the glow takes to come on at the start.

  • push

    number = 0.04

    How far the picture pushes in over the shot (0.04 is 4 percent).

Compositions

  • Halation