# MeshGradient A two-dimensional gradient defined by a 2D grid of positioned colors. ``` nonisolated struct MeshGradient ``` ## 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 ]) ``` ## Relationships ### Conforms To [`ShapeStyle`](/documentation/SwiftUI/ShapeStyle) [`Escapable`](/documentation/Swift/Escapable) [`Sendable`](/documentation/Swift/Sendable) [`Equatable`](/documentation/Swift/Equatable) [`View`](/documentation/SwiftUI/View) [`SendableMetatype`](/documentation/Swift/SendableMetatype) [`Copyable`](/documentation/Swift/Copyable) --- Copyright © 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)