kinetograph.

Soft pools of blue and cyan drift like defocused light through water.

$npx kinetograph add drift-gradient
Source

It loops with no join.

Props

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

  • deep

    colour = "#000c8c"

    The darkest pools (navy ultramarine).

  • mid

    colour = "#0052d0"

    The body of the field (electric blue).

  • light

    colour = "#00a2ee"

    The lighter field around the bright pools (sky blue).

  • glow

    colour = "#00dcf6"

    The brightest pools (cyan).

  • tint

    colour = "#0b8eaa"

    The cast along the edges (teal).

  • scale

    number = 1

    Size of the pools: higher is larger.

  • contrast

    number = 1

    How dark the dark pools and how bright the bright ones get.

  • speed

    number = 1

    Loops per 10 seconds. Whole numbers loop seamlessly.

Compositions

  • DriftGradient