<!--
{
  "documentType" : "article",
  "framework" : "SwiftUI",
  "identifier" : "/documentation/SwiftUI/View-Graphics-and-Rendering",
  "metadataVersion" : "0.1.0",
  "role" : "collectionGroup",
  "title" : "Graphics and rendering modifiers"
}
-->

# Graphics and rendering modifiers

Affect the way the system draws a view, for example by scaling or masking a view,
or by applying graphical effects.

## Overview

Use these view modifiers to apply many of the rendering effects typically
associated with a graphics context, like adding masks and creating composites.
You can apply these effects to graphical views, like [Shapes](/documentation/SwiftUI/Shapes), as well
as any other SwiftUI view.

When you do need the flexibility of immediate mode drawing in a graphics
context, use a [`Canvas`](/documentation/SwiftUI/Canvas) view instead. This can be particularly helpful
when you want to draw an extremely large number of dynamic shapes
— for example, to create particle effects.

For more information about using these effects in your app, see
[Drawing and graphics](/documentation/SwiftUI/Drawing-and-graphics).

## Topics

### Masks and clipping

[`mask(alignment:_:)`](/documentation/SwiftUI/View/mask(alignment:_:))

Masks this view using the alpha channel of the given view.

[`clipped(antialiased:)`](/documentation/SwiftUI/View/clipped(antialiased:))

Clips this view to its bounding rectangular frame.

[`clipShape(_:style:)`](/documentation/SwiftUI/View/clipShape(_:style:))

Sets a clipping shape for this view.

[`containerShape(_:)`](/documentation/SwiftUI/View/containerShape(_:))

Sets the container shape to use for any container relative shape or
concentric rectangle within this view.

### Scale

[`scaledToFill()`](/documentation/SwiftUI/View/scaledToFill())

Scales this view to fill its parent.

[`scaledToFill3D()`](/documentation/SwiftUI/View/scaledToFill3D())

Scales this view to fill its parent.

[`scaledToFit()`](/documentation/SwiftUI/View/scaledToFit())

Scales this view to fit its parent.

[`scaledToFit3D()`](/documentation/SwiftUI/View/scaledToFit3D())

Scales this view to fit its parent.

[`scaleEffect(_:anchor:)`](/documentation/SwiftUI/View/scaleEffect(_:anchor:))

Scales this view uniformly by the specified factor,
relative to an anchor point.

[`scaleEffect(x:y:anchor:)`](/documentation/SwiftUI/View/scaleEffect(x:y:anchor:))

Scales this view’s rendered output by the given horizontal and vertical
amounts, relative to an anchor point.

[`scaleEffect(x:y:z:anchor:)`](/documentation/SwiftUI/View/scaleEffect(x:y:z:anchor:))

Scales this view by the specified horizontal, vertical, and depth
factors, relative to an anchor point.

[`imageScale(_:)`](/documentation/SwiftUI/View/imageScale(_:))

Scales images within the view according to one of the relative sizes
available including small, medium, and large images sizes.

[`aspectRatio(_:contentMode:)`](/documentation/SwiftUI/View/aspectRatio(_:contentMode:))

Constrains this view’s dimensions to the specified aspect ratio.

[`aspectRatio3D(_:contentMode:)`](/documentation/SwiftUI/View/aspectRatio3D(_:contentMode:))

Constrains this view’s dimensions to the specified 3D aspect ratio.

### Rotation and transformation

[`rotationEffect(_:anchor:)`](/documentation/SwiftUI/View/rotationEffect(_:anchor:))

Rotates a view’s rendered output in two dimensions around the specified
point.

[`rotation3DEffect(_:anchor:)`](/documentation/SwiftUI/View/rotation3DEffect(_:anchor:))

Rotates the view’s content by the specified 3D rotation value.

[`rotation3DEffect(_:axis:anchor:anchorZ:perspective:)`](/documentation/SwiftUI/View/rotation3DEffect(_:axis:anchor:anchorZ:perspective:))

Renders a view’s content as if it’s rotated in three dimensions around
the specified axis.

[`rotation3DEffect(_:axis:anchor:)`](/documentation/SwiftUI/View/rotation3DEffect(_:axis:anchor:))

Rotates the view’s content by an angle about an axis that you specify
as a tuple of elements.

[`rotation3DLayout(_:)`](/documentation/SwiftUI/View/rotation3DLayout(_:))

Rotates a view with impacts to its frame in a containing layout

[`rotation3DLayout(_:axis:)`](/documentation/SwiftUI/View/rotation3DLayout(_:axis:))

Rotates a view with impacts to its frame in a containing layout

[`perspectiveRotationEffect(_:axis:anchor:anchorZ:perspective:)`](/documentation/SwiftUI/View/perspectiveRotationEffect(_:axis:anchor:anchorZ:perspective:))

Renders a view’s content as if it’s rotated in three dimensions around
the specified axis.

[`projectionEffect(_:)`](/documentation/SwiftUI/View/projectionEffect(_:))

Applies a projection transformation to this view’s rendered output.

[`transformEffect(_:)`](/documentation/SwiftUI/View/transformEffect(_:))

Applies an affine transformation to this view’s rendered output.

[`transform3DEffect(_:)`](/documentation/SwiftUI/View/transform3DEffect(_:))

Applies a 3D transformation to this view’s rendered output.

### Graphical effects

[`blur(radius:opaque:)`](/documentation/SwiftUI/View/blur(radius:opaque:))

Applies a Gaussian blur to this view.

[`opacity(_:)`](/documentation/SwiftUI/View/opacity(_:))

Sets the transparency of this view.

[`brightness(_:)`](/documentation/SwiftUI/View/brightness(_:))

Brightens this view by the specified amount.

