---
title: MeshGradient
framework: swiftui
role: symbol
role_heading: Structure
path: swiftui/meshgradient
---

# MeshGradient

A two-dimensional gradient defined by a 2D grid of positioned colors.

## Declaration

```swift
nonisolated struct MeshGradient
```

## Overview

Overview Each vertex has a position, a color and four surrounding Bezier control points (leading, top, trailing, bottom) that define the tangents connecting the vertex with its four neighboring vertices. (Vertices on the corners or edges of the mesh have less than four neighbors, they ignore their extra control points.) Control points may either be specified explicitly or implicitly. When rendering, a tessellated sequence of Bezier patches are created, and vertex colors are interpolated across each patch, either linearly, or via another set of cubic curves derived from how the colors change between neighbors – the latter typically gives smoother color transitions. MeshGradient(width: 3, height: 3, points: [     .init(0, 0), .init(0.5, 0), .init(1, 0),     .init(0, 0.5), .init(0.5, 0.5), .init(1, 0.5),     .init(0, 1), .init(0.5, 1), .init(1, 1) ], colors: [     .red, .purple, .indigo,     .orange, .white, .blue,     .yellow, .green, .mint ])

## Topics

### Structures

- [MeshGradient.BezierPoint](swiftui/meshgradient/bezierpoint.md)

### Initializers

- [init(width:height:bezierPoints:colors:background:smoothsColors:colorSpace:)](swiftui/meshgradient/init(width:height:bezierpoints:colors:background:smoothscolors:colorspace:).md)
- [init(width:height:bezierPoints:resolvedColors:background:smoothsColors:colorSpace:)](swiftui/meshgradient/init(width:height:bezierpoints:resolvedcolors:background:smoothscolors:colorspace:).md)
- [init(width:height:locations:colors:background:smoothsColors:colorSpace:)](swiftui/meshgradient/init(width:height:locations:colors:background:smoothscolors:colorspace:).md)
- [init(width:height:points:colors:background:smoothsColors:colorSpace:)](swiftui/meshgradient/init(width:height:points:colors:background:smoothscolors:colorspace:).md)
- [init(width:height:points:resolvedColors:background:smoothsColors:colorSpace:)](swiftui/meshgradient/init(width:height:points:resolvedcolors:background:smoothscolors:colorspace:).md)

### Instance Properties

- [background](swiftui/meshgradient/background.md)
- [colorSpace](swiftui/meshgradient/colorspace.md)
- [colors](swiftui/meshgradient/colors-swift.property.md)
- [height](swiftui/meshgradient/height.md)
- [locations](swiftui/meshgradient/locations-swift.property.md)
- [smoothsColors](swiftui/meshgradient/smoothscolors.md)
- [width](swiftui/meshgradient/width.md)

### Enumerations

- [MeshGradient.Colors](swiftui/meshgradient/colors-swift.enum.md)
- [MeshGradient.Locations](swiftui/meshgradient/locations-swift.enum.md)

## Relationships

### Conforms To

- [Copyable](swift/copyable.md)
- [Equatable](swift/equatable.md)
- [Escapable](swift/escapable.md)
- [Sendable](swift/sendable.md)
- [SendableMetatype](swift/sendablemetatype.md)
- [ShapeStyle](swiftui/shapestyle.md)
- [View](swiftui/view.md)

## See Also

### Styling content

- [border(_:width:)](swiftui/view/border(_:width:).md)
- [foregroundStyle(_:)](swiftui/view/foregroundstyle(_:).md)
- [foregroundStyle(_:_:)](swiftui/view/foregroundstyle(_:_:).md)
- [foregroundStyle(_:_:_:)](swiftui/view/foregroundstyle(_:_:_:).md)
- [backgroundStyle(_:)](swiftui/view/backgroundstyle(_:).md)
- [backgroundStyle](swiftui/environmentvalues/backgroundstyle.md)
- [ShapeStyle](swiftui/shapestyle.md)
- [AnyShapeStyle](swiftui/anyshapestyle.md)
- [Gradient](swiftui/gradient.md)
- [AnyGradient](swiftui/anygradient.md)
- [ShadowStyle](swiftui/shadowstyle.md)
- [Glass](swiftui/glass.md)