<?xml version="1.0" encoding="utf-8"?>

Stroke paints

Stroke paints

Stroke properties are accessible within the Design panel in Figma, with various options to customize stroke appearance. The Paints property allows the addition of solid colors, gradients, or images to a stroke. It also supports multiple paints on a single stroke, enabling diverse and intricate designs.

To add paints to strokes:

  1. In the Design panel, locate the Stroke section.
  2. Click on the color swatch to open the color picker and select from solid, gradient, or image fills. Adjust opacity as desired.
  3. Click "+" to layer more paints, mixing colors or textures.
  4. Use the eye icon to experiment with the visibility of different paint layers without having to make any permanent changes.
  5. Click "-" to delete a paint layer or stroke.

Pro Tip: When adding more than one stroke paint layer, the weight, position, and style properties of all layers must be the same.

Improve your UX & Product skills with interactive courses that actually work