แบบอักษร น้ำหนัก และสี

A plain Text view shows words, but real apps style them. In this lesson you will set font, weight, and color to make text feel intentional. 🎨

The font modifier picks a text style. Apple ships semantic sizes like title, headline, and body that adapt to the user automatically.

Prefer semantic styles over fixed point sizes. Names like .largeTitle and .caption scale with the device and the user accessibility settings.

Need an exact size? Pass .system(size:) with a number. It is handy for logos, but semantic styles are better for body text.

The fontWeight modifier sets how thick the strokes look. Try .bold for emphasis or .light for a softer, airier feel.

You can also bake the weight right into the font call. This keeps related styling in one tidy place.

Use foregroundStyle to color text. Pass a Color like .red or a brand color, and the words pick up that tint instantly.

Reach for semantic colors like .primary and .secondary. They adapt to light and dark mode so your text stays readable everywhere.

SwiftUI offers quick toggles: .bold() and .italic(). They read cleanly and skip the longer modifier names.

Modifiers stack top to bottom. Combine font, weight, and color on one Text to shape its full look in a single chain.

Most text modifiers commute, but order matters once layout enters. Keep styling first, then add padding or background later.

Which modifier sets the text color?

You styled text with font, fontWeight, and foregroundStyle. Lean on semantic styles and colors so your UI adapts beautifully. ✨