meo-canvas
    Preparing search index...

    Type Alias Gradient

    Gradient:
        | { direction?: GradientDirection; type: "linear" } & GradientRamp
        | { at?: GradientCenter; type: "radial" } & GradientRamp
        | { at?: GradientCenter; from?: number; type: "conic" } & GradientRamp

    A gradient, as a fill or as the alpha of a Mask.

    One kind per geometry, and each carries only what it reads: a radial gradient has no direction and a linear one has no centre, so neither can be given a value nothing looks at.

    import type { Gradient } from 'meo-canvas'

    const fade: Gradient = { type: 'linear', direction: 'to-bottom', colors: ['#101014', 'transparent'] }
    const dial: Gradient = { type: 'conic', from: 90, stops: [{ offset: 0, color: '#f0c' }] }

    Type Declaration

    • { direction?: GradientDirection; type: "linear" } & GradientRamp
      • Optional Readonlydirection?: GradientDirection

        Which way the ramp runs. Absent is top to bottom.

      • Readonlytype: "linear"

        Selects the linear geometry: a ramp along a straight line.

    • { at?: GradientCenter; type: "radial" } & GradientRamp
      • Optional Readonlyat?: GradientCenter

        The centre it spreads from. Absent is the middle of the box.

      • Readonlytype: "radial"

        Selects the radial geometry: a ramp outward from a point.

    • { at?: GradientCenter; from?: number; type: "conic" } & GradientRamp
      • Optional Readonlyat?: GradientCenter

        The point it sweeps around. Absent is the middle of the box.

      • Optional Readonlyfrom?: number

        Where the sweep begins, in degrees clockwise from twelve o'clock.

      • Readonlytype: "conic"

        Selects the conic geometry: a ramp swept around a point.