Components

LinearGradient

LinearGradient fills a view using color stops distributed along a line.

Example

Requires React 18.2+ or 19 and shared styles. See setup.

Example

Loading preview…

Code
'use client';
import { LinearGradient } from '@swiftuijs/ui';
export default function Example() {
    return (<LinearGradient endPoint="bottomTrailing" startPoint="topLeading" stops={[
            { color: '#0a84ff', location: 0 },
            { color: '#64d2ff', location: 0.45 },
            { color: '#30d158', location: 1 },
        ]} style={{
            borderRadius: '20px',
            height: '220px',
            width: '100%',
        }}></LinearGradient>);
}

API reference

PropTypeRequiredDescription
startPointIUnitPointNo—
endPointIUnitPointNo—
stopsIGradientStop[]Yes—

Inherits additional props from IBaseComponent.