[`contrast(_:)`](/documentation/SwiftUI/View/contrast(_:))

Sets the contrast and separation between similar colors in this view.

[`colorInvert()`](/documentation/SwiftUI/View/colorInvert())

Inverts the colors in this view.

[`colorMultiply(_:)`](/documentation/SwiftUI/View/colorMultiply(_:))

Adds a color multiplication effect to this view.

[`saturation(_:)`](/documentation/SwiftUI/View/saturation(_:))

Adjusts the color saturation of this view.

[`grayscale(_:)`](/documentation/SwiftUI/View/grayscale(_:))

Adds a grayscale effect to this view.

[`hueRotation(_:)`](/documentation/SwiftUI/View/hueRotation(_:))

Applies a hue rotation effect to this view.

[`luminanceToAlpha()`](/documentation/SwiftUI/View/luminanceToAlpha())

Adds a luminance to alpha effect to this view.

[`shadow(color:radius:x:y:)`](/documentation/SwiftUI/View/shadow(color:radius:x:y:))

Adds a shadow to this view.

[`visualEffect(_:)`](/documentation/SwiftUI/View/visualEffect(_:))

Applies effects to this view, while providing access to layout
information through a geometry proxy.

[`visualEffect3D(_:)`](/documentation/SwiftUI/View/visualEffect3D(_:))

Applies effects to this view, while providing access to layout
information through a 3D geometry proxy.

[`materialActiveAppearance(_:)`](/documentation/SwiftUI/View/materialActiveAppearance(_:))

Sets an explicit active appearance for materials in this view.

### Shaders

[`colorEffect(_:isEnabled:)`](/documentation/SwiftUI/View/colorEffect(_:isEnabled:))

Returns a new view that applies `shader` to `self` as a filter
effect on the color of each pixel.

[`distortionEffect(_:maxSampleOffset:isEnabled:)`](/documentation/SwiftUI/View/distortionEffect(_:maxSampleOffset:isEnabled:))

Returns a new view that applies `shader` to `self` as a
geometric distortion effect on the location of each pixel.

[`layerEffect(_:maxSampleOffset:isEnabled:)`](/documentation/SwiftUI/View/layerEffect(_:maxSampleOffset:isEnabled:))

Returns a new view that applies `shader` to `self` as a filter
on the raster layer created from `self`.

### Composites

[`blendMode(_:)`](/documentation/SwiftUI/View/blendMode(_:))

Sets the blend mode for compositing this view with overlapping views.

[`compositingGroup()`](/documentation/SwiftUI/View/compositingGroup())

Wraps this view in a compositing group.

[`drawingGroup(opaque:colorMode:)`](/documentation/SwiftUI/View/drawingGroup(opaque:colorMode:))

Composites this view’s contents into an offscreen image before final
display.

### Animations

[`animation(_:)`](/documentation/SwiftUI/View/animation(_:))

Applies the given animation to this view when this view changes.

[`animation(_:value:)`](/documentation/SwiftUI/View/animation(_:value:))

Applies the given animation to this view when the specified value
changes.

[`animation(_:body:)`](/documentation/SwiftUI/View/animation(_:body:))

Applies the given animation to all animatable values within the `body`
closure.

[`contentTransition(_:)`](/documentation/SwiftUI/View/contentTransition(_:))

Modifies the view to use a given transition as its method of animating
changes to the contents of its views.

[`geometryGroup()`](/documentation/SwiftUI/View/geometryGroup())

Isolates the geometry (e.g. position and size) of the view
from its parent view.

[`keyframeAnimator(initialValue:repeating:content:keyframes:)`](/documentation/SwiftUI/View/keyframeAnimator(initialValue:repeating:content:keyframes:))

Loops the given keyframes continuously, updating
the view using the modifiers you apply in `body`.

[`keyframeAnimator(initialValue:trigger:content:keyframes:)`](/documentation/SwiftUI/View/keyframeAnimator(initialValue:trigger:content:keyframes:))

Plays the given keyframes when the given trigger value changes, updating
the view using the modifiers you apply in `body`.

[`matchedGeometryEffect(id:in:properties:anchor:isSource:)`](/documentation/SwiftUI/View/matchedGeometryEffect(id:in:properties:anchor:isSource:))

Defines a group of views with synchronized geometry using an
identifier and namespace that you provide.

[`matchedTransitionSource(id:in:)`](/documentation/SwiftUI/View/matchedTransitionSource(id:in:))

Identifies this view as the source of a navigation transition, such
as a zoom transition.

[`matchedTransitionSource(id:in:configuration:)`](/documentation/SwiftUI/View/matchedTransitionSource(id:in:configuration:))

Identifies this view as the source of a navigation transition, such
as a zoom transition.

[`phaseAnimator(_:content:animation:)`](/documentation/SwiftUI/View/phaseAnimator(_:content:animation:))

Animates effects that you apply to a view over a sequence of phases
that change continuously.

[`phaseAnimator(_:trigger:content:animation:)`](/documentation/SwiftUI/View/phaseAnimator(_:trigger:content:animation:))

Animates effects that you apply to a view over a sequence of phases
that change based on a trigger.

[`transition(_:)`](/documentation/SwiftUI/View/transition(_:))

Associates a transition with the view.

[`transaction(_:)`](/documentation/SwiftUI/View/transaction(_:))

Applies the given transaction mutation function to all animations used
within the view.

[`transaction(value:_:)`](/documentation/SwiftUI/View/transaction(value:_:))

Applies the given transaction mutation function to all animations used
within the view.

[`transaction(_:body:)`](/documentation/SwiftUI/View/transaction(_:body:))

Applies the given transaction mutation function to all animations used
within the `body` closure.


---

Copyright &copy; 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)