FillShapeStyle struct

How it works

FillShapeStyle is the shape style behind the fill shortcut: a context-dependent neutral fill that adapts to its surroundings, foreground material, and the current light or dark appearance. Reach for it when you need a filled background or shape that reads as part of the system's surface hierarchy rather than a fixed color you have to hand-tune. Because it resolves at render time against the environment, the same fill stays legible whether it sits on a card, inside a sheet, or over a vibrant material.

1. Apply the style with .fill

   FillShapeStyle is rarely named directly; you reach it through the ShapeStyle static member fill. Passing .fill to a shape's fill(_:) modifier paints the shape with the adaptive neutral fill, as in RoundedRectangle(cornerRadius: 12).fill(.fill).

2. Fill a shape via fill(_:)

   Any Shape accepts a ShapeStyle through fill(_:), and FillShapeStyle conforms to ShapeStyle, so it slots in wherever a color or gradient would. Here it gives the RoundedRectangle a system-appropriate body, then frame(width:height:) and an overlay(Text("Filled")) sit on top unchanged.

3. Step down emphasis with hierarchical levels

   FillShapeStyle exposes the same hierarchical accessors as other adaptive styles, so .secondary, .tertiary, .quaternary, and .quinary return progressively fainter variants of the same fill. Circle().fill(.fill.tertiary) requests the third level, producing a lighter wash than the plain .fill used above it.

4. Let the environment resolve the color

   FillShapeStyle has no color parameter of its own; it computes its appearance from the surrounding context and color scheme when the view is drawn. That is why both .fill and .fill.tertiary shift automatically between light and dark mode without any conditional code in FillShapeStyleDemo.